style_kit: The swirl logo with Dreamwidth under it in red. (Default)
[personal profile] style_kit in [community profile] the_style_kit

What is a style kit?

It's a folder with some useful CSS and HTML files for people doing CSS design on Dreamwidth styles. It helps speed up your CSS testing in two ways:

  1. CSS is easier to change this way. You don't have to copy-paste CSS into the Custom CSS section of style customization, put it into an extension like Firebug or Stylish, or upload it to an external server. You just edit the CSS files that hook into the example pages and instantly refresh to see the changes--because they're local files on your computer, there's not even any network latency.
  2. The Style Kit is designed to provide many test cases for your theme, like screened comments, adult content, or locked posts, and different modules. It also has a markup check page so you can check your style against a variety of standard HTML markup.

How to use a style kit

A style kit comes in a bundled download. After you download and uncompress the style kit, you'll have a folder which has more folders inside of it, with different variations of a given style.

If a style has the ability to turn off all default styling, then there will be a no_default folder of that particular variation in the style's folder. There will also be folders for each page setup option on the select style page.

The CSS files you edit are in the css folder. The general.css file is included in every single file in all the theme directories. Each variation also has its own CSS file, like no_default.css and two_column_left.css. These CSS files only hook up with files for that particular variation. This will help you sort out CSS that only belongs to one particular layout, as opposed to general style CSS.

So, edit a CSS file with a text editor to make changes to the CSS, and open up HTML pages in your browser to see what it looks like. After you save your changes in the text editor, you can refresh the HTML page in your browser to see the effects.

From:
Anonymous( )Anonymous This account has disabled anonymous posting.
OpenID( )OpenID You can comment on this post while signed in with an account from many other sites, once you have confirmed your email address. Sign in using OpenID.
User
Account name:
Password:
If you don't have an account you can create one now.
Subject:
HTML doesn't work in the subject.

Message:

 
Notice: This account is set to log the IP addresses of everyone who comments.
Links will be displayed as unclickable URLs to help prevent spam.

Profile

The Style Kit

February 2010

S M T W T F S
 123456
78910111213
1415 1617181920
21222324252627
28      

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Jul. 21st, 2017 02:35 am
Powered by Dreamwidth Studios