November 22nd, 2019

@marcenglund @vaadin Note that this is exactly what the light.css / dark.css / common.css architecture does. You set the variables in light.css respectively dark.css, and use them in common.css. No JS needed.

10:49 PM, Nov 22nd, 2019 via Twitter Web App in reply to marcenglund

@rob_dodson @nhoizey The core idea is to make everything dependent on the root font size (which in turn you set to 100%, so the user can choose their preferred default size in the browser settings):

“`css
body {
font-size: 100%; /* 16px by default, bu

10:46 PM, Nov 22nd, 2019 via Twitter Web App in reply to rob_dodson

@nhoizey I’m mostly making the case for _not_ setting it to anything absolute; `100%` does not change anything of course :-)

The idea is to make it relative, so you can…

“`css
@​media (min-width: 768px) {
body {
font-size: 112.5%;
}
}
“`

4:42 PM, Nov 22nd, 2019 via Twitter Web App in reply to nhoizey

@jaffathecake bugs.webkit.org/attachment.cgi… 🎉

4:36 PM, Nov 22nd, 2019 via Twitter Web App in reply to tomayac

@marcenglund @vaadin Thanks for the kind words 😊. You can actually make it completely independent from JavaScript by following the loading strategy outlined in web.dev/prefers-color-…. I love the `media` attribute on `<link rel=stylesheet>`, it’s inc

4:24 PM, Nov 22nd, 2019 via Echofon in reply to marcenglund

@nhoizey @simevidas @igrigorik @ppk @rob_dodson 100% of the user’s global browser font size setting, which defaults to 16px, but can be easily overridden. pic.twitter.com/XlEdEvSFgt

4:21 PM, Nov 22nd, 2019 via Twitter Web App in reply to nhoizey

@slightlylate @jyasskin @kosamari @beverloo @KenjiBaheux It’s coincidence. I get these annoying DiDi SMS in Germany and was never using their app or site on an Android device, only the iOS app.

3:46 PM, Nov 22nd, 2019 via Echofon in reply to slightlylate

@simevidas @igrigorik @ppk Setting the root font size to 100% is one of my favorite tips I learned from betterwebtype.com/articles/2019/….

CC: @rob_dodson regarding web.dev (I think this is the deep link: github.com/GoogleChrome/w…)

3:24 PM, Nov 22nd, 2019 via Echofon in reply to simevidas

@rowan_m 🤯 We’ve been pitching PWA wrong the entire time.

3:18 PM, Nov 22nd, 2019 via Echofon in reply to rowan_m

@marcenglund @vaadin This will catch color scheme changes, but you also need to initialize it on first load.

3:00 PM, Nov 22nd, 2019 via Echofon in reply to marcenglund

@mrdoob @mathias Thinking about it more, probably one should prohibit all network-involving operations to avoid tracking (onhover etc.).

2:40 PM, Nov 22nd, 2019 via Twitter for iPhone in reply to tomayac

@mrdoob @mathias Definitely cool!
🤔 If SVG <script> were scoped to the enclosing <svg> tags (rather than being global, as spec’ed now), could we then have scripts execute safely in an <img>?

<!— Unreachable —>
<svg […]>
<script>/* Can’t reach ou

2:35 PM, Nov 22nd, 2019 via Twitter Web App in reply to mrdoob

@mathias @mrdoob @ppparshekar I wonder why anyone thought global scope for SVG <script> was a good idea: “Any functions defined within any ‘script’ element have a “global” scope across the entire current document.”-svgwg.org/svg2-draft/int…e

2:11 PM, Nov 22nd, 2019 via Twitter for iPhone in reply to mathias

@mathias Blame @mrdoob.

12:24 PM, Nov 22nd, 2019 via Twitter Web App in reply to mathias

@jaffathecake There’s movement on the bug, so here’s hoping: bugs.webkit.org/show_bug.cgi?i….

9:27 AM, Nov 22nd, 2019 via Twitter Web App in reply to jaffathecake

@igrigorik @stefanjudis @ppk No hard data that I could share, sorry. It’s more popular on mobile: Android Q turns on dark theme with battery safer, and Apple has a pretty solid dark mode onboarding story when on updates to iOS 13. On desktop, it’s harmedium.com/dev-channel/le…

11:26 PM, Nov 21st, 2019 via Twitter for iPhone in reply to igrigorik