ThemeRoller CSS framework updates and demos
I finished up the majority of the new UI CSS framework today.
Almost all of the framework classes have been changed now to reflect
the new naming conventions decided in an earlier thread. The icon
classes are all sprite-driven.
FRAMEWORK CSS:
Please view the generated CSS here:
http://www.filamentgroup.com/clients/jQueryUI/applications/themeroller/css/jquery-ui-base.css.php
[ note that there are styles at the bottom for all the ui widgets
still, and most of them are not written for the new framework yet,
except for progressbar]
The icon names and positions are array-based in the php, and I looped
them them in different ways to generate the states and positions. For
example:
$icons = Array(
/*sprite row 1*/
"carat-1-n"=>"0 0",
"carat-1-ne"=>"-16px 0",
"carat-1-e"=>"-32px 0"
.....
);
If the icon selector portion needs to be more human-readable, I can
put some line breaks in there.
ICON CLASSES DEMO:
I made a demo page so you can view all of the icon classes and review
their names. You can toggle the text nodes off to get cleaner a grid
of the icons too (hover on them to see the class names). Some links to
different themes are at the top.
http://www.filamentgroup.com/clients/jQueryUI/applications/themeroller/framework_demos/icons.php
FRAMEWORK-DRIVEN PROGRESS INDICATOR:
I also made a static demo for the progress indicator styled using
framework classes.
You'll notice the markup is changed and cleaned up a little more. The
CSS is pretty concise too since we're using framework classes. One
thing to note is that we are actually able to style the component
without a wrapper on the value text clone, but it seemed odd having a
text node sitting next to a div. I left the wrapper in the end.
http://www.filamentgroup.com/clients/jQueryUI/applications/themeroller/framework_demos/progressindicator.php
Oh and I only tested this on Mac browsers for now... I'll get to
others next week.
... also, corner radius is hard coded to '4px' in the php. I'll change
that soon.
If anyone cares to update the wiki with all this info tomorrow, that'd
be awesome!
We definitely need to get the framework classes into the planning wiki
so they can be discussed.
I'll get them in there on Monday if no one has time though.
Thanks!
Scott