1
0
mirror of https://github.com/gilbN/theme.park.git synced 2024-11-09 04:32:36 +01:00
theme.park/css/base/dozzle/dozzle-base.css
2023-10-03 20:51:06 +02:00

280 lines
6.8 KiB
CSS

/* dP dP dP */
/* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */
/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */
/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
/* 88 */
/* dP */
/* Made by @gilbN */
/* https://github.com/gilbN/theme.park */
@import url("/css/defaults/placeholders.css");
@import url("/css/defaults/transparent.css");
:root {
--scheme-main-ter: var(--main-bg-color);
--text-strong-color: var(--button-text-hover);
--border-color: var(--transparency-light-25);
--logo-color: rgb(var(--accent-color));
--body-background-color: var(--main-bg-color);
--border-hover-color: rgb(var(--accent-color));
}
* {
outline: none;
}
html,
body {
background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed;
background-position: center center, center center;
background-size: auto, cover;
-webkit-background-size: auto, cover;
-moz-background-size: auto, cover;
-o-background-size: auto, cover;
color: var(--text);
}
h1,
h2,
h3,
h4,
h5,
h6,
section header,
.menu-label {
color: var(--text-hover) !important;
}
/* Scrollbar */
html.has-custom-scrollbars ::-webkit-scrollbar-thumb {
background: var(--transparency-light-25);
outline: 1px solid #0000;
border-radius: 4px;
}
html.has-custom-scrollbars ::-webkit-scrollbar-thumb:active,
html.has-custom-scrollbars ::-webkit-scrollbar-thumb:hover {
background: var(--transparency-light-45);
}
html.has-custom-scrollbars ::-webkit-scrollbar-track {
background: #1f1f1f;
}
html.has-custom-scrollbars ::-webkit-scrollbar-track:hover {
background: #1f1f1f;
}
html.has-custom-scrollbars section main {
scrollbar-color: #353535 transparent;
scrollbar-width: thin
}
/* Text important */
p,
.menu-list a {
color: var(--text) !important;
}
.panel-heading {
background-color: rgb(var(--accent-color));
color: var(--label-text-color) !important;
}
.panel-block {
color: var(--text);
}
.panel-tabs a.is-active {
border-bottom-color: rgb(var(--accent-color));
color: rgb(var(--accent-color));
}
.panel-tabs a {
border-bottom: 1px solid var(--border-color);
color: var(--text);
}
.panel-tabs a:hover {
border-bottom: 1px solid var(--border-color);
color: var(--text-strong-color);
}
a.panel-block:hover,
label.panel-block:hover {
background-color: var(--transparency-light-10);
color: var(--text-strong-color);
}
/* Side Menu*/
.menu-list a:hover {
background-color: var(--transparency-light-10);
color: var(--text-hover) !important;
}
.menu-list a.is-active,
.menu-list a.is-active:hover {
background-color: rgb(var(--accent-color));
color: var(--label-text-color) !important;
}
.menu-list li:hover .column-icon:hover {
color: black !important;
}
li.exited a {
color: var(--text-muted) !important;
}
.select select,
.textarea,
.input,
.dropdown-content {
background: var(--modal-bg-color);
background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed;
background-position: center center, center center;
background-size: auto, cover;
-webkit-background-size: auto, cover;
-moz-background-size: auto, cover;
-o-background-size: auto, cover;
border-color: rgba(255, 255, 255, .1);
border-radius: 4px;
color: var(--text-strong-color);
}
.autocomplete .dropdown-item.is-hovered,
a.dropdown-item:hover,
button.dropdown-item:hover {
background: var(--transparency-light-25);
color: var(--text-strong-color);
}
.column-icon[data-v-35775614]:hover {
color: rgb(var(--accent-color));
}
.select select:focus,
.textarea:focus,
.input:focus,
.select select.is-focused,
.is-focused.textarea,
.is-focused.input,
.select select:active,
.textarea:active,
.input:active,
.select select.is-active,
.is-active.textarea,
.is-active.input {
border-color: rgb(var(--accent-color));
box-shadow: 0 0 0 0.125em rgba(var(--accent-color), .25);
}
/* Settings buttons */
.button {
background: var(--button-color);
color: var(--button-text);
border-color: var(--button-color);
}
section .is-scrollbar-notification button {
background: var(--button-color) !important;
color: var(--button-text) !important;
border-color: var(--button-color) !important;
}
.b-radio.radio.button.is-selected {
background-color: var(--button-color-hover);
border-color: transparent;
color: var(--text-strong-color);
}
.button:hover {
background: var(--button-color-hover) !important;
border-color: var(--button-color-hover) !important;
color: var(--button-text-hover) !important;
}
.button:active,
.button.is-active {
background: var(--button-color-hover);
border-color: var(--button-color-hover);
color: var(--text-strong-color);
}
.is-settings-control {
background: var(--button-color);
color: var(--button-text);
border-color: transparent;
}
.is-settings-control:hover {
border-color: var(--button-color-hover) !important;
background: var(--button-color-hover) !important;
color: var(--button-text-hover) !important;
}
#hide-nav {
background: var(--button-color) !important;
color: var(--button-text) !important;
}
#hide-nav:hover {
border-color: var(--button-color-hover) !important;
background: var(--button-color-hover) !important;
color: var(--button-text-hover) !important;
}
code {
background: var(--transparency-dark-35) !important;
}
.switch input[type=checkbox]:checked+.check {
background: var(--button-color);
}
.switch:hover input[type=checkbox]:checked+.check {
background: var(--button-color-hover);
}
.switch input[type=checkbox]:focus:checked+.check,
.switch input[type=checkbox]:active:checked+.check {
box-shadow: 0 0 0.5em rgb(var(--accent-color), .8);
}
/* Events */
.events {
background: var(--transparency-dark-35);
}
.scroll-progress svg circle {
fill: rgba(255, 255, 255, .45) !important;
stroke: rgb(var(--accent-color)) !important;
}
.scroll-progress span {
color: var(--text-strong-color) !important;
}
.splitpanes--vertical>.splitpanes__splitter:hover {
background: rgb(var(--accent-color)) !important;
}
.events.medium {
background: var(--transparency-dark-45);
}
.date {
color: rgb(var(--accent-color)) !important;
background: var(--transparency-dark-25) !important;
}