From 15bed364fbb7a804697544af84939923d14a6a65 Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Thu, 2 Mar 2023 10:51:15 +0100
Subject: [PATCH] Fix sort button focus

---
 client/src/components/SortButton.vue | 10 +++++-----
 client/src/scss/classes.scss         |  4 ++++
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/client/src/components/SortButton.vue b/client/src/components/SortButton.vue
index 6c932fe..cea6330 100644
--- a/client/src/components/SortButton.vue
+++ b/client/src/components/SortButton.vue
@@ -77,11 +77,11 @@
 
       &:focus + span {
         position: absolute;
-        top: -1px;
-        left: -1px;
-        right: -1px;
-        bottom: -1px;
-        border: 2px solid var(--select-focus);
+        top: -2px;
+        left: -2px;
+        right: -2px;
+        bottom: -2px;
+        border: 3px solid $main-font-color;
         border-radius: inherit;
       }
     }
diff --git a/client/src/scss/classes.scss b/client/src/scss/classes.scss
index 7b4dc02..f756ffb 100644
--- a/client/src/scss/classes.scss
+++ b/client/src/scss/classes.scss
@@ -117,6 +117,10 @@
   background-color: #fff;
   color: #000;
 
+  &:focus-within {
+    box-shadow: 0 0 0 0.25rem $main-font-color;
+  }
+
   &:after {
     top: 50%;
     right: calc(0% + 15px);