Java Portlet Specification
Version 1.0
October 7, 2003
PLT.C
CSS Style Definitions
To achieve a common look and feel throughout the portal page, all portlets in the portal page should use a common CSS style sheet when generating content.
This appendix defines styles for a variety of logical units in the markup. It follows the six styles defined in the JSR-168 Portlet v1.0 API and being considered by the OASIS Web Services for Remote Portlets Technical Committee.
PLT.C.1 Links (Anchor)
A custom CSS class is not defined for the <a> tag. The entity should use the default classes when embedding anchor tags.
PLT.C.2 Fonts
The font style definitions affect the font attributes only (font face, size, color, style, etc).
| Style | Description | Example |
|---|---|---|
| portlet-font | Font attributes for the "normal" fragment font. Used for the display of non-accentuatedinformation. | Normal Text |
| portlet-font-dim | Font attributes similar to the .portlet.font but the color is lighter. | Dim Text |
PLT.C.3 Messages
Message style definitions affect the rendering of a paragraph (alignment, borders, background color, etc) as well as text attributes.
| Style | Description | Example |
|---|---|---|
| portlet-msg-status | Status of the current operation. | Progress: 80% |
| portlet-msg-info | Help messages, general additional info, etc. | Info about |
| portlet-msg-error | Error messages. | Portlet not available |
| portlet-msg-alert | Warning messages. | Timeout occurred, try again later |
| portlet-msg-success | Verification of the successful completion of a task. | Operation completed successfully |
PLT.C.4 Sections
Section style definitions affect the rendering of markup sections such as table, div and span (alignment, borders, background color, etc) as well as their text attributes.
| Style | Description |
|---|---|
| portlet-section-header | Table or section header |
| portlet-section-body | Normal text in a table cell |
| portlet-section-alternate | Text in every other row in the cell |
| portlet-section-selected | Text in a selected cell range |
| portlet-section-subheader | Text of a subheading |
| portlet-section-footer | Table or section footnote |
| portlet-section-text | Text that belongs to the table but does not fall in one of the other categories (e.g. explanatory or help text that is associated with the section). |
PLT.C.5 Forms
Form styles define the look-and-feel of the elements in an HTML form.
| Style | Description |
|---|---|
| portlet-form-label | Text used for the descriptive label of the whole form (not the labels for fields). |
| portlet-form-input-field | Text of the user-input in an input field. |
| portlet-form-button | Text on a button |
| portlet-icon-label | Text that appears beside a context dependent action icon. |
| portlet-dlg-icon-label | Text that appears beside a "standard" icon (e.g. Ok, or Cancel) |
| portlet-form-field-label | Text for a separator of fields (e.g. checkboxes, etc.) |
| portlet-form-field | Text for a field (not input field, e.g. checkboxes, etc) |
PLT.C.6 Menus
Menu styles define the look-and-feel of the text and background of a menu structure. This structure may be embedded in the aggregated page or may appear as a context sensitive popup menu.
| Style | Description |
|---|---|
| portlet-menu | General menu settings such as background color, margins, etc. |
| portlet-menu-item | Normal, unselected menu item. |
| portlet-menu-item-selected | Selected menu item. |
| portlet-menu-item-hover | Normal, unselected menu item when the mouse hovers over it. |
| portlet-menu-item-hover-selected | Selected menu item when the mouse hovers over it. |
| portlet-menu-cascade-item | Normal, unselected menu item that has submenus. |
| portlet-menu-cascade-item-selected | Selected sub-menu item that has sub-menus. |
| portlet-menu-description | Descriptive text for the menu (e.g. in a help context below the menu). |
| portlet-menu-caption | Menu caption. |