You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by Apache Wiki <wi...@apache.org> on 2006/06/20 13:15:22 UTC

[Myfaces Wiki] Update of "SettingTabClasses" by IzakWessels

Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Myfaces Wiki" for change notification.

The following page has been changed by IzakWessels:
http://wiki.apache.org/myfaces/SettingTabClasses

------------------------------------------------------------------------------
    .myFaces_panelTabbedPane_activeHeaderCell input { font-weight: bold;}
  }}}
  
+ === Full Example ===
+ 
+ Adding !important at the end of each CSS line indicates that it would override the setting in the default CSS file.
+ 
+ <t:panelTabbedPane
+                   styleClass="tabbedPane"
+                   activeTabStyleClass="activeTab"
+                   inactiveTabStyleClass="inactiveTab"
+                   disabledTabStyleClass="disabledTab"
+                   activeSubStyleClass="activeSub"
+                   inactiveSubStyleClass="inactiveSub"
+                   tabContentStyleClass="tabContent">
+ ...
+ </t:panelTabbedPane>
+ 
+ 
+ table.tabbedPane {
+     width: 100% !important;
+     vertical-align: top !important;
+     border-collapse: separate !important;
+     border-spacing: 0px !important;
+     background-color: #FFFFFF !important;
+ }
+ 
+ td.activeTab {
+     width: 150px !important;
+     font-size: 100% !important;
+     background-color: #FFFFFF !important;
+     border-top: 2px solid #91A0CA !important;
+     border-left: 2px solid #91A0CA !important;
+     border-right: 2px solid #91A0CA !important;
+     border-bottom: 1px none !important;
+     padding: 2px !important;
+     text-align: center !important;
+     font-weight: bold !important;
+ }
+ td.activeTab input {
+     background-color: #FFFFFF !important;
+     font-size: 100% !important;
+     text-align: center !important;
+     font-weight: bold !important;
+ }
+ 
+ td.inactiveTab {
+     width: 150px !important;
+     font-size: 100% !important;
+     background-color: #EBEEF8 !important;
+     border-top: 2px solid #91A0CA !important;
+     border-left: 2px solid #91A0CA !important;
+     border-right: 2px solid #91A0CA !important;
+     border-bottom: 2px solid #91A0CA !important;
+     padding: 2px !important;
+     text-align: center !important;
+     font-weight: bold !important;
+ }
+ td.inactiveTab input {
+     background-color: #EBEEF8 !important;
+     font-size: 100% !important;
+     text-align:center !important;
+     font-weight: bold !important;
+ }
+ td.activeSub {
+     background-color: #FFFFFF !important;
+     padding: 0px !important;
+     border: 1px solid #FFFFFF !important;
+ }
+ td.inactiveSub {
+     background-color: #FFFFFF !important;
+     padding: 0px !important;
+     border: 1px solid #FFFFFF !important;
+ }
+ td.myFaces_panelTabbedPane_emptyHeaderCell {
+     background-color: #FFFFFF !important;
+ }
+ 
+ .myFaces_panelTabbedPane_activeHeaderCell input:hover,
+ .myFaces_panelTabbedPane_inactiveHeaderCell input:hover{
+   color:#fff !important;
+   background:#08c !important;
+ }
+ 
+ td.tabContent {
+     background-color: #FFFFFF !important;
+     border-left: 2px solid #91A0CA !important;
+     border-right: 2px solid #91A0CA !important;
+     border-bottom: 2px solid #91A0CA !important;
+     vertical-align: top !important;
+     padding-top: 5px !important;
+     padding-left: 5px !important;
+     height: 100% !important;
+     text-align:left !important;
+     width:765px;
+ }
+