Difference between revisions of "S2 Cookbook: Converting a CSS design to a layout"

Revision as of 04:59, 8 August 2010

The basic steps to converting a CSS design to a layout are:

Identify what parts of the CSS can be turned into properties. For instance, colors should always be properties, instead of being "hardcoded" into the CSS.
1. The core2 layer has a lot of built in properties that can be used.
2. Or, new properties can be defined.
Write a Page::print_default_stylesheet function that prints out CSS using the defined properties.
Expose the used properties to the customization wizard
Expand your design to include popular preferences, if possible, such as: icons on the left or right side; different column layouts; metadata on the top or bottom of the entry; icon or text action links
Set other necessary housekeeping properties, such as modules

@@ Line 1: / Line 1: @@
+The basic steps to converting a CSS design to a layout are:
+# Identify what parts of the CSS can be turned into properties.  For instance, colors should always be properties, instead of being "hardcoded" into the CSS.
+## The <code>core2</code> layer has a lot of [http://www.foxfirefey.hack.dreamwidth.net/customize/advanced/layerbrowse?id=core2#table_layerbrowse_properties built in properties] that can be used.
+## Or, new properties can be defined.
+# Write a <code>Page::print_default_stylesheet</code> function that prints out CSS using the defined properties.
+# Expose the used properties to the customization wizard
+# Expand your design to include popular preferences, if possible, such as:  icons on the left or right side; different column layouts; metadata on the top or bottom of the entry; icon or text action links
+# Set other necessary housekeeping properties, such as modules
 [[Category: S2 Cookbook]]