incubator-adffaces-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Simon_Less...@DMR.CA
Subject Re: inhibiting css properties in skin definition file
Date Fri, 07 Jul 2006 13:06:22 GMT
Strange,

I use the application we used to develop the skin for our ADF Faces 
project, converted to use Trinidad libraries instead. The HTML code I get 
for the menuList is 

<ul id="_idJsp3:_idJsp25" class="x8q" style="list-style-type: none;">
  <li>
    <span class="x8o">
      <a 
onclick="submitForm('_idJsp3',1,{source:'_idJsp3:_idJsp25:_idJsp26'});return 
false;" href="#" class="xi">
        Selected
      </a>
    </span>
  </li>
  <li>
    <span class="x8p">
      <a 
onclick="submitForm('_idJsp3',1,{source:'_idJsp3:_idJsp25:_idJsp27'});return 
false;" href="#" class="xi">
        Unselected
      </a>
    </span>
  </li>
</ul>

With styles:
.OraStyledList,.x8q {
  list-style-position:inside;
  padding:0px;margin:0px
}

.OraNav3Selected,.x8o {
  font-family:Verdana, Arial, Helvetica, Sans-Serif;
  color:inherit;
  font-size:10pt;
  font-weight:bold;
  background-color:red
}

.OraLinkDisabled,.xj,.af_outputLabel_required-icon-style,.x1y,.af_inputChoice_required-icon-style,.x1z,.af_inputText_required-icon-style,.x20,.af_selectBooleanCheckbox_required-icon-style,.x21,.af_selectBooleanRadio_required-icon-style,.x22,.af_selectInputDate_required-icon-style,.x23,.af_selectManyCheckbox_required-icon-style,.x24,.af_selectManyListbox_required-icon-style,.x25,.af_selectOneChoice_required-icon-style,.x26,.af_selectOneListbox_required-icon-style,.x27,.af_selectOneRadio_required-icon-style,.x28,.af_outputLabel_group-icon-style,.x29,.af_inputChoice_group-icon-style,.x2a,.af_inputText_group-icon-style,.x2b,.af_selectBooleanCheckbox_group-icon-style,.x2c,.af_selectBooleanRadio_group-icon-style,.x2d,.af_selectInputDate_group-icon-style,.x2e,.af_selectManyCheckbox_group-icon-style,.x2f,.af_selectManyListbox_group-icon-style,.x2g,.af_selectOneChoice_group-icon-style,.x2h,.af_selectOneListbox_group-icon-style,.x2i,.af_selectOneRadio_group-icon-style,.x2j,.af_menuLis!
 t,.x2l,button,.af_navigationLevel_choice-label,.x38,.af_navigationLevel_choice-options,.x39,.af_navigationLevel_choice-button,.x3a,.af_navigationPath,.x3y,.af_menuButtons_text,.x4n,.af_menuButtons_text-selected,.x4p,.af_menuButtons_text-disabled,.x4q,.af_menuBar_separator,.x4u,.p_OraDisabled,.x7m,.OraNav3,.x8p,.p_OraTreeRow,.x9n,.portlet-form-button,.xas

{
  font-family:Verdana, Arial, Helvetica, Sans-Serif;
  color:inherit;
  font-weight:inherit;
  font-size:10pt
}

.AFInstructionText,.x0,.OraLink:link,.xi:link,.OraLink:active,.xi:active,.OraLink:visited,.xi:visited,.af_outputText,.xk,.af_outputFormatted,.xl,.af_treeTable_path,.x2n,.af_menuPath,.x2q,.af_panelList

A,.x2t 
A,.OraLinkText,.x7b,.OraVLinkText,.x7c,.OraALinkText,.x7d,.OraHGridNavRowActiveLink,.x89,.OraNavBarActiveLink,.x8d,.PortletText1,.xa4,.PortletText2,.xa5,.PortletText3,.xa6,.PortletText4,.xa7,.portlet-form-field,.xaw

{
  font-family:Verdana, Arial, Helvetica, Sans-Serif;
  font-weight:inherit;
  font-size:10pt;
  color:black
}

For skin

.AFDefaultFontFamily:alias  {
  font-family : Verdana, Arial, Helvetica, Sans-Serif;
} 

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

.AFLinkForeground:alias {
  color: black;
}

.AFActiveLinkForeground:alias { 
  color: black;
}
 
.AFVisitedLinkForeground:alias {
  color: black;
}
 
af|menuList { 
}
 
af|menuList::selected {
  font-weight: bold;
  background-color: blue;
}


It seems to me that OraNav3Selected is the selector generated for 
af_menuList_selected. I can provide you the whole project .zip if you 
want, but you would have to link it yourself to the JAR beause I use 
absolute path to point on mine.


Regards,

Simon Lessard
Fujitsu Consulting





Jeanne Waldman <jeanne.waldman@oracle.com>
2006-07-06 19:30
Please respond to adffaces-dev
 
        To:     adffaces-dev@incubator.apache.org
        cc: 
        Subject:        Re: inhibiting css properties in skin definition 
file


Before I can comment on your examples, I'd like to be able run them. :)

When I run the menuList demo, my html is

<li><span class="OraNav3">
<a onclick="submitForm('_idJsp3',1,{source:'_idJsp11:_idJsp12'});return 
false;" 
href="#" class="OraLink">Page 1</a></span></li>
<li><span class="OraNav3Selected">
<a onclick="submitForm('_idJsp3',1,{source:'_idJsp11:_idJsp13'});return 
false;" 
href="#" class="OraLink">Page 2</a></span></li>
<li><span class="OraNav3">
<a onclick="submitForm('_idJsp3',1,{source:'_idJsp11:_idJsp14'});return 
false;" 
href="#" class="OraLink">Page 3</a></span></li>

... you'll see there is no af_menuList_selected, etc. Do you see something 
different?
Which demo are you running?

 



Simon_Lessard@DMR.CA wrote:

>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