Update Proxmox Theme

This commit is contained in:
Mars Niermann 2023-12-01 09:24:03 +01:00
parent b8dc6b8ada
commit 0a20a21b95

View file

@ -1,43 +1,53 @@
/* ==UserStyle== /* ==UserStyle==
@name Gruvbox for Proxmox @name Gruvbox for Proxmox
@namespace git.m3.fyi/Marsn3 @namespace git.m3.fyi/Marsn3
@version 1.0.5 @version 1.0.6
@description Gruvbox Theme for Proxmox @description Gruvbox Theme for Proxmox
@author Marsn3 @author Marsn3
@homepageURL https://git.m3.fyi/Marsn3/userstyles @homepageURL https://git.m3.fyi/Marsn3/userstyles
@updateURL https://git.m3.fyi/Marsn3/userstyles/raw/branch/main/src/proxmox.user.css @updateURL https://git.m3.fyi/Marsn3/userstyles/raw/branch/main/src/proxmox.user.css
@license MIT @license MIT
==/UserStyle== */ ==/UserStyle== */
@-moz-document domain("pve.m3.fyi"),domain("pve.mniermann.de") { @-moz-document domain("pve.m3.fyi"), domain("pve.mniermann.de") {
.x-progress.critical .x-progress-bar, .x-progress.critical .x-progress-bar,
.proxmox-invalid-row { .proxmox-invalid-row {
background-color: var(--red); background-color: var(--red);
} }
#proxmoxlogo-1018-img { #proxmoxlogo-1018-img {
filter: invert(100%) sepia(100%); filter: invert(100%) sepia(100%);
} }
.critical { .critical {
color: var(--red); color: var(--red);
} }
.warning { .warning {
color: var(--yellow); color: var(--yellow);
} }
.good { .good {
color: var(--green); color: var(--green);
} }
.x-progress.warning .x-progress-bar { .x-progress.warning .x-progress-bar {
background-color: var(--yellow); background-color: var(--yellow);
} }
.x-progress-default .x-progress-bar-default { .x-progress-default .x-progress-bar-default {
background-color: var(--green); background-color: var(--green);
} }
.x-progress-default { .x-progress-default {
background-color: var(--fg4); background-color: var(--fg4);
border: none; border: none;
} }
.x-mask { .x-mask {
background-color: rgb(var(--rgb-bg4) / 70%) !important; background-color: rgb(var(--rgb-bg4) / 70%) !important;
} }
.x-tab-icon-el-default, .x-tab-icon-el-default,
.x-column-header, .x-column-header,
.x-tab.x-tab-disabled.x-tab-default .x-tab-icon-el, .x-tab.x-tab-disabled.x-tab-default .x-tab-icon-el,
@ -55,27 +65,33 @@
.x-body, .x-body,
.x-menu-item-text-default, .x-menu-item-text-default,
.x-treelist-item-expander, .x-treelist-item-expander,
.x-treelist-row-over > * > .x-treelist-item-icon, .x-treelist-row-over>*>.x-treelist-item-icon,
.x-treelist-row-over > * > .x-treelist-item-text { .x-treelist-row-over>*>.x-treelist-item-text {
color: var(--fg); color: var(--fg);
} }
#userinfo { #userinfo {
background-color: var(--bg4) !important; background-color: var(--bg4) !important;
border-color: var(--fg) !important; border-color: var(--fg) !important;
} }
.x-grid-with-row-lines .x-grid-item-selected + .x-grid-item {
.x-grid-with-row-lines .x-grid-item-selected+.x-grid-item {
border-top-color: var(--fg2); border-top-color: var(--fg2);
} }
.x-btn-wrap-default-toolbar-small.x-btn-split-right:after, .x-btn-wrap-default-toolbar-small.x-btn-split-right:after,
.x-btn-wrap-default-toolbar-small.x-btn-arrow-right:after { .x-btn-wrap-default-toolbar-small.x-btn-arrow-right:after {
filter: var(--filter-reset) var(--filter-bg); filter: var(--filter-reset) var(--filter-bg);
} }
.x-treelist-pve-nav, .x-treelist-pve-nav,
.x-treelist-item,
.x-grid-item { .x-grid-item {
background-color: var(--bg3); background-color: var(--bg3);
color: var(--fg); color: var(--fg);
} }
.x-treelist-item-selected > .x-treelist-row,
.x-treelist-item-selected>.x-treelist-row,
.x-grid-item-selected, .x-grid-item-selected,
.x-menu-item-default.x-menu-item-focus, .x-menu-item-default.x-menu-item-focus,
.x-menu-item-default.x-menu-item-active, .x-menu-item-default.x-menu-item-active,
@ -83,7 +99,7 @@
.x-column-header-over, .x-column-header-over,
.x-keyboard-mode .x-btn-focus.x-btn-default-toolbar-small, .x-keyboard-mode .x-btn-focus.x-btn-default-toolbar-small,
.x-keyboard-mode .x-btn-focus.x-btn-pressed.x-btn-default-toolbar-small, .x-keyboard-mode .x-btn-focus.x-btn-pressed.x-btn-default-toolbar-small,
.x-treelist-row-over > * > .x-treelist-item-expander, .x-treelist-row-over>*>.x-treelist-item-expander,
.x-keyboard-mode .x-btn-focus.x-btn-over.x-btn-default-toolbar-small, .x-keyboard-mode .x-btn-focus.x-btn-over.x-btn-default-toolbar-small,
.x-btn-over.x-btn-over.x-btn-default-toolbar-small, .x-btn-over.x-btn-over.x-btn-default-toolbar-small,
#noVNC_modifiers { #noVNC_modifiers {
@ -92,40 +108,50 @@
background-color: var(--fg4); background-color: var(--fg4);
color: var(--fg); color: var(--fg);
} }
.x-keyboard-mode .x-grid-item-focused, .x-keyboard-mode .x-grid-item-focused,
.x-keyboard-mode .x-column-header.x-column-header-focus { .x-keyboard-mode .x-column-header.x-column-header-focus {
color: var(--fg2); color: var(--fg2);
} }
.x-grid-with-row-lines .x-grid-item { .x-grid-with-row-lines .x-grid-item {
border-color: var(--fg4); border-color: var(--fg4);
} }
.x-tree-icon-custom.stopped, .x-tree-icon-custom.stopped,
.x-grid-icon-custom.stopped, .x-grid-icon-custom.stopped,
.x-tree-icon-custom.offline, .x-tree-icon-custom.offline,
.x-grid-icon-custom.offline { .x-grid-icon-custom.offline {
color: var(--fg3); color: var(--fg3);
} }
.x-tree-icon-custom.running { .x-tree-icon-custom.running {
color: var(--bg); color: var(--bg);
} }
.noVNC_panel, .noVNC_panel,
.noVNC_panel .noVNC_heading { .noVNC_panel .noVNC_heading {
background: var(--bg); background: var(--bg);
color: var(--fg); color: var(--fg);
} }
.usage-wrapper { .usage-wrapper {
border: 1px solid var(--bg1); border: 1px solid var(--bg1);
} }
.usage { .usage {
background-color: var(--bg1); background-color: var(--bg1);
} }
.x-tree-icon-custom { .x-tree-icon-custom {
color: var(--bg1); color: var(--bg1);
} }
.x-toolbar-default .x-toolbar-separator-horizontal { .x-toolbar-default .x-toolbar-separator-horizontal {
border-left-color: var(--fg4); border-left-color: var(--fg4);
border-right-color: var(--fg); border-right-color: var(--fg);
} }
.fa-ceph:before, .fa-ceph:before,
.x-tree-arrows .x-tree-expander, .x-tree-arrows .x-tree-expander,
.x-grid-row-console, .x-grid-row-console,
@ -136,10 +162,12 @@
.noVNC_button { .noVNC_button {
filter: var(--filter-reset) var(--filter-fg); filter: var(--filter-reset) var(--filter-fg);
} }
.x-btn-default-toolbar-small { .x-btn-default-toolbar-small {
border-color: var(--fg4); border-color: var(--fg4);
background-color: var(--fg3); background-color: var(--fg3);
} }
.x-btn.x-btn-disabled.x-btn-default-toolbar-small { .x-btn.x-btn-disabled.x-btn-default-toolbar-small {
background-color: var(--fg3); background-color: var(--fg3);
} }
@ -153,6 +181,7 @@
text-shadow: none; text-shadow: none;
color: var(--green); color: var(--green);
} }
.x-boundlist, .x-boundlist,
.x-mask-msg, .x-mask-msg,
#noVNC_control_bar, #noVNC_control_bar,
@ -161,13 +190,16 @@
background: var(--bg); background: var(--bg);
border-color: var(--bg4); border-color: var(--bg4);
} }
.x-form-item-label-default { .x-form-item-label-default {
color: var(--fg3); color: var(--fg3);
} }
.x-tab.x-tab-disabled.x-tab-default { .x-tab.x-tab-disabled.x-tab-default {
border-color: var(--bg4); border-color: var(--bg4);
background-color: var(--bg2); background-color: var(--bg2);
} }
.x-form-invalid-field-default, .x-form-invalid-field-default,
.x-form-text-default, .x-form-text-default,
.x-tab-bar-default, .x-tab-bar-default,
@ -175,65 +207,80 @@
background-color: var(--bg3); background-color: var(--bg3);
color: var(--fg); color: var(--fg);
} }
.x-form-trigger-wrap-default.x-form-trigger-wrap-focus, .x-form-trigger-wrap-default.x-form-trigger-wrap-focus,
.x-tool-tool-el { .x-tool-tool-el {
border-color: var(--green); border-color: var(--green);
} }
.x-column-header { .x-column-header {
border-right: 1px solid var(--bg3); border-right: 1px solid var(--bg3);
} }
.x-panel-header-default, .x-panel-header-default,
.x-column-header, .x-column-header,
.x-grid-header-ct { .x-grid-header-ct {
background-color: var(--bg2); background-color: var(--bg2);
border-color: var(--bg4); border-color: var(--bg4);
} }
.x-grid-header-ct { .x-grid-header-ct {
border: 1px solid var(--bg4); border: 1px solid var(--bg4);
} }
.x-column-header-trigger, .x-column-header-trigger,
.x-menu-icon-separator-default { .x-menu-icon-separator-default {
background-color: var(--bg2); background-color: var(--bg2);
border-left: 1px solid var(--bg4); border-left: 1px solid var(--bg4);
} }
.x-window-header-default .x-tool-img, .x-window-header-default .x-tool-img,
.x-panel-header-default .x-tool-tool-el { .x-panel-header-default .x-tool-tool-el {
background-color: var(--bg2); background-color: var(--bg2);
} }
body.x-border-layout-ct, body.x-border-layout-ct,
div.x-border-layout-ct { div.x-border-layout-ct {
background-color: var(--bg1); background-color: var(--bg1);
} }
.x-form-trigger-wrap-default.x-form-trigger-wrap-invalid { .x-form-trigger-wrap-default.x-form-trigger-wrap-invalid {
border-color: var(--red); border-color: var(--red);
} }
.x-splitter-collapsed .x-layout-split-bottom, .x-splitter-collapsed .x-layout-split-bottom,
.x-layout-split-bottom, .x-layout-split-bottom,
.x-column-header-sort-DESC .x-column-header-text-inner { .x-column-header-sort-DESC .x-column-header-text-inner {
filter: var(--filter-reset) var(--filter-fg2); filter: var(--filter-reset) var(--filter-fg2);
} }
.x-toolbar-default { .x-toolbar-default {
background-color: var(--bg2); background-color: var(--bg2);
border-color: var(--bg4); border-color: var(--bg4);
} }
.x-btn-over.x-btn-default-small { .x-btn-over.x-btn-default-small {
background-color: var(--green-dim); background-color: var(--green-dim);
border-color: var(--green-dim); border-color: var(--green-dim);
} }
.x-btn-default-small, .x-btn-default-small,
.x-tab.x-tab-active.x-tab-default, .x-tab.x-tab-active.x-tab-default,
.x-btn.x-btn-disabled.x-btn-default-small { .x-btn.x-btn-disabled.x-btn-default-small {
background-color: var(--green); background-color: var(--green);
border-color: var(--green); border-color: var(--green);
} }
.x-body { .x-body {
color: var(--fg); color: var(--fg);
background: var(--bg); background: var(--bg);
} }
.x-window-default { .x-window-default {
border-color: var(--bg4); border-color: var(--bg4);
background-color: var(--bg4); background-color: var(--bg4);
} }
.x-window-header-default, .x-window-header-default,
.x-panel-default, .x-panel-default,
.x-form-trigger-wrap-default, .x-form-trigger-wrap-default,
@ -241,14 +288,17 @@
.x-grid-with-col-lines .x-grid-item-selected .x-grid-cell { .x-grid-with-col-lines .x-grid-item-selected .x-grid-cell {
border-color: var(--bg4); border-color: var(--bg4);
} }
.x-form-trigger-default { .x-form-trigger-default {
background-color: var(--bg1); background-color: var(--bg1);
} }
.x-window-header-default-top, .x-window-header-default-top,
.x-toolbar-footer, .x-toolbar-footer,
.x-tab-default-top { .x-tab-default-top {
background-color: var(--bg2); background-color: var(--bg2);
} }
.x-tip-form-invalid { .x-tip-form-invalid {
background-color: var(--bg3); background-color: var(--bg3);
border: var(--bg4); border: var(--bg4);
@ -261,6 +311,7 @@
background: var(--bg); background: var(--bg);
color: var(--fg); color: var(--fg);
} }
.x-form-text-default::placeholder { .x-form-text-default::placeholder {
color: var(--fg3); color: var(--fg3);
} }
@ -275,15 +326,18 @@
border-color: var(--green-dim); border-color: var(--green-dim);
box-shadow: none; box-shadow: none;
} }
.x-boundlist-item-over, .x-boundlist-item-over,
.x-boundlist-selected, .x-boundlist-selected,
.x-tab-over.x-tab-default { .x-tab-over.x-tab-default {
background: var(--green); background: var(--green);
border-color: var(--green); border-color: var(--green);
} }
.x-legend-horizontal .x-legend-item { .x-legend-horizontal .x-legend-item {
border-color: var(--fg4) !important; border-color: var(--fg4) !important;
} }
.x-boundlist-item, .x-boundlist-item,
.x-legend-container, .x-legend-container,
.x-legend { .x-legend {
@ -292,4 +346,4 @@
box-shadow: none; box-shadow: none;
border-color: var(--bg4); border-color: var(--bg4);
} }
} }