[Bug]: Slider design needs an update when the value is set to 10 or 90

[gouttierre]

Library

React Components / v9 (@fluentui/react-components)

System Info

https://react.fluentui.dev/?path=/docs/components-slider--default

Are you reporting Accessibility issue?

None

Reproduction

https://react.fluentui.dev/?path=/docs/components-slider--default

Bug Description

Actual Behavior

• As we discussed via mail, Zacky checked the Figma file, and I think the Slider issue is a design issue.

• The current issue is, given the slider value range is 0 to 100, when the value is set to 10 or 90, the thumb is positioned very close to the edge of the track, which could look like 0 or 100 to users.

Expected Behavior

• The Slider UI needs to be more clear to the user when the value is set to +/- 90
• Angie Badillo will review the Slider design spec [TASK 10897]

Logs

No response

Requested priority

Blocking

Products/sites affected

Edge

Are you willing to submit a PR to fix?

no

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[dmytrokirpa]

The issue will be addressed as part of #32171.