Styling cheatsheet

Shared page styling

All pages are structured in the following CSS class structure

• TempusServaPage (root)
  • menuList
    • menuItem
    • ... content ...

Content can easily be wrapped around the "TempusServaPage" by use of wrappers

Command bases styling

List mode

• TempusServaPage
  • tableListHeader
  • viewList
    • tableList
      • tr (header)
        • (field names)
      • tr [repeat]
        • (field values)
    • pager
      • pagerLink
      • pagerPagesize

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

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