Optimized darktheme color scheme

def.go

@@ -43,7 +43,7 @@ const (
 	/* Build Constants */
 	SYSTEM_NAME       = "Zoraxy"
 	SYSTEM_VERSION    = "3.1.7"
-	DEVELOPMENT_BUILD = false /* Development: Set to false to use embedded web fs */
+	DEVELOPMENT_BUILD = true /* Development: Set to false to use embedded web fs */
 
 	/* System Constants */
 	TMP_FOLDER                 = "./tmp"

web/darktheme.css

@@ -23,6 +23,9 @@ body:not(.darkTheme){
     --text_color_inverted: #fcfcfc;
     --button_text_color: #878787;
     --button_border_color: #dedede;
+    --buttom_toggle_active: #01dc64;
+    --buttom_toggle_disabled: #f2f2f2;
+    --table_bg_default: transparent;
 
     --theme_background: linear-gradient(60deg, rgb(84, 58, 183) 0%, rgb(0, 172, 193) 100%);
     --theme_background_inverted: linear-gradient(215deg, rgba(38,60,71,1) 13%, rgba(2,3,42,1) 84%);
@@ -31,10 +34,10 @@ body:not(.darkTheme){
 }
 
 body.darkTheme{
-    --theme_bg: #0a090e;
-    --theme_bg_primary: #060912;
-    --theme_bg_secondary:#172a41;
-    --theme_highlight: #4380b0;
+    --theme_bg: #1e1e1e;
+    --theme_bg_primary: #151517;
+    --theme_bg_secondary:#1b3572;
+    --theme_highlight: #6a7792;
     --theme_bg_active: #020101;
     --theme_bg_inverted: #f8f8f9;
     --theme_advance: #000000;
@@ -47,8 +50,11 @@ body.darkTheme{
     --text_color_inverted: #414141;
     --button_text_color: #e9e9e9;
     --button_border_color: #646464;
+    --buttom_toggle_active: #01dc64;
+    --buttom_toggle_disabled: #2b2b2b;
+    --table_bg_default: #121214;
 
-    --theme_background: linear-gradient(214deg, rgba(3,1,70,1) 17%, rgb(1, 55, 80) 78%);
+    --theme_background: linear-gradient(23deg, rgba(2,74,106,1) 17%, rgba(46,12,136,1) 86%);
     --theme_background_inverted: linear-gradient(215deg, rgba(38,60,71,1) 13%, rgba(2,3,42,1) 84%);
     --theme_green: linear-gradient(214deg, rgba(25,128,94,1) 17%, rgba(62,76,111,1) 78%);
     --theme_red: linear-gradient(203deg, rgba(250,172,38,1) 17%, rgba(202,0,37,1) 78%);
@@ -195,10 +201,10 @@ body.darkTheme textarea:focus {
 }
 
 body.darkTheme .ui.toggle.checkbox input ~ label::before{
-    background-color: var(--theme_bg_secondary) !important;
+    background-color: var(--buttom_toggle_disabled) !important;
 }
 body.darkTheme .ui.toggle.checkbox input:checked ~ label::before{
-    background-color: var(--theme_highlight) !important;
+    background-color: var(--buttom_toggle_active) !important;
 }
 
 #sidemenuBtn{
@@ -444,7 +450,7 @@ body.darkTheme .ui.table{
 body.darkTheme .ui.celled.sortable.unstackable.compact.table thead th,
 body.darkTheme .ui.celled.sortable.unstackable.compact.table tbody td,
 body.darkTheme .ui.celled.sortable.unstackable.compact.table tfoot td {
-    background-color: var(--theme_bg) !important;
+    background-color: var(--table_bg_default) !important;
     color: var(--text_color) !important;
     border-color: var(--divider_color) !important;
 }
@@ -476,11 +482,11 @@ body.darkTheme .ui.celled.sortable.unstackable.compact.table tbody td .ui.toggle
 }
 
 body.darkTheme .ui.celled.sortable.unstackable.compact.table tbody td .ui.toggle.checkbox input ~ label::before {
-    background-color: var(--theme_bg_secondary) !important;
+    background-color: var(--buttom_toggle_disabled) !important;
 }
 
 body.darkTheme .ui.celled.sortable.unstackable.compact.table tbody td .ui.toggle.checkbox input:checked ~ label::before {
-    background-color: var(--theme_highlight) !important;
+    background-color: var(--buttom_toggle_active) !important;
 }
 
 body.darkTheme .ui.celled.sortable.unstackable.compact.table tbody td .ui.circular.mini.basic.icon.button {
@@ -714,7 +720,7 @@ body.darkTheme #redirectset .ui.sortable.unstackable.celled.table thead th {
 }
 
 body.darkTheme #redirectset .ui.sortable.unstackable.celled.table tbody tr td {
-    background-color: var(--theme_bg) !important;
+    background-color: var(--table_bg_default) !important;
     color: var(--text_color) !important;
     border-color: var(--divider_color) !important;
 }
@@ -833,7 +839,7 @@ body.darkTheme #access .ui.unstackable.basic.celled.table thead th {
 }
 
 body.darkTheme #access .ui.unstackable.basic.celled.table tbody tr td {
-    background-color: var(--theme_bg) !important;
+    background-color: var(--table_bg_default) !important;
     color: var(--text_color) !important;
     border-color: var(--divider_color) !important;
 }
@@ -1116,7 +1122,7 @@ body.darkTheme .statistic .label {
 /* Other Tables */
 
 body.darkTheme .ui.celled.compact.table {
-    background-color: var(--theme_bg) !important;
+    background-color: var(--table_bg_default) !important;
     color: var(--text_color) !important;
     border-color: var(--divider_color) !important;
 }

web/snippet/upstreams.html

@@ -36,6 +36,10 @@
                 overflow-y: auto;
             }
 
+            body.darkTheme #upstreamTable{
+	            border: 1px solid var(--button_border_color);
+            }
+
             .upstreamEntry.inactive{
                 background-color: #f3f3f3 !important;
             }