Optimized dark theme mode

- Make dark theme mode less dark
This commit is contained in:
Toby Chui 2025-01-15 20:44:20 +08:00
parent 0d4c71d0f6
commit 45f61b3053
4 changed files with 29 additions and 16 deletions

View File

@ -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"

View File

@ -17,5 +17,6 @@ func IsProxmox(r *http.Request) bool {
return true
}
}
return false
}

View File

@ -23,6 +23,10 @@ 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;
--status_dot_bg: #e8e8e8;
--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 +35,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 +51,12 @@ 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;
--status_dot_bg: #232323;
--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 +203,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 +452,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 +484,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 +722,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 +841,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;
}
@ -985,8 +993,8 @@ body.darkTheme #utm .standardContainer {
}
body.darkTheme #utm .standardContainer .padding.statusDot {
background-color: var(--theme_bg) !important;
border: 0.2px solid var(--text_color_inverted) !important;
background-color: var(--status_dot_bg) !important;
}
body.darkTheme .ui.utmloading.segment {
@ -1116,7 +1124,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;
}

View File

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