Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2025-02-13 14:16:25 +01:00
Code Issues Projects Releases Packages Wiki Activity

web/layout: add & use the css variable for the focus ring

Browse source
This commit is contained in:
wukko 2025-02-13 00:32:02 +06:00
parent 935947cafc
commit 8d7f0d984f
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
4 changed files with 6 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
web/src/components/dialog/PickerItem.svelte
View file

@ -72,7 +72,7 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
box-shadow: 0 0 0 2px var(--blue) inset; box-shadow: var(--focus-ring);
border-radius: inherit; border-radius: inherit;
} }

2
web/src/components/queue/ProcessingStatus.svelte
View file

@ -58,7 +58,7 @@
#processing-status.completed { #processing-status.completed {
box-shadow: box-shadow:
0 0 0 2px var(--blue) inset, var(--focus-ring),
var(--processing-status-glow); var(--processing-status-glow);
} }

2
web/src/components/save/buttons/DownloadButton.svelte
View file

@ -91,7 +91,7 @@
} }
#download-button:focus-visible { #download-button:focus-visible {
box-shadow: 0 0 0 2px var(--blue) inset; box-shadow: var(--focus-ring);
} }
#download-state { #download-state {

4
web/src/routes/+layout.svelte
View file

@ -114,6 +114,8 @@
--green: #51cf5e; --green: #51cf5e;
--blue: #2f8af9; --blue: #2f8af9;
--focus-ring: 0 0 0 2px var(--blue) inset;
--button: #f4f4f4; --button: #f4f4f4;
--button-hover: #e8e8e8; --button-hover: #e8e8e8;
--button-active-hover: #2a2a2a; --button-active-hover: #2a2a2a;
@ -364,7 +366,7 @@
} }
:global(:focus-visible) { :global(:focus-visible) {
box-shadow: 0 0 0 2px var(--blue) inset !important; box-shadow: var(--focus-ring) !important;
outline: none; outline: none;
z-index: 1; z-index: 1;
} }