diff --git a/web/src/components/save/Omnibox.svelte b/web/src/components/save/Omnibox.svelte index f969590b..e986100b 100644 --- a/web/src/components/save/Omnibox.svelte +++ b/web/src/components/save/Omnibox.svelte @@ -115,6 +115,7 @@ #input-container.focused :global(#input-link-icon) { stroke: var(--secondary); } + #input-container.downloadable :global(#input-link-icon) { stroke: var(--secondary); } diff --git a/web/src/components/save/buttons/DownloadButton.svelte b/web/src/components/save/buttons/DownloadButton.svelte index 86b56b15..2e0838cb 100644 --- a/web/src/components/save/buttons/DownloadButton.svelte +++ b/web/src/components/save/buttons/DownloadButton.svelte @@ -106,7 +106,7 @@ } #download-button:focus-visible { - box-shadow: 0 0 0 1.5px var(--secondary) inset; + box-shadow: 0 0 0 2px var(--blue) inset; } #download-state { diff --git a/web/src/components/sidebar/SidebarTab.svelte b/web/src/components/sidebar/SidebarTab.svelte index d6a2f5fc..36b50f6c 100644 --- a/web/src/components/sidebar/SidebarTab.svelte +++ b/web/src/components/sidebar/SidebarTab.svelte @@ -44,13 +44,14 @@ } .sidebar-tab:focus-visible { - box-shadow: 0 0 0 1.5px var(--sidebar-highlight) inset; + box-shadow: 0 0 0 3px var(--blue) inset; outline: none; z-index: 1; } .sidebar-tab.active:focus-visible { - box-shadow: 0 0 0 1.5px var(--sidebar-bg) inset; + background: var(--blue); + color: var(--sidebar-highlight); } @media screen and (max-width: 535px) { diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte index 70f4b214..bfc6deff 100644 --- a/web/src/routes/+layout.svelte +++ b/web/src/routes/+layout.svelte @@ -16,6 +16,7 @@ --primary: #ffffff; --secondary: #000000; --gray: #8d8d95; + --blue: #2f8af9; --button: #eeeeee; --button-hover: #e8e8e8; @@ -120,7 +121,7 @@ } :global(button:focus-visible) { - box-shadow: 0 0 0 1.5px var(--secondary) inset; + box-shadow: 0 0 0 2px var(--blue) inset; outline: none; z-index: 1; }