Tabula Rasa Style Kit, 2009-07-13
Style kits will be labeled by their style and the date of their release. Since this is the first kit for this style, glitches can be expected! Let me know if you run into any problems or need help.
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:
- 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.
- 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.
What is a style kit? Basically, it's a zipped file you can download. Inside are folders with different HTML pages that all include a blank CSS file in the main folder. Those HTML pages will represent all of the different views of a journal, taking care to include certain common cases people should test in their styles. Anything you edit into that CSS file will show up in all of the HTML pages. (Eventually, I want to have a template CSS file, too, that lays out some of the most common things people should think of styling, but that's a ways off.)
This would be a really useful style development tool because you'll be able to edit one file, and refresh a bunch of locally stored files in your browser to see your changes, which means editing and testing your style will be a whole lot easier.
So: what examples do you think should be in a style kit? My style bed is at style_kit, if you want to take a look at what is currently there. The only things you won't be able to see are the locked and private posts, and the screened comment.
My first goal is to make a style kit for Tabula Rasa to help out with the current solicitation at dreamscapes.