RE: [mediaqueries] User-defined Media Queries?

> Alex Russell just suggested another approach to me in a private email
> - crack open MQs themselves and let authors plug into that
> infrastructure. 
>
> Thoughts?
>
> ~TJ
>

I kinda like the idea. This is probably a good thing which is way better than the current technique (adding a class on the <html> element and adding ".something" at the beginning of all the selectors) and more optimizable.

However, we may want to ask ourselves whether we actually want some CSS features to become a pure compilation target or maintain some actual usability inside CSS. Because if we want JS to define a CSS class for each break point of a continuous data, we force ourself to compile those classes from a HyperCSS file.

Let's imagine we want to prollyfill a media query for the zoom level so that higher resolution graphics are being used when the user zooms in. The graphics is changed at zoom-levels 1.4 and 2.0. We could force developers to have a "zoom-level-140" and a "zoom-level-200" media queries. If at some point they want to change the thresholds, they would need to change the JS. 

The other option is to make the things right and allow for numerical values as well as the usual comparators. A subset of the JavaScript operators would be okay, I presume.


My opinion would be to reuse the [css-variables]'s approach, now that we started it:

   @media(var-js) { ... }
   @media(var-zoom>= 1.4) { ... }
   
   <script>
      
      ... document.css.var.zoom ...
      
   </script>

But that's because I envision more complex data structures which are difficult to express using strings.


Best regards,
François

Received on Friday, 31 May 2013 20:02:48 UTC