incubator-adffaces-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Simon_Less...@DMR.CA
Subject inhibiting css properties in skin definition file
Date Thu, 06 Jul 2006 22:19:30 GMT
Hmmm... strange...  I just reproduced it using the current snapshot 
release on Trinidad site and the selector works "fine". Here's my skin.

.AFDefaultFont:alias {
  color:       inherit; 
  font-size:   10pt;
  font-weight: inherit;
}
 
.AFLightBackground:alias { 
  background-color : red;
}

af|menuList { }
 
af|menuList::selected { 
  font-weight:      bold;
  background-color: blue;
}

and the page:

<af:menuList listStyle="none">
  <af:commandNavigationItem text="Selected" selected="true"/>
  <af:commandNavigationItem text="Unselected"/>
</af:menuList>

You'll see that the ::selected works because of the bold font weight that 
will be given to the selected item. 

Note that if you remove the inherit from AFDefaultFont:alias, the font 
will no longer be bold, which is another skin/rendering bug as the 
af|menuList:selected class is applied on the <td> element while the 
default font is applied directly on the <a> and if you don't specify any 
weight in that font alias, you'll inherit the font-weight: normal from 
base skin. That very strange behavior almost drove crazy the one in charge 
of the skin on the project we finished 1 week ago.

With inhibit, you would have to override DefaultFont to inhibit 
font-weight This is much better than without the option, but I believe it 
will still be annoying for the end user, hence why I proposed to not 
inherit from parent by default. Without inherit by default, the selector 
would still have to be overridden, ut the user would not have to inhibit 
anything.

The above example is, I believe, a good example why automatically 
inheriting the parent's properties is not really respecting the cascading 
style rule. An user creating the following skin would expect to see a 
menuList with both items using a font-size of 10pt with the selected item 
being in bold with a blue background:

.AFDefaultFont:alias {
  font-size: 10pt;
}
 
af|menuList::selected { 
  font-weight:      bold;
  background-color: blue;
}

I'll try to post more irritating example we found out while creating our 
skin.

Simon Lessard
Fujitsu Consulting
Mime
  • Unnamed multipart/alternative (inline, None, 0 bytes)
View raw message