Difference between revisions of "S2 CSS: Entry page ids and classes"
From Dreamwidth Notes
Foxfirefey (Talk | contribs) |
Foxfirefey (Talk | contribs) |
||
Line 1: | Line 1: | ||
{{Expand|text=We are expanding the content here!}} | {{Expand|text=We are expanding the content here!}} | ||
− | In addition to the entry stuff described in [[S2 CSS: Entry | + | In addition to the entry stuff described in [[S2 CSS: Entry ids and classes]], these additional classes are found only on the entry page. They mostly apply to the display of comments. |
The entry page has <tt>body.page-entry</tt> as its body class. | The entry page has <tt>body.page-entry</tt> as its body class. | ||
+ | |||
+ | = Changes from normal entry classes = | ||
+ | |||
+ | The bottom is a bit different from that described in [[S2 CSS: Entry ids and classes]]: | ||
+ | |||
+ | == div.footer == | ||
+ | |||
+ | === div.tag === | ||
+ | |||
+ | === ul.entry-management-links === | ||
+ | |||
+ | === hr.above-entry-interaction-links === | ||
+ | |||
+ | === ul.entry-interaction-links === | ||
+ | |||
+ | === hr.below-entry-interaction-links === | ||
+ | |||
+ | === hr.below-reply-container === | ||
= div#comments = | = div#comments = | ||
Line 41: | Line 59: | ||
==== div.comment ==== | ==== div.comment ==== | ||
+ | == div.bottomcomment == | ||
+ | |||
+ | === ul.entry-management-links === | ||
+ | |||
+ | === ul.entry-interaction-links === | ||
= Inside div.comment = | = Inside div.comment = | ||
Line 46: | Line 69: | ||
has .inner | has .inner | ||
− | {{Warn|text=Right now some things are not inside the | + | {{Warn|text=Right now some things are not inside the inner div.}} |
== div.header == | == div.header == |
Revision as of 22:52, 26 April 2009
Expand: We are expanding the content here!
In addition to the entry stuff described in S2 CSS: Entry ids and classes, these additional classes are found only on the entry page. They mostly apply to the display of comments.
The entry page has body.page-entry as its body class.
Changes from normal entry classes
The bottom is a bit different from that described in S2 CSS: Entry ids and classes:
div.tag
ul.entry-management-links
hr.above-entry-interaction-links
ul.entry-interaction-links
hr.below-entry-interaction-links
hr.below-reply-container
div#comments
- Affects: The whole comments section of the page. This is right under the div.entry-wrapper.
div#ljcmt$N
$N stands for the number of the comments. This isn't really all that useful for styling, it's more of a marker for browsers to be able to link to a certain comment.
Has inline style of:
style='margin-left: 25px; margin-top: 5px'
div.comment-wrapper
Warning: .comment-wrapper-a/b might change to wrapper-odd/even
Different classes:
- .comment-wrapper-a
- .comment-wrapper-b
- .visible
- .screened
- .poster-$USER
- .full
- .partial
- .no-userpic
- .has-userpic
div.separator and div.separator-pre
Warning: separator-pre might change to separator-before
has .inner
div.comment
div.bottomcomment
ul.entry-management-links
ul.entry-interaction-links
Inside div.comment
has .inner
Warning: Right now some things are not inside the inner div.
div.header
div.comment-title
span.datetime
div.contents
has .inner
div.userpic
span.poster and span.comment-poster
span.ljuser
div.comment-content
has .inner
span.multiform-checkbox
ul.comment-management-links
The links/buttons for managing comments: delete/screen/freeze/track/etc
- li.link
- li.delete_comment
- li.screen_comment
- li.freeze_thread
- li.watch_thread
ul.comment-interaction-links
The text links to reply/parent/thread on a given topic
- li.link
- li.reply
- li.thread