mirror of
https://github.com/Nexoniarz/Niveus.git
synced 2026-11-03 04:34:26 +00:00
Show the pressed state on button groups
A button with aria-pressed="true" inside .nv-button-group is now drawn pressed into the surface in the brand colour, so the appearance toggle and any segmented choice show which option is in use. Previously no state was visible. Checked the four example apps in the reworked light theme. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
parent
5d435c4f49
commit
06fca1c385
3 changed files with 21 additions and 1 deletions
10
dist/niveus.css
vendored
10
dist/niveus.css
vendored
|
|
@ -2283,6 +2283,16 @@
|
|||
z-index: 1;
|
||||
translate: none;
|
||||
}
|
||||
|
||||
/* The chosen segment is a key held down: pressed into the surface, in the
|
||||
brand colour, rather than a flat wash. This is what makes the appearance
|
||||
toggle (and any segmented choice) show which option is in use. */
|
||||
.nv-button-group > .nv-button[aria-pressed="true"] {
|
||||
background-color: var(--nv-color-accent-subtle);
|
||||
background-image: none;
|
||||
color: var(--nv-color-accent-text);
|
||||
box-shadow: var(--nv-elevation-inset-sm), var(--nv-ledge);
|
||||
}
|
||||
}
|
||||
@layer niveus.components {
|
||||
/* ==========================================================================
|
||||
|
|
|
|||
Loading…
Reference in a new issue