mara/hyperhive
mara/hyperhive
Watch
0
0
Fork
You've already forked hyperhive
 0
Code Activity

swarm-ui: keyboard focus keeps a visible ring on interactive cards and notification boxes

Browse source
This commit is contained in:
iris 2026-11-04 22:06:20 +01:00 • committed by mara
commit 528c4476cb
2 changed files with 8 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/packages/swarm-ui/src/pages/notifications/NotificationsPage.css
View file

@ -181,7 +181,9 @@
stroke: var(--green); stroke: var(--green);
} }
.notify-box:focus { /* A click leaves no ring; keyboard focus keeps the browser's own, so a
focused box does not look like a selected one. */
.notify-box:focus:not(:focus-visible) {
outline: none; outline: none;
} }

6
frontend/packages/swarm-ui/src/ui/card/Card.css
View file

@ -15,7 +15,11 @@
[role="button"].ui-card:hover, [role="button"].ui-card:hover,
[role="button"].ui-card:focus-visible { [role="button"].ui-card:focus-visible {
border-color: var(--purple); border-color: var(--purple);
outline: none; }
/* Keyboard focus needs more than the hover tint, so it keeps a real ring. */
[role="button"].ui-card:focus-visible {
outline: 2px solid var(--purple);
outline-offset: 2px;
} }
/* A solid border (not just the hover tint above, which needs to keep /* A solid border (not just the hover tint above, which needs to keep
meaning "hovering", not double as "selected") plus a faint fill so a meaning "hovering", not double as "selected") plus a faint fill so a