Re: [csswg-drafts] [css-mixins] Proposal: `@like` rule for repurposing page default styles (#10222)

I understand that, but do not support the suggested solution. 

I think _a_ proper way forward to solve the most important of your use cases is as follows:

1. Introduce a way to register either selectors or styles for semantic “templates”, with keywords based on ARIA roles.
2. Add sample assignments in the default stylesheet for HTML. Author styles would automatically update these. 
3. Let authors overwrite these assignments. 
4. Let component authors call in such templates into their components. (This could be unified with either the `appearance` or the `all` property, but I’m not convinced that’s a good idea.)

~~~~ css
/* Variant 1: registered styles */
input[type=button] {template: button; color: green;}
input[type=button] {outline-color: green;} /* identical selector */
input {border-color: green;} /* used indirectly */
input[type=button]#more-specific {background: red;} /* not used */
my-component {template-apply: button;}
~~~~
~~~~ css
/* Variant 2: registered selector */
@template button: input[type=button], button;
input[type=button] {color: green;}
input {border-color: green;} /* used indirectly */
input[type=button]#more-specific {background: red;} /* not used */
my-component {template: button;}
~~~~
~~~~ css
/* not viable, because authors would actively need to specify the pseudo-class */
:role(button), button, input[type=button] {color: green;}
my-component {role: button;} /* optional feature, alternatively: 
`<my-component role="button">` */
~~~~

-- 
GitHub Notification of comment by Crissov
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10222#issuecomment-2198573282 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Sunday, 30 June 2024 14:01:15 UTC