[OT] Tool for adding server side code to CSS files

[Andrew Robinson <an...@gmail.com>]

It can be really annoying to customize CSS files per browser type,
using CSS hacks to identify Firefox, IE6 vs. IE7, etc. Instead, it
would be much better to use server side code to parse some kind of CSS
templates that are able to produce CSS with access to variables like
browser vendor and version. Pseudo code:

code: if browser is IE and version is 6.x then
CSS
code: else if browser is IE

...etc.

There is more than one templating tool out there for Java server
environments (JSP, Servlets, Apache Velocity, JSF with JSP or
facelets, etc).

I was wondering if someone has used JSF to parse CSS files, or perhaps
another technology. I would like to avoid JSP and custom Servlets, but
I was wondering what people think of using JSF/Facelets vs. a
technology like velocity for this type of work?

Facelets would end up something like:

<ui:composition
  ... namespaces ...>
<c:choose>
  <c:when test="#{my:browserVendor() eq 'IE' and my:browserVer() ge 6
and my:browserVer() lt 7}">
    IE 6 CSS here
  <c:when>
  ...
</c:choose>
</ui:composition>

Where velocity may look like:

#if ($browser.vendor == 'IE' && $browser.version >= 6 and $browser.version < 7)
IE6 CSS here
#end

The velocity is more compact, but would require (possibly) more setup
and much more of a non-standard set of libraries for a JSF web site.
Both suffer from escaping problems as CSS does use characters that
would have to be escaped in XML.

Anyone else done anything like this? If so, what technology/approach
did you use? How did you find the experience and would you do it
again?

Thanks,
Andrew

Re: [OT] Tool for adding server side code to CSS files

[Adam Winer <aw...@gmail.com>]

Trinidad skinning supports this functionality.  You
define a .css file with CSS-style extensions, and can have:

@agent ie {
 ... this will only be applied in IE
}

@agent gecko {
... only in mozilla
}

... and we output pure .css files when done.  The <tr:styleSheet> tag
then generates and picks the right one at runtime.  There's also
syntax for defining rules specific to right-to-left (e.g. Arabic, Hebrew)
languages, a "-tr-rule-ref" extension for including other selectors, and
other features.

-- Adam

On 5/29/07, Andrew Robinson <an...@gmail.com> wrote:
> It can be really annoying to customize CSS files per browser type,
> using CSS hacks to identify Firefox, IE6 vs. IE7, etc. Instead, it
> would be much better to use server side code to parse some kind of CSS
> templates that are able to produce CSS with access to variables like
> browser vendor and version. Pseudo code:
>
> code: if browser is IE and version is 6.x then
> CSS
> code: else if browser is IE
>
> ...etc.
>
> There is more than one templating tool out there for Java server
> environments (JSP, Servlets, Apache Velocity, JSF with JSP or
> facelets, etc).
>
> I was wondering if someone has used JSF to parse CSS files, or perhaps
> another technology. I would like to avoid JSP and custom Servlets, but
> I was wondering what people think of using JSF/Facelets vs. a
> technology like velocity for this type of work?
>
> Facelets would end up something like:
>
> <ui:composition
>   ... namespaces ...>
> <c:choose>
>   <c:when test="#{my:browserVendor() eq 'IE' and my:browserVer() ge 6
> and my:browserVer() lt 7}">
>     IE 6 CSS here
>   <c:when>
>   ...
> </c:choose>
> </ui:composition>
>
> Where velocity may look like:
>
> #if ($browser.vendor == 'IE' && $browser.version >= 6 and $browser.version < 7)
> IE6 CSS here
> #end
>
> The velocity is more compact, but would require (possibly) more setup
> and much more of a non-standard set of libraries for a JSF web site.
> Both suffer from escaping problems as CSS does use characters that
> would have to be escaped in XML.
>
> Anyone else done anything like this? If so, what technology/approach
> did you use? How did you find the experience and would you do it
> again?
>
> Thanks,
> Andrew
>

Re: [OT] Tool for adding server side code to CSS files

[Mike Kienenberger <mk...@gmail.com>]

I can't remember if my web designers have had to use this, but at
least under Velocity, there's an escape XML function you can call if
you have the escapeTool installed.

http://velocity.apache.org/tools/devel/generic/EscapeTool.html

On 5/29/07, Andrew Robinson <an...@gmail.com> wrote:
> It can be really annoying to customize CSS files per browser type,
> using CSS hacks to identify Firefox, IE6 vs. IE7, etc. Instead, it
> would be much better to use server side code to parse some kind of CSS
> templates that are able to produce CSS with access to variables like
> browser vendor and version. Pseudo code:
>
> code: if browser is IE and version is 6.x then
> CSS
> code: else if browser is IE
>
> ...etc.
>
> There is more than one templating tool out there for Java server
> environments (JSP, Servlets, Apache Velocity, JSF with JSP or
> facelets, etc).
>
> I was wondering if someone has used JSF to parse CSS files, or perhaps
> another technology. I would like to avoid JSP and custom Servlets, but
> I was wondering what people think of using JSF/Facelets vs. a
> technology like velocity for this type of work?
>
> Facelets would end up something like:
>
> <ui:composition
>   ... namespaces ...>
> <c:choose>
>   <c:when test="#{my:browserVendor() eq 'IE' and my:browserVer() ge 6
> and my:browserVer() lt 7}">
>     IE 6 CSS here
>   <c:when>
>   ...
> </c:choose>
> </ui:composition>
>
> Where velocity may look like:
>
> #if ($browser.vendor == 'IE' && $browser.version >= 6 and $browser.version < 7)
> IE6 CSS here
> #end
>
> The velocity is more compact, but would require (possibly) more setup
> and much more of a non-standard set of libraries for a JSF web site.
> Both suffer from escaping problems as CSS does use characters that
> would have to be escaped in XML.
>
> Anyone else done anything like this? If so, what technology/approach
> did you use? How did you find the experience and would you do it
> again?
>
> Thanks,
> Andrew
>