- From: Jouni Koivuviita via GitHub <sysbot+gh@w3.org>
- Date: Thu, 23 Apr 2020 06:48:47 +0000
- To: public-css-archive@w3.org
The approach @runarberg proposes is pretty much the same thing as we at Vaadin tried early on (https://github.com/vaadin/vaadin-themable-mixin/issues/12#issuecomment-327802249) as a way to control theme variant propagation and as a way for style sheet authors to have control over them instead of the HTML markup. I would very much like that to be the case, that it would be possible to choose predefined variants using a style sheet. Unfortunately, our implementation ended up being terrible for performance and we moved back to the HTML attribute based solution. This also reminds me of the idea @justinfagnani surfaced in another related discussion about theming shadow roots (https://github.com/w3c/webcomponents/issues/864#issuecomment-601924132). I see it as basically the same idea, but with a slightly different API. The API proposed here feels like it would be easier to author. I don’t know if Justin had thoughts how the author defines the mapping between the “logical properties” and the final properties it is expanded into? Comparing the two, from a consumer perspective: ```css mwc-card { --material-elevation: 2; } ``` ```css mwc-card { theme: material-elevation-2; } ``` From the author perspective (shadow root of mwc-card): ```css :host { /* Not sure how --material-elevation would be processed? */ } ``` ```css :theme(material-elevation-2) { box-shadow: var(--material-elevation-2-box-shadow); } ``` -- GitHub Notification of comment by jouni Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3507#issuecomment-618213025 using your GitHub account
Received on Thursday, 23 April 2020 06:48:49 UTC