Skip to content

Instantly share code, notes, and snippets.

@idan
Created December 11, 2010 22:10
Show Gist options
  • Save idan/737689 to your computer and use it in GitHub Desktop.
Save idan/737689 to your computer and use it in GitHub Desktop.
<article class="blogpost">
<header>
<h1>Title</h1>
<h2>Subtitle</h2>
</header>
<p> ... body paras ... </p>
<section class="comment">
<article>
<header>
<h1>Commenter Name</h1>
</header>
<p> ... comment body ... </p>
<footer>
<h1>metadata</h1>
</footer>
</article>
<article> ... another comment ... </article>
</section>
</article>
@size1: 72px;
@size2: 64px;
@size3: 48px;
@size4: 36px;
@size5: 28px;
@size6: 22px;
@size7: 18px;
@size8: 16px;
article.blogpost > header > h1 {
font-size: @size1;
/* Starting at size1 for clarity, obviously in a real blog you'd be
* using size1 for things further up the chain, like your blog's title, or
* maybe to indicate section-of-site (blog vs portfolio), etc. */
}
article.blogpost > header > h2 {
font-size: @size2;
}
.comment > header > h1 {
font-size: @size3
}
.comment > footer > h1 {
font-size: @size6 /* or whatever. */
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment