S2 CSS
From Dreamwidth Notes
Revision as of 04:07, 23 April 2009 by 76.254.24.208 (Talk)
CSS classes
Contents
Information and Template
This page will have a list of all CSS classes used by Core2.
== class label == * '''Affects:''' What part of the page does this CSS class cover? * '''Views:''' If it's only used on specific pages (eg year page, or reply page), or on all views * '''Other information'''
Major classes
Note: Concentrate here for now
#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 focussed 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 focussed 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 focussed on size and positioning rather than the formatting of their contents.
#header
- Affects: Top bar containing title and page title (optionally other things)
- Views: All
- Other information: Includes subclasses .h1, .h2, #title and #pagetitle
.entry
- Affects: All of a single entry: subject, text, date, mood/music, readlinks, icon, user/community name on readlist view
- Views: Recent, Readlist
header
- Affects: Heading for each entry
- Views: Recent, Readlist, Entry
- Other information: Contains the entry subject matter (h3.entry-title) as well as the date/time stamp and classes for showing trust filters (eg. the lock icon) and adult content filters (eg. the NSFW warning)
h3.entry-title
- Affects: Subject line
- Views: Recent, Readlist, Entry
- Other information: Subjects are shown as links, so the text of the subject line is technically found inside h3.entry.title a.
span.date
- Affects: The date stamp on an entry
- Views: Recent, reading, entry
- Other information Within span.date are several a elements, for each of year/month/day.
span.time
- Affects: The time of day (eg. "06:53pm") that a post is made
- Views: Reading, recent, entry
- Other information This is found inside div.date.
.entry.content
- Affects: The body of an entry; what the person posted.
- Views: Reading, Recent, Entry
- Other information All metadata such as tags, access groups, etc, falls outside this div
.tag
- Affects: The div containing the tags on a post, including any "Tags:" heading
- Views: recent, readlist, entry
- Other information The tags themselves are within a unordered list inside this div.
ul.entry-management-links
- Affects: The links/buttons which allow you to manage an entry, eg. edit/tag/memories/email/track
- Views: Recent, reading, entry
- Other information What falls in this category rather than in entry-interaction-links, I hear you ask. Well, these buttons/links seem to send you away from the entry's page, while the interaction links all link to the entry's page.
ul.entry-interaction-links
- Affects: The list of links for each entry that read Link/N comments/leave a comment
- Views: Recent, reading, entry
- Other information The text of these links can be changed by the journal owner through "Customize styles", so beware that they may be longer/shorter than you think.
li.entry-permalink
- Affects: The "Link" link
- Views: Recent, Reading
- Other information Does not appear(?) if there are comments.
li.entry-readlink
- Affects: The "N comments" link (where N is a number)
- Views: Recent, Reading
- Other information May be customised by the user to say something else. Don't make assumptions about the length of the text. Does not appear if there are no comments.
li.entry-postlink
- Affects: The "Post a comment" link
- Views: Recent, Reading
- Other information May be customised by the user to say something else. Don't make assumptions about the length of the text. Does not appear if comments are disallowed.
h2.module-header
- Affects: Titles of module sections such as Tags, Page Summary, Syndicate etc
- Views: All
- Other information: h2.module-header a refers to those items that are links instead of pure text.
.module-content
- Affects: Content of modules such as tags list, links list, free text, about section, page summary
- Views: All
- Other information: .module-content a refers to those items that are links instead of pure text.