ThemeRoller CSS framework class naming conventions

ThemeRoller CSS framework class naming conventions


While transitioning our widgets to use framework classes, we should
probably change the class naming conventions to something more
scalable than they currently are.
For example, the state classes currently look like this:
.ui-default-state
.ui-hover-state
.ui-active-state
They should probably be this:
.ui-state-default
.ui-state-hover
.ui-state-active
Same with icons, which are currently like this:
.ui-arrow-right-default
.ui-arrow-right-hover
.ui-plus-default
and should probably have an "icon" naming convention in there:
.ui-icon-arrow-right-default
.ui-icon-arrow-right-hover
.ui-icon-plus-default
so the icon syntax would be:
.ui-icon-[icon type]-[optional icon sub type]-[state]
Basically, it just makes for a more scalable naming convention, to
keep things organized.
Other class types would be
.ui-component-
.ui-state-
.ui-icon-
.ui-helper-
The helper type is for things like resets, clearfix, etc.
We can keep the current classes in the CSS as well if we want to, and
mark them as deprecated for a few versions, or we could pull them
out.
Thoughts on all this?