New theme adjustments

5 files changed, 40 insertions, 21 deletions

diff --git a/keepassxc-browser/css/autocomplete.css b/keepassxc-browser/css/autocomplete.css
index 625f33c..f81d13b 100644
--- a/keepassxc-browser/css/autocomplete.css
+++ b/keepassxc-browser/css/autocomplete.css
@@ -6,18 +6,22 @@
     padding: 5px;
     cursor: pointer;
     background-color: var(--background-color);
-    border-bottom: 1px solid #d4d4d4;
-    border-left: 1px solid #d4d4d4;
-    border-right: 1px solid #d4d4d4;
+    border: 1px solid rgba(0,0,0,.125) !important;
+    border-top-width: 0px !important;
     width: auto;
     color: var(--text-color);
     font-size: .9em !important;
 }
 
+.kpxcAutocomplete-items div:last-child {
+    border-bottom-right-radius: 4px !important;
+    border-bottom-left-radius: 4px !important;
+}
+
 .kpxcAutocomplete-items footer {
     padding: 5px;
     background-color: #ddd;
-    border: 1px solid #d4d4d4 !important;
+    border: 1px solid rgba(0,0,0,.125) !important;
     width: auto;
     color: #000;
     font-size: .8em !important;
@@ -25,7 +29,7 @@
 }
 
 .kpxcAutocomplete-active {
-    background-color: #6cac4d !important; 
+    background-color: #28a745 !important;
     color: #ffffff !important;
 }
 
diff --git a/keepassxc-browser/css/banner.css b/keepassxc-browser/css/banner.css
index 543caaf..301e23a 100644
--- a/keepassxc-browser/css/banner.css
+++ b/keepassxc-browser/css/banner.css
@@ -26,7 +26,7 @@ div.kpxc-banner {
     from {
         max-height: 0em;
     }
-  
+
     to {
         max-height: 4em;
     }
@@ -113,7 +113,9 @@ div.kpxc-banner-dialog .list-group {
 }
 
 div.kpxc-banner-dialog .list-group-item {
-    border: 1px solid #ddd !important;
+    background-color: var(--input-background-color) !important;
+    border: 1px solid rgba(0,0,0,.125) !important;
+    border-bottom: 0px !important;
     color: var(--text-color) !important;
     display: block !important;
     padding: 7px 14px;
@@ -122,14 +124,16 @@ div.kpxc-banner-dialog .list-group-item {
 }
 
 div.kpxc-banner-dialog .list-group-item:first-child {
+    border-top-width: 1px !important;
     border-top-left-radius: 4px !important;
     border-top-right-radius: 4px !important;
 }
 
 div.kpxc-banner-dialog .list-group-item:last-child {
-    margin-bottom: 0 !important;
+    border-bottom: 1px solid rgba(0,0,0,.125) !important;
     border-bottom-right-radius: 4px !important;
     border-bottom-left-radius: 4px !important;
+    margin-bottom: 0 !important;
 }
 
 div.kpxc-banner-dialog .list-group-item:hover {
diff --git a/keepassxc-browser/css/colors.css b/keepassxc-browser/css/colors.css
index 8704d81..190065b 100644
--- a/keepassxc-browser/css/colors.css
+++ b/keepassxc-browser/css/colors.css
@@ -1,5 +1,6 @@
 :root {
     --background-color: #fff;
+    --card-background-color: #fff;
     --card-border-color: rgba(0,0,0,.125);
     --card-header-color: #fafafa;
     --container-border: 1px solid #ccc;
@@ -10,6 +11,7 @@
     --input-main-border-color: rgba(0,0,0,.125);
     --link-color: #3a8233;
     --link-hover-color: #429f14;
+    --sidebar-background-color: #27272a;
     --table-border-color: rgb(222, 226, 230);
     --table-hover-color: #f2f2f2;
     --table-odd-color: #f2f2f2;
@@ -18,12 +20,13 @@
 
 @media (prefers-color-scheme: dark) {
     :root {
-        --background-color: #3b3d3c;
+        --background-color: #3b3b3d;
+        --card-background-color: #2b2a2a;
         --card-border-color: #292a2a;
-        --card-header-color: #2a2a2a;
+        --card-header-color: #27272a;
         --container-border: 1px solid #000;
         --input-active-border-color: #2b4d1a;
-        --input-background-color: #2f2f2f;
+        --input-background-color: #27272a;
         --input-border: 1px solid #2b4d1a;
         --input-border-color: #292a2a;
         --input-main-border-color: #3b3d3c;
@@ -38,12 +41,13 @@
 
 /* Same colors for manual switching */
 [data-color-theme='dark'] {
-    --background-color: #3b3d3c;
+    --background-color: #3b3b3d;
+    --card-background-color: #2b2a2a;
     --card-border-color: #292a2a;
-    --card-header-color: #2a2a2a;
+    --card-header-color: #27272a;
     --container-border: 1px solid #000;
     --input-active-border-color: #2b4d1a;
-    --input-background-color: #2f2f2f;
+    --input-background-color: #27272a;
     --input-border: 1px solid #2b4d1a;
     --input-border-color: #292a2a;
     --input-main-border-color: #3b3d3c;
@@ -51,12 +55,13 @@
     --link-hover-color: #429f14;
     --table-border-color: #a0a0a0;
     --table-hover-color: #474948;
-    --table-odd-color: #3b3d3c;
+    --table-odd-color: #3b3b3d;
     --text-color: #cbcfcb;
 }
 
 [data-color-theme='light'] {
     --background-color: #fff;
+    --card-background-color: #fff;
     --card-border-color: rgba(0,0,0,.125);
     --card-header-color: #fafafa;
     --container-border: 1px solid #ccc;
diff --git a/keepassxc-browser/options/options.css b/keepassxc-browser/options/options.css
index dd93a7f..1e75ee2 100644
--- a/keepassxc-browser/options/options.css
+++ b/keepassxc-browser/options/options.css
@@ -15,7 +15,8 @@ a:hover {
     text-decoration: none;
 }
 
-table td {
+.table td {
+    vertical-align: middle !important;
     width: 100%;
     word-break: break-all;
 }
@@ -81,7 +82,7 @@ button.collapsed {
 }
 
 .card {
-    background-color: var(--input-background-color);
+    background-color: var(--card-background-color);
     border: 1px solid rgba(0,0,0,.125);
     margin-bottom: 2rem;
     min-width: 720px;
@@ -101,7 +102,7 @@ button.collapsed {
 }
 
 .sidebar {
-    background-color: #2f2f2f !important;
+    background-color: var(--sidebar-background-color) !important;
     bottom: 0;
     min-width: 160px !important;
     position: fixed;
@@ -156,6 +157,7 @@ button.collapsed {
 .invalid-feedback {
     color: var(--link-color);
     display: block;
+    font-size: 95% !important;
 }
 
 .invalid-feedback code {
@@ -300,7 +302,7 @@ button.collapsed {
     }
 
     .card-body {
-        background-color: var(--input-background-color);
+        background-color: var(--card-background-color);
         color: var(--text-color);
     }
 }
diff --git a/keepassxc-browser/popups/popup.css b/keepassxc-browser/popups/popup.css
index 24de254..fe915ff 100644
--- a/keepassxc-browser/popups/popup.css
+++ b/keepassxc-browser/popups/popup.css
@@ -10,6 +10,10 @@ body {
     width: auto;
 }
 
+code {
+    font-size: 14px !important;
+}
+
 .container {
     min-width: 440px;
     max-width: 460px;
@@ -41,7 +45,7 @@ body {
     padding: 5px 10px !important;
 }
 
-.list-group-item+.list-group-item {
+.list-group-item+.list-group-item:first-child {
     border-top-width: 1px !important;
     border-top-left-radius: .25rem;
     border-top-right-radius: .25rem;
@@ -138,7 +142,7 @@ body {
         background-color: var(--table-hover-color) !important;
         color: var(--text-color) !important;
     }
-    
+
     #login-filter {
         color: var(--text-color) !important;
     }