search

w3ctag / webcomponents-design-guidelines

https://w3ctag.github.io/webcomponents-design-guidelines/ - Guidelines for creating web platform compatible components
8 stars 8 forks source link

Issue with our guidance of use of custom properties #8

Open torgo opened 3 years ago

torgo commented 3 years ago

From https://twitter.com/LeaVerou/status/1316353717688557571 from @leaverou:

The @w3ctag advice is to use custom properties over attributes for presentation.

Unfortunately, custom elements can neither listen to changes on CSS properties, nor use them to toggle rules, making this impossible for high level styling.

Proposal: https://discourse.wicg.io/t/observe-current-computed-style-changes-styleobserver/4879

LeaVerou commented 3 years ago

Thank you Daniel for raising this. FWIW, I see this as an issue with custom properties, not an issue with the guidance. The guidance is very sound and correct, we just need to make sure the platform can support it.

torgo commented 3 years ago

Ok thanks for the clarification Lea – I mostly wanted to create an issue so we could have an anchor to discuss at the future TAG meting call. Do you think we should make a note in the document to reflect the issue?

LeaVerou commented 3 years ago

This issue is also relevant: https://github.com/w3c/webcomponents/issues/856 I opened this in csswg, in case we can solve it from CSS: https://github.com/w3c/csswg-drafts/issues/5624

Do you think we should make a note in the document to reflect the issue?

Yes.

LeaVerou commented 3 years ago

Ok thanks for the clarification Lea – I mostly wanted to create an issue so we could have an anchor to discuss at the future TAG meeting call.

Now that I'm here, I'm wondering if we could pick this up in a breakout soon, or the F2F? I want to make sure this guidance can be followed by authors, otherwise we are setting them up for failure.

alice commented 3 years ago

https://www.w3.org/2001/tag/doc/webcomponents-design-guidelines/

"Don’t use custom attributes for styling, like bgcolor. Instead use Custom Properties or CSS Shadow Parts."

LeaVerou commented 3 years ago

Link to specific text: https://w3ctag.github.io/webcomponents-design-guidelines/#x1-1-native-html-elements:~:text=Don%E2%80%99t%20use%20custom%20attributes%20for%20styling%2C,Custom%20Properties%20or%20CSS%20Shadow%20Parts.

LeaVerou commented 2 years ago

Note that container queries allow for style queries too, so this guidance may be possible to follow in the near future (or at least more feasible for more cases).