[css3-conditional] use case: modular user style sheets

Passing on a comment I received orally.

The current WD (http://www.w3.org/TR/2011/WD-css3-conditional-20110901/) 
doesn't seem to support the following use case:

'@document' has the potential to make user style sheets very long, as 
you keep on adding rules for new sites. So at some point the user might 
want to modularize his style sheet a bit. E.g., he may see that certain 
kinds of style overrides occur often; and use that fact to make his 
style sheet shorter.

One obvious organization would be to make a library of mini style 
sheets: a style sheet that underlines links, another that keeps images 
small, another for all mediawiki sites , etc. And then for each URL you 
import the style sheets that apply:

   Site A uses style sheets 1, 5 and 6
   Site B uses style sheets 1, 3 and 4
   Site C uses style sheets 1 and 3

However, that doesn't seem possible with the current syntax, because you 
cannot import a style sheet inside an @document rule. All @import rules 
must come first:

    @document url-prefix(http://example.com/) {
      @import "mini-1";                         /* INVALID! */

For comparison, in the case of @media, there *is* a syntax that 
corresponds to the modularization system above. E.g.:

    /* 'Print' uses mini style sheets 1, 5 and 6 */
    @import "mini-1" print;
    @import "mini-5" print;
    @import "mini-6" print;
    /* Wide screens use mini style sheet 1 */
    @import "mini-1" screen and (min-width: 700px);

So that raises a couple of questions:

   a) Is this indeed a use case: long user style sheets that you
      want to modularize?

   b) If so, is there another way to modularize styles sheets that is
      just as handy and that *does* fit the current syntax?

   c) If not, is it possible to introduce something into the syntax that
      makes this kind of modularization possible?

   d) E.g., should '@document', rather than an at-rule of its own,
      become a keyword inside media queries, so that you can use it
      after @import:

          @import "mini-1" (document: url-prefix(http://example.com/));

      (Looks ugly, with the nested parentheses, but we can easily invent
      other notations for the URL prefix, if that's a problem.)

   e) Or should a URL pattern be allowed *instead* of a media query:

          @import "mini-1" url-prefix(http://example.com/);

      (Two URLs right after each other looks ugly, too, but we could,
      e.g., require a keyword between them: '@import url(x) for url(y)')

  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos                               W3C/ERCIM
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France

Received on Thursday, 8 September 2011 15:43:22 UTC