Thesis #content for Static Pages

Illustration of content for static pages
This demonstrates the #content of a static-page. The #content of a static page is fairly simple in Thesis. It contains a single instance of #post-x .post_box. The x in #post-x represents the post id. Every post id has a unique selector id and a common class of .post_box.  It also includes #comments when comments are enabled for this page.
Hierarchy of #content for a static page

  • #content_box
    • #content
      • #post-x .post_box
        • .headline_area
          • .headline h2
          • .headline_meta
        • .format_text
      • #comments

#content This selector is defined in layout.css and gets it’s width from the size of the content column entered in the Design Options dialog. It contains everything in the #content_box that is not part of the #sidebars

.post_box Defines the styling of #post-x and contains both .headline_area and .format_text. The only part of it’s definition that is directly customizable from Design Options is the border.

.headline_area This selector contains both the .headline and the .headline_meta.

.format_text This selector contains all of the post related structures. The font size is directly set in the Design Options.

#comments This selector contains all of the comment related structures.

#content
{
    width: 51.3em; /* from layout.css [Design Options] */
    float: left;  /* from layout.css [Design Options] */
}

.post_box
{
    border-style: dotted; /* from style.css */
    border-color: #bbb; /* from style.css */
    clear: both; /* from style.css */
    margin: 0 2.2em 0 1.1em; /* from layout.css */
    padding-top: 2.2em; /* from layout.css */
    border-width: 0.1em 0 0 0; /* from layout.css [Design Options]*/
}

.headline_area
{
    margin-bottom: 2.2em; /* from layout.css */
}

.format_text
{
    font-size: 1.4em; /* from layout.css [Design Options]*/
    line-height: 1.571em; /* from layout.css */
}
#comments 
{ 
    margin-right: 2.3em; /* from layout.css*/
    margin-left: 0em; /* from layout.css*/
}
 

{ 0 comments… add one now }

Leave a Comment