Difference between revisions of "Styling cheatsheet"

From TempusServa wiki
Jump to navigation Jump to search
old>Admin
old>Admin
Line 20: Line 20:
=== List mode ===
=== List mode ===


...
* TempusServaPage
* viewList
** tableListHeader
** tableList  
** viewList
*** tr (header)
*** tableList  
*** tr [repeat]
**** tr (header)
** pager
**** tr [repeat]
*** pagerLink
*** pager
*** pagerPagesize
**** pagerLink
**** pagerPagesize





Revision as of 11:10, 6 March 2013

Shared page styling

All pages are structured in the following CSS class structure

  • TempusServaPage (root)
    • menuList
      • menuItem
    • [tableMaster|viewList|tableForm] (content type)
      • ...

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)
        • tr [repeat]
      • pager
        • pagerLink
        • pagerPagesize


type class content
tr customStyle_[item status name] Container for a single record line


Variant views

  • TempusServaPage
    • tableListHeader
    • tableStatistics
      • tableList
  • TempusServaPage
    • tableListHeader
    • tableStatistics
      • tableList

Item mode

...

  • 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

Other element styling