Re: [css-round-display][media-queries] Media query polygons

> On Dec 9, 2016, at 20:17, Shane Hudson <Shane@ShaneHudson.net> wrote:
> 
> Hi,
> 
> I was reading the spec for CSS Round Display and saw the note about how to detect different shape screens. I'm not aware of the technical limitations for media queries so ignore me if I'm talking nonsense.
> 
> Currently the spec uses (device-radius: 50%) which is probably going to be the most common use-case.

You're looking at an old version of the spec. The latest one is here:
https://drafts.csswg.org/css-round-display/

It has this instead: 

  @media (shape: rect)
or 
  @media (shape: round)


> I was wondering if, to keep it simple but still powerful, the other shapes could be queried by using the same syntax as clip-path? That would allow it to be as simple or complex as required, and for some use-cases the same shape could be used elsewhere with ease.
> 
> Of course, I may be going over old ground but thought it might be worth dropping a note.

This has been discussed quite a bit indeed. The core of that discussion should be covered in these:

* https://lists.w3.org/Archives/Public/www-style/2015Oct/0220.html
* https://lists.w3.org/Archives/Public/www-style/2016Mar/0351.html (skip to "device-radius")

TL;DR:

There are basically two needs:
1. Switching into a roundish design to stylistically match a roundish screen
2. Avoiding the parts of the screen that are not visible due do the screen shape

We've decided to address the two separately, and to do the first one only for now, as it is much simpler and in higher demand. Also, typical operating systems don't expose much information about the geometry of the screen, so we may not be able to do better than that for a while anyway.

—Florian

Received on Monday, 12 December 2016 09:07:44 UTC