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.

Sign up for GitHub

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

Jump to bottom

Make form range track background more contrasted #39095

Merged
merged 2 commits into from
Sep 13, 2023
Merged

Make form range track background more contrasted #39095

merged 2 commits into from
Sep 13, 2023

Conversation

julien-deramond
Copy link
Member

@julien-deramond julien-deramond commented Aug 23, 2023 •
edited
Loading

Description

This PR makes the form range track background color more contrasted for a11y reasons. The previous color wasn't enough contrasted, especially in light mode. I chose the secondary color instead of the tertiary color so that it works automatically in both light and dark modes.

Before

Screenshot 2023-08-23 at 07 43 19
Screenshot 2023-08-23 at 07 43 05

Now

Screenshot 2023-08-23 at 07 44 43
Screenshot 2023-08-23 at 07 44 33

Type of changes

  • Bug fix (non-breaking change which fixes an issue)

Checklist

  • I have read the contributing guidelines
  • My code follows the code style of the project (using npm run lint)
  • (N/A) My change introduces changes to the documentation
  • (N/A) I have updated the documentation accordingly
  • (N/A) I have added tests to cover my changes
  • All new and existing tests passed

Live previews

Related issues

Closes #38999

@julien-deramond julien-deramond marked this pull request as ready for review August 23, 2023 05:46
@julien-deramond julien-deramond requested a review from a team as a code owner August 23, 2023 05:46
louismaximepiton
louismaximepiton approved these changes Aug 23, 2023
View reviewed changes
Copy link
Member

@louismaximepiton louismaximepiton left a comment

Choose a reason for hiding this comment

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

Fine on CSS side, I find it better on design side as well.

@julien-deramond julien-deramond merged commit 4724e7a into main Sep 13, 2023
13 checks passed
@julien-deramond julien-deramond deleted the main-jd-change-form-range-track-bg branch September 13, 2023 05:59
romankupchak93 pushed a commit to romankupchak93/bootstrap that referenced this pull request Jan 5, 2024
@julien-deramond @romankupchak93
Make form range track background more contrasted (twbs#39095)
cbbdbb4
@CGrabda CGrabda mentioned this pull request May 17, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request May 18, 2024
Open
@lukegeor lukegeor mentioned this pull request May 18, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request May 19, 2024
Open
This was referenced May 19, 2024
Open
Open
@RatanaSenpai RatanaSenpai mentioned this pull request May 19, 2024
Open
@Identian Identian mentioned this pull request May 20, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request May 21, 2024
Open
@Hamberfim Hamberfim mentioned this pull request May 21, 2024
Merged
@V1CTORY360 V1CTORY360 mentioned this pull request May 22, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request May 23, 2024
Open
This was referenced May 24, 2024
Open
Open
@devcurt696 devcurt696 mentioned this pull request May 24, 2024
Open
@BeyondMaxim BeyondMaxim mentioned this pull request May 24, 2024
Open
@suryaelidanto suryaelidanto mentioned this pull request May 24, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Sep 28, 2024
Open
@YnnusAsamal YnnusAsamal mentioned this pull request Sep 28, 2024
Open
@DeFiTON DeFiTON mentioned this pull request Sep 29, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Sep 29, 2024
Open
@DeFiTON DeFiTON mentioned this pull request Sep 30, 2024
Open
@lisagorewitdecker lisagorewitdecker mentioned this pull request Sep 30, 2024
Merged
@YnnusAsamal YnnusAsamal mentioned this pull request Sep 30, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Sep 30, 2024
Open
@YnnusAsamal YnnusAsamal mentioned this pull request Oct 1, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Oct 1, 2024
Open
@Akhamesra Akhamesra mentioned this pull request Oct 2, 2024
Open
This was referenced Oct 2, 2024
Open
Open
@YnnusAsamal YnnusAsamal mentioned this pull request Oct 3, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Oct 4, 2024
Open
@jtprogru jtprogru mentioned this pull request Oct 5, 2024
Open
@Gutts-n Gutts-n mentioned this pull request Oct 5, 2024
Open
@Kimahari Kimahari mentioned this pull request Oct 5, 2024
Open
This was referenced Oct 5, 2024
Open
Open
This was referenced Oct 12, 2024
Open
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Oct 13, 2024
Open
This was referenced Oct 15, 2024
Open
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Oct 20, 2024
Open
@Sarrac3873 Sarrac3873 mentioned this pull request Oct 22, 2024
Open
@RatanaSenpai RatanaSenpai mentioned this pull request Oct 27, 2024
Open
This was referenced Oct 29, 2024
Open
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@mdo mdo mdo approved these changes

@louismaximepiton louismaximepiton louismaximepiton approved these changes

Assignees
No one assigned
Labels
accessibility css design v5
Projects
No open projects
v5.3.2
Status: Done
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Range form element track background is practically invisible on a white background
3 participants
@julien-deramond @mdo @louismaximepiton