Re: [csswg-drafts] [css-variables] User Agent properties and variables

The CSS Working Group just discussed `dino suggestion on writing modes`.

<details><summary>The full IRC log of that discussion</summary>
&lt;dauwhe> Topic: dino suggestion on writing modes<br>
&lt;astearns> s/writing modes/variables/<br>
&lt;astearns> github: https://github.com/w3c/csswg-drafts/issues/1693<br>
&lt;dauwhe> dino: [approaches podium]<br>
&lt;dauwhe> ... I'll explain it backwards<br>
&lt;dauwhe> ... we're proposing a new var function<br>
&lt;dauwhe> ... instead of exposing user custom properties<br>
&lt;dauwhe> ... these are defined by the user agent<br>
&lt;dauwhe> ... "contstant" means you can''t change it<br>
&lt;dauwhe> ... user wants to control type size on iphone<br>
&lt;dauwhe> ... css can't detect that<br>
&lt;dauwhe> ... you can query the UA value, and then use calc to respond<br>
&lt;dauwhe> ... User agent properties<br>
&lt;glazou> s/contstant/constant<br>
&lt;dauwhe> ... rest is similar to CSS variables<br>
&lt;dauwhe> ... I show lots of examples... font size, foreground/background color...<br>
&lt;dauwhe> ... like user pref for black background/white text<br>
&lt;dauwhe> ... some dyslexic folks want low contrast<br>
&lt;dauwhe> ... so CSS could query UA and then respond<br>
&lt;dauwhe> ... or we could use safe areas when projecting to screen of different size<br>
&lt;dauwhe> glazou: it's coming from UA and system?<br>
&lt;dauwhe> dino: yes<br>
&lt;glazou> q+<br>
&lt;dauwhe> iank_: could you draw the safe area on the blackboard<br>
&lt;bdc> q+<br>
&lt;dauwhe> dino: this has been a concept in TV<br>
&lt;dauwhe> ... some TVs you wouldn't see the whole frame<br>
&lt;dauwhe> ... so there was a title safe area, where you know pixels would always be visible<br>
&lt;dauwhe> myles: modern TVs fake this,<br>
&lt;dauwhe> dino: if you have a circular display, the safe area might be in the middle<br>
&lt;astearns> ack myles<br>
&lt;astearns> q+<br>
&lt;Florian_> q+<br>
&lt;dauwhe> glazou: I like this<br>
&lt;dauwhe> ... open question: could be extended to system colors?<br>
&lt;astearns> ack glazou<br>
&lt;gregwhitworth> q+<br>
&lt;dauwhe> ... we'd have to find common names for system colors on all platforms<br>
&lt;melanierichards> q+<br>
&lt;Florian_> q-<br>
&lt;dauwhe> ... 2nd thing: I'd like to see a 2nd part with JS elements to detect system change events<br>
&lt;dauwhe> dino: you can't do MQ<br>
&lt;Florian_> q+<br>
&lt;dauwhe> glazou: being able to detect theme change, or that you switched to night view.... would be color<br>
&lt;astearns> ack bdc<br>
&lt;glazou> s/would be color/would be cool<br>
&lt;dauwhe> bdc: like underlying idea of prefers-reduced-motion MQ...<br>
&lt;dauwhe> ... so why do we want a new thing?<br>
&lt;dauwhe> dino: unlike MQ, you want to know a value<br>
&lt;dauwhe> ... given one of these values, tell me when it changes<br>
&lt;dauwhe> bdc: i don't see a difference<br>
&lt;dauwhe> Florian_: i don't think so<br>
&lt;dauwhe> ... reduced motion is not about make things slower... it's about doing something else<br>
&lt;dauwhe> dino: for reduced motion, sometimes we fade in instead of moving in<br>
&lt;dauwhe> ... we're generally not removing animations<br>
&lt;glazou> q?<br>
&lt;dauwhe> astearns: I want to ask about support<br>
&lt;glazou> ack astearns<br>
&lt;dauwhe> dino: this raises issue on css var spec<br>
&lt;dauwhe> ... but I don't know where the property lists go<br>
&lt;dauwhe> astearns: if we don't have access for @supports, how do we author?<br>
&lt;dbaron> you could always do @supports (color: constant(foobar)), no?<br>
&lt;astearns> ack gregwhitworth<br>
&lt;dauwhe> gregwhitworth: these are defined by the UA<br>
&lt;dauwhe> ... how are we not going to end up with the -webkit- prefixes unless we agree on everything?<br>
&lt;dauwhe> dino: these are new properties<br>
&lt;dauwhe> ... just like a normal property<br>
&lt;dauwhe> gregwhitworth: they'll be standardized?<br>
&lt;dauwhe> dino: yes<br>
&lt;fremy> q?<br>
&lt;fremy> q+<br>
&lt;dauwhe> ... we want them to be universal<br>
&lt;Rossen> q+<br>
&lt;dauwhe> dino: don't know if they should be prefixed with --<br>
&lt;glazou> ack melanierichards<br>
&lt;astearns> ack melanierichards<br>
&lt;dauwhe> ... so they know they can't set, maybe it's ++<br>
&lt;surma> q+ do we need `constant`?<br>
&lt;dauwhe> melanierichards: let's say the ua stores the value<br>
&lt;surma> q+<br>
&lt;dauwhe> ... the user hasn't overwritten defeault value of foo<br>
&lt;dauwhe> ... would it be undefined?<br>
&lt;dauwhe> ... as a user, I'd only want the value when it was overwritten by the user<br>
&lt;dauwhe> dino: good question<br>
&lt;astearns> ack Florian_<br>
&lt;dauwhe> Florian_: it's a nice hammer we have here, we should be careful with it<br>
&lt;dauwhe> ... the examples of things are less comfortable with, as they could be solved in other ways<br>
&lt;dauwhe> dino: I'm mostly interested in font size and inset ones<br>
&lt;dauwhe> Florian_: for font size, why don't you change REM<br>
&lt;dauwhe> TabAtkins: REM is font size on root element, this is initial value<br>
&lt;astearns> q?<br>
&lt;dauwhe> Florian_: this will be one rem if not overridden?<br>
&lt;dauwhe> Florian_: for inset, we've been discussing a similar problem, and were trying to solve some other way?<br>
&lt;dauwhe> dino: haven't looked at other solutions<br>
&lt;dauwhe> myles: what's the other one<br>
&lt;melanierichards> s/as a user, I'd/as an author, I'd/<br>
&lt;dauwhe> Florian_: first, a media query for shape, another is another MQ about 'if I place something there, is it visible?'<br>
&lt;dauwhe> ... third is using shape inside: display<br>
&lt;Rossen> q?<br>
&lt;astearns> ack fremy<br>
&lt;dauwhe> ... let's not rush into defining through this, as it might prevent us from exploring other solutions<br>
&lt;dauwhe> fremy: I have same concern as surma<br>
&lt;dauwhe> ... why don't reuse var function?<br>
&lt;dauwhe> ... we could use namespace for var function<br>
&lt;surma> q-<br>
&lt;dauwhe> ... so we don't need new function<br>
&lt;dauwhe> ... just variable under new namespace<br>
&lt;dauwhe> dino: i don't mind<br>
&lt;dauwhe> ... but we used the name constant to remind user they can't change it<br>
&lt;dauwhe> ... under the hood it uses same code as variables<br>
&lt;astearns> ack Rossen<br>
&lt;dauwhe> fremy: I think it's better to reuse namespace inside var<br>
&lt;dauwhe> Rossen: thumbs up on the idea<br>
&lt;dauwhe> ... we've had lots of requests<br>
&lt;dauwhe> ... in terms of getting font size and background colors<br>
&lt;fremy> fremy: e.g. { color: var(user preferred-color) }<br>
&lt;dauwhe> ... respond to high contrast, etc<br>
&lt;Florian_> var(system safe-area-inset)<br>
&lt;dauwhe> ... would be insteresting to see the path forward<br>
&lt;dauwhe> ... and to summarize how much stuff you want to expose<br>
&lt;Bert> q+ to ask do you need the word "constant"? Isn't 'contant(foo)' easier written as 'foo'?<br>
&lt;glazou> q+<br>
&lt;dauwhe> TabAtkins: performance would be better than variables<br>
&lt;dauwhe> ... you don't control the values<br>
&lt;dauwhe> plinss: what about UA changing while you're animating?<br>
&lt;SimonSapin> q+ fallback<br>
&lt;dauwhe> dino: we should have current color blink text :)<br>
&lt;SimonSapin> q- fallback<br>
&lt;SimonSapin> q+<br>
&lt;astearns> ack Bert<br>
&lt;Zakim> Bert, you wanted to ask do you need the word "constant"? Isn't 'contant(foo)' easier written as 'foo'?<br>
&lt;dauwhe> Bert: constant looks like an identity function. can't you use the ID itself? use "fontsize"?<br>
&lt;dauwhe> Florian_: we need comma fallback<br>
&lt;dauwhe> fremy: if you have properties like font-family you couldn't use it<br>
&lt;dauwhe> TabAtkins: this would add an unlimited set of global keywords to CSS<br>
&lt;dauwhe> ... functions prevent that<br>
&lt;dauwhe> gregwhitworth: one should be scroll-bar-width<br>
&lt;dauwhe> ... arrow color,<br>
&lt;astearns> ack glazou<br>
&lt;dauwhe> glazou: I want to expand on unlimited sets of global name<br>
&lt;gregwhitworth> q+<br>
&lt;dauwhe> ... we want to make sure nothing is shipped until everyone agrees on how it works<br>
&lt;astearns> zakim, close queue<br>
&lt;Zakim> ok, astearns, the speaker queue is closed<br>
&lt;dauwhe> ... let's keep it clean<br>
&lt;dauwhe> TabAtkins: you only need a few smart devs with houdini, then everyone can use libraries<br>
&lt;dauwhe> glazou: it's like what fremy said, it's a namespace<br>
&lt;dauwhe> ... I think we can reach consensus on the names<br>
&lt;dauwhe> astearns: two more<br>
&lt;astearns> ack SimonSapin<br>
&lt;dauwhe> SimonSapin: what about fallback?<br>
&lt;dauwhe> dino: you could do comma zero<br>
&lt;astearns> ack gregwhitworth<br>
&lt;SimonSapin> SimonSapin: fallback same as in var()?<br>
&lt;SimonSapin> dino: yes<br>
&lt;dauwhe> gregwhitworth: I think our biggest request is high contrast, which we map to system colors<br>
&lt;dauwhe> ... it became a problem because not everyone does high contrast theming<br>
&lt;dauwhe> ... we may have foreground/background, do we need accent color and accent color2?<br>
&lt;dauwhe> ... I foresee problems<br>
&lt;dauwhe> ... so fallback is what you get<br>
&lt;dauwhe> dino: I hear general agreement<br>
&lt;dauwhe> ... concerns about constants vs var with namespace<br>
&lt;dauwhe> ... melanierichards wants to know when user explicitly change<br>
&lt;dauwhe> ... them, someone else wants to ahve events<br>
&lt;dauwhe> myles: unset is same as "i don't know what you're talking about"<br>
&lt;dauwhe> astearns: general consensus that this is interesting<br>
</details>


-- 
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1693#issuecomment-320232404 using your GitHub account

Received on Friday, 4 August 2017 12:06:36 UTC