Override gwt-image

115 views
Skip to first unread message

mtrebizan

unread,
May 14, 2012, 6:15:15 AM5/14/12
to google-we...@googlegroups.com
hi,
another problem with ClientBundle ... I have basic css, in which i have if statement for IE8- ..
@if user.agent ie6 ie8 {
    @sprite .gwt-TabBarItem .tabMiddleCenterInner {
        gwt-image: "tab";
        background-position: right top;
        width: auto;
        margin-left: 8px;
        overflow: visible;
        display: block;
        color: #888;
    }
}

when I try to extend this css with another CSS, I am not able to remove this background image...
@if user.agent ie6 ie8 {
    .gwt-TabBarItem .tabMiddleCenterInner {
        background: #fff;
    }
}

and extending is working, because other differences are visible. any help would be appreciate.

mtrebizan

unread,
May 14, 2012, 8:16:11 AM5/14/12
to google-we...@googlegroups.com
sorry, my bad. The CSS that worked was in the CSS file which was not in the same package. And the CSS file that overrides tabbar, wasn't included by the XML. everything works fine :)

Joseph Lust

unread,
May 16, 2012, 2:58:40 PM5/16/12
to google-we...@googlegroups.com
This is why I don't use the common "public" folder hierarchy as it fosters this kind of error.

I suggest:

com.yourApp.yourPkg.resources/
(interfaces like MyResources at this level) 
images/ (raw images)
css/ (raw CSS)
 
This way:
  • All CSS/images are self contained within that package (i.e. a custom widget)
  • You don't need to have the files in "public" copied to your war, even if they are unused 
  • You don't have the common problem of 20 widgets using the same CSS file (selector hell).
  • Makes it easier to use @Source annotation since its just "images/name.png", not "../../../../otherPkg/public/images/name.png"

Sincerely,
Joseph
 
Reply all
Reply to author
Forward
0 new messages