OFBiz maincss.css HTML Element Collection Styles

This document describes the new CSS classes and the HTML element collections (or compounds) that they style.

Note: [] = style decorators.

masthead:

<div id="masthead">
  <ul>
    <li> | <li class="logo-area | control-area">Masthead Content</li>
  </ul>
</div>

main-navigation:

<div id="main-navigation">
  <ul>
    <li> | <li class="disabled | selected">Menu Item</li>
  </ul>
</div>

app-navigation:

<div id="app-navigation">
  <h1 | h2 | h3>Application Title</h1 | h2 | h3>
  <ul>
    <li> | <li class="disabled | selected | opposite">Menu Item</li>
  </ul>
</div>

screenlet-title-bar:

<div class="screenlet-title-bar">
  <!- No menu ->
  <h1 | h2 | h3>Screenlet Title</h1 | h2 | h3>
</div>

<div class="screenlet-title-bar">
  <!- With menu ->
  <ul>
    <h1 | h2 | h3>Screenlet Title</h1 | h2 | h3>
    <li> | <li class="disabled">Menu Item</li>
  </ul>
</div>

basic-nav:

<div class="basic-nav">
  <ul>
    <li> | <li class="selected | disabled">Menu Item</li>
  </ul>
</div>

button-bar:

<div class="button-bar [button-style-1 | button-style-2 | tool-bar | tab-bar]">
  <ul>
    <li> | <li class="selected">Menu Item</li>
  </ul>
</div>

basic-table:

<table class="basic-table [hover-bar | dark-grid | light-grid]">
  <tr> | <tr class="header-row | alternate-row">
    <td> | <td class="button-col | group-label | label"></td>
  </tr>
</table>

basic-tree:

<ul class="basic-tree">
  <li> | <li class="collapsed | expanded">Tree Item</li>
  <li>
    <ul class="basic-tree">
      ...
    </ul>
  </li>
</ul>

basic-form:

<form class="basic-form">
  <table class="basic-table [hover-bar | dark-grid | light-grid]">
    <tr> | <tr class="header-row | alternate-row">
      <td> | <td class="group-label | label"></td>
      <td><a class="smallSubmit"></a></td>
    </tr>
  </table>
</form>

Semantic link (<a> element) styles:

view-calendar
field-lookup
nav-first
nav-last
nav-next
nav-previous