RE: [css-round-display][media-queries] 'shape' media feature

> On Apr 17, 2016, at 9:36 PM, Florian Rivoal < florian@rivoal.net > wrote:
> 
> shape : rect | round
> 
> This media feature allows the author to query about the general shape of
> the targeted display area of the output device, in order to adjust the
> styling of their document to match. This is not intended to be an
> exhaustive and accurate categorization of shapes, but rather a subjective
> grouping into broad shape families for which distinctive designs are
> desirable.
> 
> Values:
> - rect: the shape is an axis aligned rectangle or square,
>   or a similar shape for which traditional designs are appropriate.
> 
> - round: the shape is a circle, an ellipse, an oval, or a similar
>   shape for which distinctively rounded designs are appropriate.

I also thought another value 'rounded-rect', but it makes categorizing
shapes more complicated.
Just having 'rect' and 'round' as the value for 'shape' looks much better.

> When a shape does not strictly match any of the categories, but is close
> enough to one of them that designs intended for that category would be
> appropriate, it should be grouped with that category. For example, a
> rectangle with small rounded corners should match ''shape: rect''.
> 
> Note: Various shapes can be considered to lay ambiguously between two
> categories. For example, it is not clear cut whether a rectangle with
> large rounded corners is more rectangle-like or more round-like.
> How to categorize such shapes is at the discretion of the UA, to be
> decided depending on whether the device vendor or UA vendor would like to
> favor roundish designs or squarish designs on that device.
> 
> If the shape does not match any of the values, then each of these values
> must evaluate to ''false''. UAs must only do so for radically different
> shapes (such as star-shaped screens), not for minor variations (such as
> rectangles with small beveled corners).
> 
> 
> Note: At the time of writing, the only Operating System exposing
> information through standard APIs about the display's shape is Android
> with its ''isScreenRound()'' API
> (http://developer.android.com/intl/es/reference/android/content/res/Config
> uration.html#isScreenRound%28%29).
> Given the semantics of this API, when isScreenRound() returns ''true'',
> ''shape: round'' should evaluate to ''true'' and
> ''shape: rect'' should evaluate to ''false''. When isScreenRound() returns
> ''false'', both ''shape: round'' and ''shape: rect''
> should evaluate to ''unknown''.
 
> Example:
>   An author having designed a "traditional" design
>   and a rounded one would use this media feature
>   as follows:
> 
>     /* CSS for most screens and for UAs which do not implement 'shape' */
>     @media (shape: round) {
>       /* CSS for the rounded design */
>     }
> 
>   Authors should careful with other patterns, as they
>   have different semantics:
> 
>     @media not (shape: round) {
>       /* ... */
>     }
>     @media (shape: round) {
>       /* ... */
>     }
>     /* On UAs which do not implement this media feature
>        or on devices where the shape is uncertain,
>        neither branch is applied. */
> 
> 
>     @media (shape: rect) {
>       /* ... */
>     }
>     @media (shape: round) {
>       /* ... */
>     }
>     /* In addition to UAs that do not implement 'shape'
>        and devices where the shape is uncertain,
>        this will also fail to apply either branch
>        if the shape is categorized by the UA as being
>        neither rectangular nor round. */ ====
> 
When we use 'shape' like below,

@media not (shape: round) and not (shape: rect) {
    /* For the shape which is neither rectangular nor round. */
}

Can we handle the rounded rectangle or the star-shaped screens with this?

Thanks,
Jihye

Received on Wednesday, 27 April 2016 05:22:26 UTC