Forum Post

Forum posts are an extension of our post and comments components. They use the same class names and styles are modified based on the container they are in.

Forum Original Post

Forum Reply

Classes:

  • lotusForum - this class goes on a div that wraps a forum post and its replies.
  • lotusChild - goes on any nested ul tags in a forum reply list.
  • See the base post component for the styles used to create each forum post.
  • See the comment component for the styles used for forum post replies (the replies are structured in a comment list container).

Basic Implementation

Create a wrapping div with class="lotusForum".

Create an original comment post using the styles listed for the post component (also see code snippets on this page).

Create a series of replies using a comment list (which can be nested).

When nesting, each li tag with class lotusCommentItem contains a post first, then a comment list with a class of lotusChild in place of the lotusCommentList class. Each li tag in the child comment list should have a class of lotusCommentItem.

Accessibility

See accessibility section on base post component.

Examples

Sample HTML - Forum Original Post

Sample HTML - Forum Reply

CSS (comments.css)

Theme CSS (commentsTheme.css)

This component is an extension of the post component.

January 26, 2012: Adjusted avatar to better align with content.

See Also: