From ee42d3029afd0b874977b8b39f098e8d49f05e22 Mon Sep 17 00:00:00 2001
From: Mars Niermann <mars@mniermann.de>
Date: Wed, 29 Mar 2023 23:35:31 +0200
Subject: [PATCH] Add hover background color to table rows, change background
 color of dropdown content, and update focus styles for select dropdowns and
 chips in Headscale UI

---
 src/headscaleui.user.css | 25 ++++++++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/headscaleui.user.css b/src/headscaleui.user.css
index 72bc659..d04eb86 100644
--- a/src/headscaleui.user.css
+++ b/src/headscaleui.user.css
@@ -41,9 +41,15 @@
     background-color: var(--bg1);
     border-bottom: 1px solid var(--bg3);
   }
+  .dropdown-content {
+    background-color: var(--bg2);
+  }
   .collection {
     border: 1px solid var(--bg3);
   }
+  tr:hover {
+    background-color: var(--bg4) !important;
+  }
   .btn,
   .btn-small,
   .btn-large {
@@ -155,6 +161,7 @@
   input[type="search"]:not(.browser-default),
   textarea.materialize-textarea {
     border-bottom: 1px solid var(--fg3);
+    background-color: var(--bg3);
   }
   input:not([type]):not(.browser-default):focus:not([readonly]) + label,
   input[type="text"]:not(.browser-default):focus:not([readonly]) + label,
@@ -188,8 +195,24 @@
   input[type="tel"]:not(.browser-default):focus:not([readonly]),
   input[type="number"]:not(.browser-default):focus:not([readonly]),
   input[type="search"]:not(.browser-default):focus:not([readonly]),
-  textarea.materialize-textarea:focus:not([readonly]) {
+  textarea.materialize-textarea:focus:not([readonly]),
+  .select-wrapper input.select-dropdown:focus,
+  .chips.focus {
     border-bottom: 1px solid var(--green);
     box-shadow: 0 1px 0 0 var(--green);
   }
+  .keyboard-focused .collapsible-header:focus {
+    background-color: var(--bg2);
+  }
+  .chip {
+    color: var(--fg);
+    background-color: var(--fg4);
+  }
+  .chip:focus {
+    color: var(--fg);
+    background-color: var(--green);
+  }
+  .red.lighten-2 {
+    background-color: var(--red) !important;
+  }
 }