Re: [w3c/webcomponents] Provide a lightweight mechanism to add styles to a custom element (#468)

@rniwa in order to solve the override problem, what if a new CSS function were introduced to allow an author to define permitted styles for an element? e.g.

```css
:host {
    display: allow(block, inline-block, none);
    writing-mode: allow(horizontal-tb);

    /* special interaction with minmax() ? */
    --column-width: allow(minmax(10px, 300px));
}
```

The function could be special-cased to only be valid in the UA origin (to be compatible with @tabatkins's suggestion of making the styles work like UA defaults), but override even `!important` declarations where the property is not one of the permitted values.  The first value in the list would be the default.  

This way, you don't need a new stacking order and you can define a subset of permitted values for the props that matter. It would also provide reasoning for UA elements that behave this way already, such as setting `display: inline` on a `<textarea>` as I mentioned before, and would improve tooling by, for example, only showing those permitted values when interacting with the properties in the dev tools.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/468#issuecomment-458165875