W3C home > Mailing lists > Public > www-style@w3.org > June 2013

Re: [mediaqueries] User-defined Media Queries?

From: Simon Sapin <simon.sapin@exyr.org>
Date: Mon, 10 Jun 2013 12:57:26 +0100
Message-ID: <51B5BF26.7040803@exyr.org>
To: Stu Cox <stuart.cox@gmail.com>
CC: Kenneth Rohde Christiansen <kenneth.christiansen@gmail.com>, "Tab Atkins Jr." <jackalmage@gmail.com>, www-style list <www-style@w3.org>
Le 10/06/2013 12:29, Stu Cox a écrit :
> I love this idea, but is there actually much scope for new *media*
> queries to be defined, given the limited information available to the DOM?
>
> I'd argue not, and that the Modernizr / theming use cases may be more
> common.
>
> I think there's already a problem with confusion between browser
> features and media/device features (e.g. my old favourite: browser
> supporting the Touch Events API vs device having a touchscreen). Values
> set by users in JS are unlikely to accurately represent a feature of the
> media.
>
>
> So how about e.g. `@property` instead?
>
> <script>
> document.css.properties.haswebgl = 'WebGLRenderingContext' in window;
> document.css.properties.theme = 'night';
> document.css.properties.connectedusers = MyApp.getConnectedUsers();
> </script>
>
> <style>
> @property hasaudioapi { ... }
> @property (theme:night) { ... }
> @property (min-connectedusers:10) { ... }
> </style>
>
>
> I'm totally not precious about that name – just that it shouldn't be
> `@media`.
>
> This would also solve the issue of name conflicts with future media queries.

I agree that this is really a request for user-defined conditional 
rules, and they do not have to be Media Queries. We now have conditional 
rules other than MQs with @supports:

http://www.w3.org/TR/css3-conditional/

Although I don’t like the name "property" as used here (as "CSS 
property" means something different), I can easily imagine conditional 
rules based on values set through an API.

What we would also need is a way to write such conditions in @import 
rules and in the "media" attribute of <link> elements, although that 
makes the attribute’s name not so appropriate anymore.

For examples, we could have functions like media(<media-query-list>) and 
supports(<supports-condition>) for allowing different kinds of 
conditions in the same context. This could even be the chance to allow 
arbitrary nesting of different kinds of conditions with logical operators:

    supports(box-shadow: 10px) or media(max-width: 300px)

-- 
Simon Sapin
Received on Monday, 10 June 2013 11:57:50 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:12 UTC