Custom CSS Hacks: Difference between revisions

From Shifti
Jump to navigation Jump to search
m fix the inter-wiki link to Wikipedia's page on 'sans-serif' :)
m add {{Non-Fiction}} and {{example}}
Line 31: Line 31:
}
}
</pre>
</pre>
{{Non-Fiction}}{{example}}

Revision as of 22:46, 15 February 2009

These are all user-submitted 'hacks' that use the Custom CSS facility to change how some facets of the way Shifti looks on a per-user basis.

Font Face Hacks

Some people find the sans-serif font that is used on Shifti hard to read. If you agree, you'll want to add one of the following pieces of CSS to your custom css:

// change all fonts to serif
#globalWrapper {
  font-family: Times, Roman, serif; // select the most generic serif fonts
  font-size: 120%; // Serif fonts tend to be a little smaller than sans-serif
}

// change the 'article' area to serif
#column-content {
  font-family: Times, Roman, serif; // you could try: Verdana, Georgia, serif :)
  font-size: 120%;
}

// change just the body-text area of a page to serif
#bodyContent {
  font-family: Times, Roman, serif;
  font-size: 120%;
}

Miscelaneous Display Hacks

Some people like having the first line of paragraphs indented. If you do too, try adding the following to your custom css:

// we only want to have an effect on <p> elements in the page-content area
#bodyContent p {
  text-indent: 2em; // a 2em indent should be plenty...
}