131 lines
11 KiB
CSS
131 lines
11 KiB
CSS
/* #region OS */
|
|
#desktop { background:var(--theme-desktop-backcolor); background-image:var(--theme-desktop-image); }
|
|
#taskbar { background:var(--theme-taskbar-backcolor); color:var(--theme-taskbar-color); }
|
|
#tutorial-tooltip {background:var(--theme-window-backcolor); color:var(--theme-window-color);}
|
|
#tutorial-tooltip img {filter: invert(1);}
|
|
|
|
#start-btn { background:var(--theme-accent-default-backcolor); color:var(--theme-accent-default-color); }
|
|
#start-btn:hover { background:var(--theme-accent-hover-backcolor); color:var(--theme-accent-hover-color); }
|
|
#start-btn:active { background:var(--theme-accent-active-backcolor); color:var(--theme-accent-active-color); }
|
|
|
|
/* #start-menu, .submenu { background:var(--theme-taskbar-backcolor); color:var(--theme-taskbar-color); } */
|
|
#start-menu { padding-bottom:10px; background:var(--theme-startmenu-backcolor); color:var(--theme-startmenu-color); border:3px solid rgb(128,128,128); }
|
|
.start-submenu-head { background:var(--theme-startmenu-submenu-header-backcolor); color:var(--theme-startmenu-submenu-header-backcolor) }
|
|
.start-icon { background:var(--theme-accent-default-backcolor); }
|
|
|
|
/* .start-item:hover, .start-sys-item:hover { color:var(--theme-accent-hover-color); background:var(--theme-accent-hover-backcolor); } */
|
|
.start-item.has-submenu.open > .menu-label , .start-item:not(.has-submenu.open), .start-sys-item { background-color:var(--theme-startmenu-item-default-backcolor); color:var(--theme-startmenu-item-default-color); }
|
|
.start-item:not(.has-submenu.open):not(.unload):hover, .start-sys-item:hover { background-color:var(--theme-startmenu-item-hover-backcolor); color:var(--theme-startmenu-item-hover-color); }
|
|
.start-item:not(.has-submenu):not(.has-submenu.open):not(.unload):active, .start-sys-item:active { color:var(--theme-accent-active-color); background:var(--theme-accent-active-backcolor); }
|
|
.start-item-sys-container { background:var(--theme-startmenu-syscontainer-backcolor);}
|
|
.start-item .unload { background:var(--theme-startmenu-item-disabled-backcolor); color:var(--theme-startmenu-item-disabled-color); }
|
|
/* #taskbar .taskbar-item { background:var(--theme-taskbar-item-backcolor); } */
|
|
|
|
.taskbar-item { position: relative;}
|
|
.taskbar-item::before { background: var(--theme-accent-active-color); }
|
|
.taskbar-item.focus::before { background: var(--theme-accent-active-backcolor); }
|
|
/* .taskbar-item.minimized { background:var(--theme-taskbar-item-minimized-backcolor); color:var(--theme-taskbar-item-minimized-color); border-color:var(--theme-taskbar-item-minimized-border-color);} */
|
|
.taskbar-item.default { background:var(--theme-taskbar-item-default-backcolor); color:var(--theme-taskbar-item-default-color); border-color:var(--theme-taskbar-item-default-border-color);}
|
|
.taskbar-item:hover { background-color:var(--theme-startmenu-item-hover-backcolor); color:var(--theme-startmenu-item-hover-color); }
|
|
|
|
.window { border:2px solid var(--theme-window-titlebar-backcolor); background:var(--theme-window-backcolor); }
|
|
.window-content { color:var(--theme-window-color); background:var(--theme-window-backcolor); }
|
|
.window-titlebar { color:var(--theme-window-titlebar-color); background:var(--theme-window-titlebar-backcolor); }
|
|
.window .controls button { color:var(--theme-window-titlebar-color); background:transparent; }
|
|
.window .controls button:hover { color:var(--theme-accent-hover-color); background:var(--theme-accent-hover-backcolor); }
|
|
/* #endregion */
|
|
|
|
|
|
/* #region Table */
|
|
table, tr, td, th { border-color:var(--theme-table-border-color); }
|
|
table thead th { background-color:var(--theme-table-header-backcolor); color:var(--theme-table-header-color); border-color:var(--theme-table-border-color); }
|
|
table tbody tr:nth-child(even) { background-color:var(--theme-table-rows-even-backcolor); color:var(--theme-table-rows-even-color); }
|
|
table tbody tr:nth-child(odd) { background-color:var(--theme-table-rows-odd-backcolor); color:var(--theme-table-rows-odd-color); }
|
|
table tbody tr:not(.grouprow):not(.no-hover):hover { color:var(--theme-accent-hover-color); background:var(--theme-accent-hover-backcolor); }
|
|
table tbody tr.grouprow { background-color:var(--theme-table-rows-grouprow-backcolor); color:var(--theme-table-rows-grouprow-color); }
|
|
table tbody tr.active, table tbody td.active { color:var(--theme-accent-active-color); background:var(--theme-accent-active-backcolor); }
|
|
.table-filter-container { border-color:var(--theme-table-border-color); background-color:var(--theme-table-header-backcolor); color:var(--theme-table-header-color); }
|
|
/* #endregion */
|
|
|
|
|
|
/* #region Scrollbar */
|
|
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background:var(--theme-scrollbar-backcolor); }
|
|
::-webkit-scrollbar-thumb { background-color:var(--theme-scrollbar-thumb-default-backcolor); border-color:var(--theme-scrollbar-thumb-default-border-color); }
|
|
::-webkit-scrollbar-thumb:hover { background-color:var(--theme-scrollbar-thumb-hover-backcolor); border-color:var(--theme-scrollbar-thumb-hover-border-color); }
|
|
/* #endregion */
|
|
|
|
|
|
/* #region Tooltip */
|
|
.global-tooltip { background:var(--theme-tooltip-backcolor); color:var(--theme-tooltip-color); border-color:var(--theme-tooltip-border-color) }
|
|
/* #endregion */
|
|
|
|
/* #region feedbox */
|
|
.feedbox { background:var(--theme-feedbox-backcolor); color:var(--theme-feedbox-color);box-shadow:0 5px 25px rgba(0,0,0,0.3); }
|
|
.feedbox-overlay { background:rgba(0,0,0,0.5); }
|
|
/* #endregion */
|
|
|
|
|
|
/* #region Messagbox */
|
|
.test, .test .countdown { color:var(--theme-message-test-color); background-color:var(--theme-message-test-backcolor); border-color:var(--theme-message-test-border-color); }
|
|
.success, .success .countdown { color:var(--theme-message-success-color); background-color:var(--theme-message-success-backcolor); border-color:var(--theme-message-success-border-color); }
|
|
.error, .error .countdown { color:var(--theme-message-error-color); background:var(--theme-message-error-backcolor); border-color:var(--theme-message-error-border-color); }
|
|
.info, .info .countdown { color:var(--theme-message-info-color); background-color:var(--theme-message-info-backcolor); border-color:var(--theme-message-info-border-color); }
|
|
.warn, .warn .countdown { color:var(--theme-message-warn-color); background-color:var(--theme-message-warn-backcolor); border-color:var(--theme-message-warn-border-color); }
|
|
.throw_exception, .throw_exception .countdown { color:var(--theme-message-throw-color); background-color:var(--theme-message-throw-backcolor); border-color:var(--theme-message-throw-border-color); }
|
|
.message { box-shadow:0 4px 10px rgba(0,0,0,0.3); } /* SHADOW? */
|
|
/* #endregion */
|
|
|
|
.error-field { background:var(--theme-message-error-backcolor); border-color:var(--theme-message-error-border-color); color:var(--theme-message-error-color); }
|
|
.success-field { background:var(--theme-message-success-backcolor); border-color: var(--theme-message-success-border-color); color:var(--theme-message-success-color); }
|
|
|
|
/* region Container*/
|
|
.card { background:var(--theme-container-card-backcolor); border-color:var(--theme-container-card-border); }
|
|
/* #endregion */
|
|
|
|
|
|
/* #region Checkbox */
|
|
.cb-box { border-color:var(--theme-checkbox-default-border-color); box-shadow:0 1px 2px var(--theme-checkbox-shadow-color) inset; }
|
|
.cb input:checked + .cb-box { background:var(--theme-checkbox-default-thumb); border-color:var(--theme-checkbox-default-thumb); }
|
|
.cb input:disabled + .cb-box { background:var(--theme-checkbox-disabled-backcolor); border-color:var(--theme-checkbox-disabled-border-color); }
|
|
.cb-label { color:var(--theme-checkbox-color); }
|
|
/* #endregion */
|
|
|
|
/* #region Switch */
|
|
.cb-switch .cb-label { color:var(--theme-switch-color); }
|
|
.switch-track { background:var(--theme-switch-backcolor); border-color:var(--theme-switch-border-color); }
|
|
/* #endregion */
|
|
|
|
/* #region Required */
|
|
.is-required-empty { border-width:2px; border-color:var(--theme-required-empty); border-style:solid; }
|
|
.is-required-filled { border-color:var(--theme-required-accept); }
|
|
/* #endregion */
|
|
|
|
|
|
/* #region Tabs */
|
|
.tabs { border-bottom-color: #ccc; }
|
|
.tab-content { border-color: #ccc; }
|
|
.tab:hover { background-color: var(--theme-accent-hover-backcolor); color: var(--theme-accent-hover-color); }
|
|
.tab.active { background-color: var(--theme-accent-active-backcolor); color: var(--theme-accent-active-color); border-color: var(--theme-accent-active-border-color); border-bottom-color: var(--theme-accent-active-backcolor); }
|
|
/* #endregion */
|
|
|
|
/* #region DOM */
|
|
button:not(:disabled).monolyth { background-color:var(--theme-button-monolyth-default-backcolor); color:var(--theme-button-monolyth-default-color); }
|
|
button:not(:disabled).monolyth:hover { background-color:var(--theme-button-monolyth-hover-backcolor); color:var(--theme-button-monolyth-hover-color); }
|
|
button:not(:disabled).monolyth:hover, button:not(:disabled).bluebutton:hover, button:not(:disabled).redbutton:hover, button:not(:disabled).yellowbutton:hover, button:not(:disabled).greenbutton:hover { box-shadow:0 6px 8px rgba(0,0,0,0.15); }
|
|
|
|
select { background:var(--theme-select-default-backcolor); color:var(--theme-select-default-color); box-shadow:0 0 5px var(--theme-select-default-border-color); }
|
|
input:hover, input[type="text"]:hover, input[type="email"]:hover, input[type="password"]:hover, input[type="number"]:hover, input[type="date"]:hover,textarea:hover, select:hover { background:var(--theme-input-hover-backcolor); color:var(--theme-input-hover-color); box-shadow:0 0 5px var(--theme-input-hover-border-color); }
|
|
input:focus, input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="date"]:focus, textarea:focus, select:focus { background:var(--theme-input-focus-backcolor); color:var(--theme-input-focus-color); box-shadow:0 0 5px var(--theme-input-focus-border-color); }
|
|
input.valid { border: 2px solid var(--theme-input-accept-border-color); }
|
|
input.invalid { border: 2px solid var(--theme-input-decline-border-color); }
|
|
|
|
*::placeholder, input[id="sAMAccountName"] { color:var(--theme-input-placeholder-color); }
|
|
|
|
textarea, input { border-color:var(--theme-input-default-border-color); background:var(--theme-input-default-backcolor); color:var(--theme-input-default-color); }
|
|
textarea:not([required]):hover, input:not([required]):hover { border-color:var(--theme-input-hover-border-color); background-color:var(--theme-input-hover-backcolor); color:var(--theme-input-hover-color); }
|
|
textarea:focus, input:focus { border-color:var(--theme-input-focus-border-color); background-color:var(--theme-input-focus-backcolor); color:var(--theme-input-focus-color); }
|
|
|
|
select, select option { border-color:var(--theme-select-border-color); background-color:var(--theme-select-backcolor); color:var(--theme-select-color); }
|
|
select:focus, select:not([required]):hover, select:focus option,select:not([required]):hover option { border-color:var(--theme-select-hover-border-color); background-color:var(--theme-select-hover-backcolor); color:var(--theme-select-hover-color); }
|
|
|
|
/* #endregion */ |