Difference between revisions of "Styling cheatsheet"
Jump to navigation
Jump to search
old>Admin |
old>Admin |
||
| Line 49: | Line 49: | ||
==== Variant views ==== | ==== Variant views ==== | ||
Most list related operations will have a structure like this | Most list related operations will have a structure like this. | ||
* TempusServaPage | * TempusServaPage | ||
| Line 55: | Line 55: | ||
** '''tableStatistics''' | ** '''tableStatistics''' | ||
*** tableList | *** tableList | ||
Note the inner table "tableList", that is present in all list operations. Specific dialogue styling should use the outer tag - example: tableStatistics. | |||
=== Item mode === | === Item mode === | ||
Revision as of 11:22, 6 March 2013
All pages are structured in the following CSS class structure
- TempusServaPage (root)
- menuList
- menuItem
- ... content ...
- menuList
Content can easily be wrapped around the "TempusServaPage" by use of wrappers
Command bases styling
Menu mode
Simple / Standard
Advanced / Accordion
List mode
- TempusServaPage
- tableListHeader
- viewList
- tableList
- tr (header)
- (field names)
- tr [repeat]
- (field values)
- tr (header)
- pager
- pagerLink
- pagerPagesize
- tableList
| type | class | content |
|---|---|---|
| tr | customStyle_[item status name] | Container for a single record line |
Variant views
Most list related operations will have a structure like this.
- TempusServaPage
- tableListHeader
- tableStatistics
- tableList
Note the inner table "tableList", that is present in all list operations. Specific dialogue styling should use the outer tag - example: tableStatistics.
Item mode
- TempusServaPage
- tableForm
- tbody [repeat]
- fieldLabel
- fieldValue
- fieldNotes
- tbody [repeat]
- tableForm
| type | class | id | content |
|---|---|---|---|
| tbody | PAGE_[field PageID] | Container for a single field | |
| div | FieldLabel | NB_[system fieldname] | Label for field |
| div | FieldValue | VB_[system fieldname] | Value of field / Input for field |