S2 CSS: High level layout ids and classes

Expand: Needs overall description

Main page sections

All of the below IDs are attached to <div>s and have div.inners nested inside of them.

#canvas

• Affects: The whole page, excluding the nav strip
• Views: All

#header

• Affects: The page header, containing the title/subtitle of the page.
• Views: All
• Other information: This would usually contain an h1 and h2 saying something like "Your Name / Recent Entries".

#content

• Affects: Contains the #primary, #secondary, and #tertiary divs
• Views: All
• Other information:

#primary

• Affects: Main content area (user entries on Recent, other users' entries on Read, calendar on Calendar)
• Views: All
• Other information: #primary, #secondary, and #tertiary are layout identifiers. CSS for these areas will generally be focused on size and positioning rather than the formatting of their contents.

#secondary

• Affects: A sidebar or other non-primary section of the page, usually used to for modules such as navigation, links, calendar, tags etc
• Views: All
• Other information: #primary, #secondary, and #tertiary are layout identifiers. CSS for these areas will generally be focused on size and positioning rather than the formatting of their contents.

#tertiary

• Affects: Additional sidebar or similar. In a three-column layout, this would be the second sidebar, but it could also appear at the bottom of the page, or anywhere else where you might want to put modules.
• Views: All
• Other information: #primary, #secondary, and #tertiary are layout identifiers. CSS for these areas will generally be focused on size and positioning rather than the formatting of their contents.

#footer

• Affects: Additional sidebar or similar. In a three-column layout, this would be the second sidebar, but it could also appear at the bottom of the page, or anywhere else where you might want to put modules.
• Views: All
• Other information: Note: there is a footer class that's used inside entries, but this is the footer at the bottom of the page.

Body classes

The bodies of pages are classed, and these include:

• .page-day: For the Day Page view
• .page-entry: For the Entry Page view
• .page-recent: For the Recent Page view
• .page-month: For the Month Page view
• .page-archive: For the Year Page view
• .page-read: For the Read Page view

Header classes

The header on each page contains three title header ids:

• h1#title -- title of the journal
• h2#subtitle -- subtitle of the journal
• h2#pagetitle -- title of the page