cdransf/coryd.dev
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(*.css): more consistent hover states + fix reduced motion support

Browse source
This commit is contained in:
Cory Dransfeldt 2025-04-14 13:54:00 -07:00
parent a284f758e2
commit 321b6d2fca
No known key found for this signature in database
8 changed files with 45 additions and 71 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/assets/styles/components/buttons.css
View file

@ -1,4 +1,3 @@
@import url("./tab-buttons.css");
@import url("./text-toggle.css");
button:not([data-modal-button]),
@ -20,13 +19,17 @@ button:not([data-modal-button]),
transition: transform var(--transition-duration-default) var(--transition-ease-in-out);
@media (prefers-reduced-motion) {
transition: background-color var(--transition-duration-default) var(--transition-ease-in-out);
transition:
border-color var(--transition-duration-default) var(--transition-ease-in-out),
background-color var(--transition-duration-default) var(--transition-ease-in-out);
}
&:not(.active):is(:hover, :active, :focus, :focus-within) {
transform: translateY(var(--button-offset-hover));
@media (prefers-reduced-motion) {
transform: none;
border-color: var(--accent-color-hover);
background-color: var(--accent-color-hover);
}
}