Purpose

Apply these guidelines when designing your forms and pages in Callimachus.

UI Element Function
Page links area All links that are specific to the content in the page should appear on the right side of the screen in the sidebar.
Definitions area Definitions of terms used in the page or instructions on how to fill in forms should be given on the right in the sidebar, below the page links area.These instructions should be visually distinct from the page links area.
Page heading All pages should include a page heading.
Form fields Form fields should have their labels above the field.
Buttons The primary form buttons should be shown before the secondary buttons, and should also be visually different.

The sidebar should be a <div id="sidebar">...</div> with exactly one attribute: id="sidebar". No other attributes should be present. The sidebar may contain <aside></aside> elements, which may contains <h3></h3> and <p></p> or other block elements. The sidebar should be placed after the page heading. The page heading should either be a single <h1> element or an <hgroup> element with nested heading elements.

Form fields and buttons should use bootstrap's CSS convesions.