Hi,
Let me share my dark mode.
See post #3 for howTO.
CSS
.login-page {
background-color: #101010;
/* background: url("/images/image.jpg") no-repeat center center fixed;
background-size: cover;*/
}
.x-fieldset{
background-color:transparent !important;
}
.x-fieldset-header-default>.x-fieldset-header-text{
color:#fff !important;
}
.x-toolbar-default,.x-panel-body-default{
background-color:#3B3B3B !important;
border:none !important;
}
.x-tab.x-tab-active.x-tab-default{
color:#8b0000 !important;
background-color:#d9d9d9 !important;
border-color:#d9d9d9;
font-weight:700;
}
.x-grid-item-focused .x-grid-cell-inner:before{
background-color:#d9d9d9 !important;
color:transparent !important;
border:none !important;
}
.x-tab-inner-default {
background-color:#d9d9d9 !important;
color:#000 !important;
}
.x-window-header-default .x-tool-img{
background-color:transparent !important;
}
div#header{
background-color:#222 !important;
border:none !important;
}
.x-panel-header-default{
background-color:#b3b3b3!important;
border:none !important;
}
.x-panel-header-title-default{
color:#000;
}
.x-panel-default{
background-color:red !important;
border:none !important;
}
.x-form-text-default {
background-color:#222 !important;
color:#fff !important;
}
.x-panel-header-default .x-tool-tool-el{
background-color:#373743 !important;
border:none !important;
}
.x-workspace-node-tree .x-panel-header-default{
background-color:#ececec !important;
color:#fff !important;
}
.x-workspace-node-tree .x-panel-header-default::before{
content:"OpenMediVault";
color:#000;
position:absolute;
font-weight:900;
}
.x-window-header-default-top,.x-toolbar-footer{
background-color:#222 !important;
border:none !important;
}
.x-workspace-node-view-category-header .thumb-wrap{
background-color:#8e8e8e !important;
}
.x-form-item-label-default{
color:#fff !important;
border:none !important;
}
.x-btn-default-small{
background-color:#696969 !important;
border:none !important;
}
.x-btn-inner-default-small:hover{
opacity:0.6;
font: 400 20px/16px 'Open Sans', 'Helvetica Neue', helvetica, arial, verdana, sans-serif !important;
}
.x-item-over,.x-column-header-over{
color:#000;
}
.x-grid-body{
background-color:;
}
.x-toolbar-text-default{
color: #fff;
}
.x-column-header,.x-grid-header-ct{
background-color:#454545 !important;
color:#fff;
}
.x-grid-item,.x-tab-bar-default {
background-color: #575757;
color: #fff;
border-bottom:1px solid #444444;
}
.x-grid-item-focused{
color:#000 !important;
font-weight:600;
}
.x-panel-body-default,.x-form-fieldinfo{
color:#fff;
}
body>.x-mask {
background-color: rgba(0,0,0,0.9);
}
.x-window-default {
border-color: #444444;
border-width: 10px;
}
/* Uncomment the following section if you would like to hide the logo */
/*
#header {
display: none;
}
*/
Alles anzeigen