From 405c9c4a4017521f89ef80e8d475742c8b8aeb59 Mon Sep 17 00:00:00 2001
From: Marius <24592972+gilbN@users.noreply.github.com>
Date: Sat, 10 Jul 2021 15:21:33 +0200
Subject: [PATCH] ombi uses new var files

---
 CSS/themes/ombi/aquamarine.css    | 20 +-------------------
 CSS/themes/ombi/dark.css          | 20 +-------------------
 CSS/themes/ombi/dracula.css       | 21 +--------------------
 CSS/themes/ombi/hotline.css       | 20 +-------------------
 CSS/themes/ombi/ombi-base.css     | 30 +++++++++++++++++++++---------
 CSS/themes/ombi/organizr-dark.css | 20 +-------------------
 CSS/themes/ombi/space-gray.css    | 20 +-------------------
 7 files changed, 27 insertions(+), 124 deletions(-)

diff --git a/CSS/themes/ombi/aquamarine.css b/CSS/themes/ombi/aquamarine.css
index 10df907f..dbc6b44e 100644
--- a/CSS/themes/ombi/aquamarine.css
+++ b/CSS/themes/ombi/aquamarine.css
@@ -13,22 +13,4 @@
 
 /* OMBI AQUAMARINE THEME */
 @import url(https://theme-park.dev/CSS/themes/ombi/ombi-base.css);
-:root {
-  --main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
-  --modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
-
-  --button-color: #009688;
-  --button-color-hover: #12afa0;
-  --button-text: #eee;
-  --button-text-hover: #FFF;
-
-  --accent-color:  0, 150, 136;
-  --accent-color-hover: #12afa0;
-  --queue-color: #009688;
-  --link-color: #0ed2bf;
-  --link-color-hover: #fff;
-
-  --text:#eee;
-  --text-hover: #fff;
-  --text-muted: #999;
-}
+@import url(https://theme-park.dev/CSS/variables/aquamarine.css);
\ No newline at end of file
diff --git a/CSS/themes/ombi/dark.css b/CSS/themes/ombi/dark.css
index edfd8f1a..ae32fd6c 100644
--- a/CSS/themes/ombi/dark.css
+++ b/CSS/themes/ombi/dark.css
@@ -13,22 +13,4 @@
 
 /* OMBI DARK THEME */
 @import url(https://theme-park.dev/CSS/themes/ombi/ombi-base.css);
-:root {
-  --main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
-  --modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
-  
-  --button-color: hsla(0,0%,100%,.15);
-  --button-color-hover: rgb(82, 82, 82);
-  --button-text: #eee;
-  --button-text-hover: #FFF;
-
-  --accent-color:  100, 100, 100;
-  --accent-color-hover: #ffffff73;
-  --queue-color: #6b5;
-  --link-color: #ddd;
-  --link-color-hover: #fff;
-    
-  --text:#eee;
-  --text-hover: #fff;
-  --text-muted: #999;
-  }
+@import url(https://theme-park.dev/CSS/variables/dark.css);
diff --git a/CSS/themes/ombi/dracula.css b/CSS/themes/ombi/dracula.css
index 7d2efd07..04db4c0f 100644
--- a/CSS/themes/ombi/dracula.css
+++ b/CSS/themes/ombi/dracula.css
@@ -13,23 +13,4 @@
 
 /* OMBI DRACULA THEME */
 @import url(https://theme-park.dev/CSS/themes/ombi/ombi-base.css);
-:root {
-  --main-bg-color: #282a36;
-  --modal-bg-color: #282a36;
-
-  --button-color: #bd93f9;
-  --button-color-hover: #ff79c6;
-  --button-text: #eee;
-  --button-text-hover: #FFF;
-
-  --accent-color:  80, 250, 123;
-  --accent-color-hover: #50fa7b;
-  --queue-color: #50fa7b;
-  --link-color: #ff79c6;
-  --link-color-hover: #8be9fd;
-  --label-text-color: #282a36;
-    
-  --text:#6272a4;
-  --text-hover: #95adfa;
-  --text-muted: #999;
-}
+@import url(https://theme-park.dev/CSS/variables/dracula.css);
diff --git a/CSS/themes/ombi/hotline.css b/CSS/themes/ombi/hotline.css
index 24245729..0298e7e3 100644
--- a/CSS/themes/ombi/hotline.css
+++ b/CSS/themes/ombi/hotline.css
@@ -13,22 +13,4 @@
 
 /* OMBI HOTLINE THEME */
 @import url(https://theme-park.dev/CSS/themes/ombi/ombi-base.css);
-:root {
-  --main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
-  --modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
-  
-  --button-color: hsla(0,0%,100%,.15);
-  --button-color-hover: hsla(0,0%,100%,.30);
-  --button-text: #eee;
-  --button-text-hover: #FFF;
-  
-  --accent-color:  244, 67, 54;
-  --accent-color-hover: #0b3161;
-  --queue-color: #6b5;
-  --link-color: #ddd;
-  --link-color-hover: #fff;
-    
-  --text:#eee;
-  --text-hover: #fff;
-  --text-muted: #999;
-}
\ No newline at end of file
+@import url(https://theme-park.dev/CSS/variables/hotline.css);
\ No newline at end of file
diff --git a/CSS/themes/ombi/ombi-base.css b/CSS/themes/ombi/ombi-base.css
index 46973db3..9746b0a0 100644
--- a/CSS/themes/ombi/ombi-base.css
+++ b/CSS/themes/ombi/ombi-base.css
@@ -58,7 +58,7 @@ a:hover {
 /* Drop down menu */
 .mat-menu-panel,
 #requestsToDisplayDropdown-panel {
-    background: var(--modal-bg-color);
+    background: var(--drop-down-menu-bg);
 }
 
 .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
@@ -109,20 +109,23 @@ a:hover {
 }
 
 .sidenav-container[_ngcontent-icv-c127] .sidenav[_ngcontent-icv-c127] .active-list-item[_ngcontent-icv-c127] {
-    color: var(--text-hover) !important;
+    color: rgb(var(--accent-color)) !important;
 }
 
-.sidenav-container .sidenav .active-list-item {
-    color: var(--text-hover);
+.sidenav-container .sidenav .active-list-item,
+.sidenav-container .sidenav .active-list-item:hover {
+    color: rgb(var(--accent-color)) !important;
     background: rgb(255 255 255 / 15%) !important;
     border-radius: .375rem !important;
     padding: 10px 20px;
     height: auto;
     width: 16rem !important;
 }
+[id*="nav-"] {
+    color: var(--text) !important;
+}
 
 .sidenav-container .sidenav .mat-list-item {
-    color: var(--text) !important;
     font-family: Roboto, sans-serif;
     font-size: 16px;
     font-weight: 400;
@@ -152,11 +155,20 @@ a:hover {
 }
 
 .sidenav-container .sidenav.mat-action-list .mat-list-item:focus,
-.sidenav-container .sidenav .mat-action-list .mat-list-item:hover,
 .sidenav-container .sidenav.mat-list-option:focus,
-.mat-list-option:hover,
 .sidenav-container .sidenav .mat-nav-list .mat-list-item:focus,
-.sidenav-container .sidenav .mat-nav-list .mat-list-item:hover {
+.sidenav-container .sidenav.mat-action-list .mat-list-item:focus:hover,
+.sidenav-container .sidenav.mat-list-option:focus:hover,
+.sidenav-container .sidenav .mat-nav-list .mat-list-item:focus:hover {
+    background: hsla(0, 0%, 100%, .04);
+    border-radius: .375rem !important;
+    color: rgb(var(--accent-color)) !important;
+}
+
+
+.sidenav-container .sidenav .mat-action-list .mat-list-item:hover:not(.active-list-item),
+.mat-list-option:hover:not(.active-list-item),
+.sidenav-container .sidenav .mat-nav-list .mat-list-item:hover:not(.active-list-item) {
     background: hsla(0, 0%, 100%, .04);
     border-radius: .375rem !important;
     color: var(--text-hover) !important;
@@ -578,7 +590,7 @@ hr {
 
 /* OTHER */
 .mat-tooltip {
-    background: var(--modal-bg-color) !important;
+    background: var(--drop-down-menu-bg) !important;
 }
 
 .mat-progress-spinner.mat-accent circle,.mat-spinner.mat-accent circle {
diff --git a/CSS/themes/ombi/organizr-dark.css b/CSS/themes/ombi/organizr-dark.css
index ddb0cf9a..c97b56a3 100644
--- a/CSS/themes/ombi/organizr-dark.css
+++ b/CSS/themes/ombi/organizr-dark.css
@@ -13,22 +13,4 @@
 
 /* OMBI ORGANIZR-DARK THEME */
 @import url(https://theme-park.dev/CSS/themes/ombi/ombi-base.css);
-:root {
-  --main-bg-color: #1f1f1f;
-  --modal-bg-color: #1b1b1b;
-  
-  --button-color: #2cabe3;
-  --button-color-hover: rgb(44 171 227 / .8);
-  --button-text: #eee;
-  --button-text-hover: #fff;
-
-  --accent-color:  44, 171, 227;
-  --accent-color-hover: white;
-  --queue-color: #2cabe3;
-  --link-color: #2cabe3;
-  --link-color-hover: #fff;
-    
-  --text:#96a2b4;
-  --text-hover: #fff;
-  --text-muted: #999;
-}
+@import url(https://theme-park.dev/CSS/variables/organizr-dark.css);
diff --git a/CSS/themes/ombi/space-gray.css b/CSS/themes/ombi/space-gray.css
index fc621c63..e852afa3 100644
--- a/CSS/themes/ombi/space-gray.css
+++ b/CSS/themes/ombi/space-gray.css
@@ -13,22 +13,4 @@
 
 /* OMBI SPACE GRAY THEME */
 @import url(https://theme-park.dev/CSS/themes/ombi/ombi-base.css);
-:root {
-  --main-bg-color:  radial-gradient( ellipse at center,  rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
-  --modal-bg-color: radial-gradient( ellipse at top,  rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
-  
-  --button-color: #607D8B;
-  --button-color-hover: #81a6b7;
-  --button-text: #eee;
-  --button-text-hover: #fff;
-  
-  --accent-color: 129, 166, 183;
-  --accent-color-hover: #607D8B;
-  --queue-color: #81a6b7;
-  --link-color: #81a6b7;
-  --link-color-hover: #fff;
-    
-  --text:#eee;
-  --text-hover: #fff;
-  --text-muted: #999;
-}
+@import url(https://theme-park.dev/CSS/variables/space-gray.css);