Structure of styling system
Posted: Fri Mar 13, 2009 9:47 am
I have a system i am developping (a framework) that creates highlevel classes used to manage the styles of objects.
I had decided to go with several objects that split the different css properties in groups such as:
- font styles (fontfamily, size, color, etc)
- border styles (border-left-style, border-bottom-size, border-right-color, etc)
- container styles (position, left, top, clear, float, margin-left, margin-top, etc)
- content styles (padding-left, padding-top, horizontal-align (text-align), vertical-align, etc)
- background styles (background-image, background-repeat, etc)
I had decided to do so to split the load of the css handling to different classes so if a user doesn't require changing all the different styles, some of the objects wouldn't even be created thus saving process time when rendering and saving data and also saving memory.
So a simple label or button would have the properties: fontstyle, borderstyle, containerstyle, backgroundstyle and contentstyle. So far no problem, but when we get to custom or complex controls such as my debugger control, i'd need the following:
- debuggerfontstyle
- debuggerborderstyle
- debuggerbackgroundstyle
- debuggercontentstyle
- debuggercontainerstyle
- noticefontstyle
- noticeborderstyle
- noticebackgroundstyle
- noticecontentstyle
- noticecontainerstyle
- warningfontstyle
- warningborderstyle
- warningbackgroundstyle
- warningcontentstyle
- warningcontainerstyle
- errorfontstyle
- errorborderstyle
- errorbackgroundstyle
- errorcontentstyle
- errorcontainerstyle
This can become cumbersome to work with for a standard user because he must know all the style properties. Now i'm faced with a dilema... Either the user has to live with the numerous styles accessors or i have to sacrifice process and probably a bit more of memory to achieve this instead:
- debuggerstyle
- noticestyle
- warningstyle
- errorstyle
What would you do, i want to think user and also think about custom component developers for later and also think about performance impacts... They must all balance together no?
I had decided to go with several objects that split the different css properties in groups such as:
- font styles (fontfamily, size, color, etc)
- border styles (border-left-style, border-bottom-size, border-right-color, etc)
- container styles (position, left, top, clear, float, margin-left, margin-top, etc)
- content styles (padding-left, padding-top, horizontal-align (text-align), vertical-align, etc)
- background styles (background-image, background-repeat, etc)
I had decided to do so to split the load of the css handling to different classes so if a user doesn't require changing all the different styles, some of the objects wouldn't even be created thus saving process time when rendering and saving data and also saving memory.
So a simple label or button would have the properties: fontstyle, borderstyle, containerstyle, backgroundstyle and contentstyle. So far no problem, but when we get to custom or complex controls such as my debugger control, i'd need the following:
- debuggerfontstyle
- debuggerborderstyle
- debuggerbackgroundstyle
- debuggercontentstyle
- debuggercontainerstyle
- noticefontstyle
- noticeborderstyle
- noticebackgroundstyle
- noticecontentstyle
- noticecontainerstyle
- warningfontstyle
- warningborderstyle
- warningbackgroundstyle
- warningcontentstyle
- warningcontainerstyle
- errorfontstyle
- errorborderstyle
- errorbackgroundstyle
- errorcontentstyle
- errorcontainerstyle
This can become cumbersome to work with for a standard user because he must know all the style properties. Now i'm faced with a dilema... Either the user has to live with the numerous styles accessors or i have to sacrifice process and probably a bit more of memory to achieve this instead:
- debuggerstyle
- noticestyle
- warningstyle
- errorstyle
What would you do, i want to think user and also think about custom component developers for later and also think about performance impacts... They must all balance together no?