Issue with style Classes and toolBar
dandausch Dec 15, 2009 11:36 AMI am using RichFaces 3.3.2 and I am experiencing issues around formatting components on the rich:toolBar. I have defined my own .rich-toolbar-item style that seems to work for only certain toolbar items. The style manages output text on the toolbar, both size and color, but impacts the 2 command links and the 1 outputLink only from a size persective even when the styleClass is explicit. The color for these links, I believe, is picked up from the skin. Is there an order of precedence when the style classes are applied? It is confusing, for sure. Any thoughts? Here is my code below:
<style>
.rich-tool-tip{
background-color: #eef2f8;
border-color: #7196c8;
font-size: 8pt;
text-decoration: none;
}
.rich-toolbar-item{
font-family: Arial,Verdana,sans-serif;
font-size: 12px;
font-weight:bold;
color: black;
}
</style>
<h:form>
<rich:toolBar itemSeparator="line">
<rich:toolBarGroup location="left">
<h:outputText value="Welcome #{AcrViewController.employee.firstName} #{AcrViewController.employee.lastName}"
rendered="#{empty AcrViewController.whoLoggedInAs}"/>
<h:outputText value="Welcome #{AcrViewController.whoLoggedInAs.firstName} #{AcrViewController.whoLoggedInAs.lastName} (logged in as #{AcrViewController.employee.firstName} #{AcrViewController.employee.lastName})"
rendered="#{!empty AcrViewController.whoLoggedInAs}"/>
</rich:toolBarGroup>
<rich:toolBarGroup itemSeparator="line" location="right" >
<h:commandLink id="tasksLink" value="Tasks" styleClass="rich-toolbar-item">
<rich:toolTip direction="bottom-left" for="tasksLink">
This link will pop up a window
<br/>
and show any current tasks.
</rich:toolTip>
</h:commandLink>
<h:outputLink id="helpLink"
value="http://xxxxxxxxx/component/getcontent?objectId=09016fea80629f93¤t=true"
target="_blank" styleClass="rich-toolbar-item">
<h:outputText value="Help"/>
<rich:toolTip direction="bottom-left" for="helpLink">
This link will provide the
<br/>
current ALM HELP document.
</rich:toolTip>
</h:outputLink>
<h:commandLink id="logoutLink"
action="#{AcrViewController.logout}" value="Logout" styleClass="rich-toolbar-item">
<rich:toolTip direction="bottom-left" for="logoutLink">
This link will logout you out of ALM
<br/>
and close the browser.
</rich:toolTip>
</h:commandLink>
</rich:toolBarGroup>
</rich:toolBar>
</h:form>