New property to control the direction of slider controls
Nobody has claimed this yet.
- Dominant language
- Bikeshed
- Stars
- 4.9k
- Forks
- 816
- PR merge metrics
- PR metrics pending
Description
I'm extracting this question from the various discussions in several forums:
- https://github.com/w3c/csswg-drafts/issues/4410#issuecomment-1898417658
- https://github.com/whatwg/html/issues/4177#issuecomment-1882909538
- https://github.com/whatwg/html/issues/8413#issuecomment-1898434004
- https://github.com/openui/open-ui/issues/959
For slider controls (<input type=range>, <progress>, <meter>, potentially <input type=checkbox switch>, etc.) there is a desire to be able to control:
- The orientation of the slider: horizontal vs. vertical.
- The polarity/direction of the slider: which way is toward "more".
- The writing mode and direction of any text associated with the control, such as tooltips.
In current browsers, #1 is controlled by the CSS writing-mode property, and #2 is controlled by the CSS direction property. This does allow full control of orientation and direction for sliders, and at least recently (thanks @dizhang168), this behavior is implemented interoperably, despite a lack of standards for this behavior. However, because of #3 (see https://github.com/whatwg/html/issues/4177#issuecomment-1882909538 in particular), it might make sense to have a specific CSS property to control the orientation and direction of slider type controls. One tricky detail will be getting it to behave predictably in the face of existing writing-mode/direction behavior, and maybe even the non-standard orient=vertical.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reading the linked CSSWG, WHATWG, and Open UI discussions, then compare the existing writing-mode and direction behavior for range, progress, and meter controls. Done means defining a specific property and predictable interactions with writing-mode, direction, and the non-standard orient="vertical" behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend, web-dev
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100