Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[select] Use the new ::behavior selector and clarify that ::part doesn't work #714

Closed
wants to merge 1 commit into from

Conversation

xiaochengh
Copy link

Fixes #645

@xiaochengh xiaochengh requested a review from andrico1234 as a code owner April 7, 2023 22:45
@andrico1234
Copy link
Collaborator

andrico1234 commented Apr 8, 2023

@gregwhitworth @josepharhar , are either of you able to review the content for this change? :)

`::part()` can be used to style the `button`, `selected-value`, and `listbox` parts of the control.
`::behavior()` can be used to style the `button`, `selected-value`, and `listbox` parts of the control.

Note that the `::part()` pseudo-element selector only matches elements in the user-agent shadow tree, and hence, fails to match any author-provided part (as in [slotting your own content](#slotting-your-own-content)).
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can you please wrap this with a div with a class of .note

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also see my above comment on whether ::behavior is defined somewhere as this should be covered in that definition; not in selectmenu itself.

@@ -52,18 +52,18 @@ Selectmenu provides a variety of tools to help with styling, including pseudo-se

### Styling parts of the control

One way to style the control to match your requirements is to use the CSS `::part()` pseudo-element to select the different parts within the control's anatomy that you wish to style.
One way to style the control to match your requirements is to use the CSS `::behavior()` pseudo-element, newly introduced for the selectmenu element, to select the different parts within the control's anatomy that you wish to style.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should link out to the definition of behavior. Do we have one in CSSWG yet? If not we should probably expound on this.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know of a CSSWG issue proposing ::behavior yet.
If we remove the "newly introduced for the selectmenu element" part is that good enough to merge this now?
I'm hesitant to open a CSSWG issue proposing this just yet since domenic's general feedback could change how this works. I haven't even opened an HTML issue for selectmenu yet.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is not in CSSWG yet.

I'm hesitant to open a CSSWG issue proposing this just yet since domenic's general feedback could change how this works. I haven't even opened an HTML issue for selectmenu yet.

I feel the same. Should we create a draft spec of ::behavior somewhere at open-ui?

@gregwhitworth
Copy link
Member

@josepharhar @xiaochengh I'm presuming we should abandon this PR?

@xiaochengh
Copy link
Author

Yeah, it doesn't seem relevant with the element model.

@xiaochengh xiaochengh closed this Aug 21, 2023
@xiaochengh xiaochengh deleted the behavior-selector branch August 21, 2023 19:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[selectmenu] Add CSS selector to consistently select selectmenu parts
4 participants