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

fix(VSwitch): render in forced-colors mode #19703

Merged
merged 6 commits into from
May 13, 2024

Conversation

06b
Copy link
Contributor

@06b 06b commented Apr 26, 2024

Description

fixes #19702

Before:
image
After (Example when the Night sky contrast theme is selected in windows):
image

Because native switch toggles aren't standardized yet for the web, I did my best to select what the expected system color keywords would be comparing to how the operating system changed the switches in other applications such as Windows Settings when turning on contrast themes.

Markup:

@MajesticPotatoe MajesticPotatoe added T: bug Functionality that does not work as intended/expected C: VSwitch VSwitch labels Apr 30, 2024
@johnleider
Copy link
Member

Is it possible to adjust the css selectors so that we don't use !important?

@06b
Copy link
Contributor Author

06b commented May 7, 2024

Yeah, it should be possible - I'll convert this pull request to a draft while I refactor it.

Turns out while it is possible to reduce the amount of !important's however it is not possible avoid using it altogether due to the built-in colors using !important when using the color prop for switches (as they are added to the elements of the switch when it is on [e.g. 'bg-primary','bg-red'])

I can however reduce the amount of !importants used from 5 down to 3.

image

Let me know if you wish for me to proceed with this change

@06b 06b marked this pull request as draft May 7, 2024 19:16
@06b 06b marked this pull request as ready for review May 7, 2024 22:02
@06b
Copy link
Contributor Author

06b commented May 8, 2024

All !importants have been removed, had to adjust the VSwitch to not apply the bg- classes if detects that forced-colors mode is active.

@johnleider johnleider added the S: has merge conflicts The pending Pull Request has merge conflicts label May 9, 2024
@06b
Copy link
Contributor Author

06b commented May 9, 2024

@johnleider I resolved the merge conflicts on Github (which merged the 'master' batch into the pull request), I then saw that on the vuetify contributing page states "Pull requests that include unrelated commits or your local merges will be CLOSED without notice" so if this pull request is closed, I'll assume I should just do a new pull request based off latest master that way it doesn't have the merge commit included.

@06b 06b requested a review from johnleider May 9, 2024 20:55
@06b 06b requested a review from johnleider May 13, 2024 13:47
@johnleider johnleider removed the S: has merge conflicts The pending Pull Request has merge conflicts label May 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VSwitch VSwitch T: bug Functionality that does not work as intended/expected
Projects
None yet
3 participants