From f28f1e31c2dfceb15a9cb12bbb23b7dca9350ab6 Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Fri, 7 Feb 2025 14:08:06 +0100
Subject: [PATCH] chore: dark & light mode improvements

---
 src/components/Order.vue     |  6 +++++-
 src/components/OrderList.vue | 17 +++++++++++++++--
 src/styles/global.scss       |  3 ++-
 3 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/components/Order.vue b/src/components/Order.vue
index 8135273..cf2556d 100644
--- a/src/components/Order.vue
+++ b/src/components/Order.vue
@@ -170,7 +170,11 @@ $darkModeTextCol: #eee;
 
   select {
     color: $darkModeTextCol !important;
-    border-color: $darkModeTextCol !important;
+    border-color: $darkModeTextCol;
+
+    &:focus-visible {
+      border-color: $accentCol;
+    }
   }
 
   option,
diff --git a/src/components/OrderList.vue b/src/components/OrderList.vue
index e5da5ae..7fbecfe 100644
--- a/src/components/OrderList.vue
+++ b/src/components/OrderList.vue
@@ -31,8 +31,8 @@
         <hr />
 
         <div class="buttons">
-          <button class="g-button action" @click="selectLocalOrder(order)">Wybierz</button>
-          <button class="g-button action" @click="removeOrder(order)">Usuń</button>
+          <button class="g-button" @click="selectLocalOrder(order)">Wybierz</button>
+          <button class="g-button" @click="removeOrder(order)">Usuń</button>
         </div>
       </li>
     </transition-group>
@@ -178,5 +178,18 @@ li {
 .buttons {
   display: flex;
   gap: 0.5em;
+
+  button {
+    padding: 0.5em;
+    background-color: $bgColLighter;
+
+    &:hover {
+      background-color: #666;
+    }
+
+    &:focus-visible {
+      outline: 2px solid $accentCol;
+    }
+  }
 }
 </style>
diff --git a/src/styles/global.scss b/src/styles/global.scss
index 1bc85be..911280b 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -67,7 +67,8 @@ button {
 
 button.g-button {
   text-align: center;
-  color: white;
+  color: inherit;
+  
   transition:
     color 100ms ease-in,
     background-color 100ms ease-in;