I just spent this last weekend refactoring the Party Manager findParty and
viewProfile pages as a way to test the HTML/CSS coding guidelines that I'm
working on. (That work was an experiment - not intended to be put in the main
project.) Now I can fully appreciate the decisions that need to go into creating
and naming CSS classes.
After doing that, I've come up with a personal opinion on web design and OFBiz.
The CSS Zen Garden is a great inspiration and a goal to shoot for, but I don't
believe it can be fully acheived in OFBiz. That's because the whole point of the
CSS Zen Garden was to get designers to think outside of the "row and column
grid" and design pages that flow artistically. OFBiz web pages aren't
free-flowing artistic displays - they display a business application that, by
its nature, requires some structure. The bottom line is, we can draw from the
Garden's inspiration and produce more concise HTML and more flexible layouts,
but we'll fall short of making OFBiz another CSS Zen Garden.
Having said that, I'm really excited about the prospects of the CSS/HTML
refactoring initiative. The Party Manager mods I made resulted in greatly
reduced FTL file sizes, and it outputs the coolest minimal markup. Everything
resizes and reverses direction elegantly. I'll post a patch in the "sandbox"
Jira issue (https://issues.apache.org/jira/browse/OFBIZ-633) soon so others can
see what I mean.
The CSS/HTML Guidelines RFC will be posted today - I'm almost done with it.
-Adrian
David E. Jones wrote:
Actually, the point of this sort of CSS pattern is what you described
as the bad side effect, ie having the style tied to the content.
If we have anything generic, it should be attached to generic tags, not
a messy and confusing and difficult to maintain library of styles like
we have now.
If we put an id on a div around a product summary block, we don't HAVE
to use that in our stock CSS file, but the fact that it is there makes
it possible to do something special visually with that section without
any change to the FTL file.
And _that_ is what we're going for... and that's what the examples and
patterns in the CSS Zen Garden stuff are all about.
-David
On Jan 12, 2007, at 6:36 PM, Adrian Crum wrote:
Now that I know that that section of the css file was an experiment,
I'd like to offer my perspective on that particular section.
It seems to me that those product detail styles tie style to content
too closely. In other words, they are pretty content specific.
I see the maincss.css file as being a global "palette" of styles that
all components can draw from. If a particular component needs a style
that is unavailable from the maincss.css file, then those styles
should be kept in a separate style sheet that only that component
loads (via layoutSettings.stylesheets[]).
Am I on the right track?
David E. Jones wrote:
Adrian,
I see, no problem. Yeah, it was a project started and never finished!
You'll probably also notice that there is still some table-based
formatting on the productdetail page that is a bit evil (well, and
ugly!) and needs to be converted to a CSS-based layout like much of
the other stuff was.
-David
On Jan 12, 2007, at 2:56 PM, Adrian Crum wrote:
David,
Thanks for the reply! I understand completely what the ID
attribute is for. I was questioning why it was done differently
than the rest of the file.
David E. Jones wrote:
This was part of the experimentation with the Zen CSS Garden way
of doing CSS. Using id attributes to mark regions and styling
implicitly is the way we want to go in the future. If you're
planning on working on CSS stuff and you haven't read through
The Zen of CSS Design, I highly recommend it. Really cool
stuff. There is a link to the book on the Docs & Books page on
ofbiz.apache.org.
-David
On Jan 12, 2007, at 2:42 PM, Adrian Crum wrote:
In the maincss.css file, Just below the comment
/* ===== Product Detail Styles ===== */
are six css classes defined using IDs instead of class names.
Is there a reason for that?