mirror of
https://github.com/gilbN/theme.park.git
synced 2024-10-04 22:47:20 +02:00
407 lines
11 KiB
CSS
407 lines
11 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 */
|
|
|
|
body {
|
|
color: var(--text);
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
a,
|
|
.blue-text,
|
|
a.static,
|
|
i.control {
|
|
color: var(--link-color);
|
|
}
|
|
|
|
#template {
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
#menu {
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
#header .text-left {
|
|
border-right: solid medium var(--accent-color);
|
|
}
|
|
|
|
#header path {
|
|
fill: var(--accent-color);
|
|
}
|
|
#header {
|
|
background: var(--main-bg-color);
|
|
}
|
|
#header, #header .logo, #header .text-right a {
|
|
color: var(--text) !important;
|
|
}
|
|
#nav-block #nav-item:focus:after,
|
|
#nav-block #nav-item:hover:after,
|
|
#nav-block #nav-item.active:after {
|
|
background: var(--accent-color);
|
|
}
|
|
#nav-block #nav-item a:hover {
|
|
color: var(--text-hover) !important;
|
|
}
|
|
#nav-block #nav-item a {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
/*DASHBOARD*/
|
|
table.share_status.dashboard {
|
|
background-color: rgba(0, 0, 0, .15);
|
|
border: 1px solid rgba(255, 255, 255, .25);
|
|
}
|
|
|
|
table.share_status.dashboard tr>td.next {
|
|
border-top: 1px solid rgba(255, 255, 255, .25);
|
|
}
|
|
|
|
span.outer.solid {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.sys,
|
|
.usage-disk,
|
|
.usage-bar {
|
|
background: rgba(0, 0, 0, .35);
|
|
}
|
|
|
|
.usage-disk>span:first-child {
|
|
background-color: #4caf50
|
|
}
|
|
|
|
.green-text,
|
|
.passed,
|
|
.green {
|
|
color: #4caf50;
|
|
}
|
|
|
|
/*MAIN*/
|
|
#title {
|
|
border-bottom: 1px solid rgba(255, 255, 255, .25);
|
|
background-color: rgba(0, 0, 0, .5);
|
|
color: var(--text)
|
|
}
|
|
|
|
table {
|
|
background-color: rgb(0 0 0 / 25%);
|
|
}
|
|
|
|
table.disk_status thead tr:first-child td,
|
|
table tbody tr.tr_last,
|
|
table.share_status tbody tr:nth-child(even),
|
|
table.share_status thead tr:first-child td,
|
|
table.tablesorter thead tr th,
|
|
table.tablesorter tbody tr:nth-child(even),
|
|
table.tablesorter thead tr .tablesorter-headerAsc,
|
|
table.tablesorter thead tr .tablesorter-headerDesc {
|
|
background-color: rgba(0, 0, 0, .25);
|
|
}
|
|
|
|
table.disk_status tbody tr:nth-child(even) {
|
|
background-color: rgba(0, 0, 0, .25);
|
|
}
|
|
|
|
table.disk_status thead tr:last-child {
|
|
border-bottom: 1px solid rgb(160, 160, 160);
|
|
}
|
|
|
|
table.tablesorter thead tr {
|
|
border-bottom: rgba(255, 255, 255, .25) 1px solid;
|
|
}
|
|
|
|
table tbody tr.tr_last {
|
|
border-top: 1px solid rgba(255, 255, 255, .25);
|
|
}
|
|
|
|
table.share_status tbody tr.warn {
|
|
color: #e68a00 !important;
|
|
background-color: #feefb3 !important;
|
|
}
|
|
|
|
/*BUTTON*/
|
|
input[type=button],
|
|
input[type=reset],
|
|
input[type=submit],
|
|
button,
|
|
button[type=button],
|
|
a.button,
|
|
.sweet-alert button,
|
|
#template button[type=button],
|
|
#template button{
|
|
color: var(--button-text);
|
|
text-shadow: var(--text-shadow) var(--text-shadow-color);
|
|
background: linear-gradient(90deg, var(--button-color) 0, var(--button-color)) 0 0 no-repeat, linear-gradient(90deg, var(--button-color) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 100% 100% no-repeat;
|
|
background: -webkit-gradient(linear, left top, right top, from(var(--button-color)), to(var(--button-color))) 0 0 no-repeat, -webkit-gradient(linear, left top, right top, from(var(--button-color)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 100% 100% no-repeat;
|
|
background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%;
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
input:hover[type=button],
|
|
input:hover[type=reset],
|
|
input:hover[type=submit],
|
|
button:hover,
|
|
button:hover[type=button],
|
|
a.button:hover,
|
|
.sweet-alert button:hover,
|
|
#template button[type=button]:hover,
|
|
#template button:hover {
|
|
color: var(--button-text);
|
|
text-shadow: var(--text-shadow) var(--button-color-hover);
|
|
box-shadow: var(--box-shadow) var(--button-color-hover);
|
|
background-color: var(--button-color-hover);
|
|
background: -webkit-gradient(linear, left top, right top, from(var(--button-color-hover)), to(var(--button-color-hover)));
|
|
background: linear-gradient(90deg, var(--button-color-hover) 0, var(--button-color-hover));
|
|
}
|
|
|
|
.swal-button{
|
|
color: var(--button-text) !important;
|
|
text-shadow: var(--text-shadow) var(--text-shadow-color) !important;
|
|
background: linear-gradient(90deg, var(--button-color) 0, var(--button-color)) 0 0 no-repeat, linear-gradient(90deg, var(--button-color) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 0 100% no-repeat, linear-gradient(0deg, var(--button-color) 0, var(--button-color)) 100% 100% no-repeat !important;
|
|
background: -webkit-gradient(linear, left top, right top, from(var(--button-color)), to(var(--button-color))) 0 0 no-repeat, -webkit-gradient(linear, left top, right top, from(var(--button-color)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 0 100% no-repeat, -webkit-gradient(linear, left bottom, left top, from(var(--button-color)), to(var(--button-color))) 100% 100% no-repeat !important;
|
|
background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100% !important;
|
|
border: 1px solid transparent !important;
|
|
}
|
|
|
|
.swal-button:hover {
|
|
color: var(--button-text) !important;
|
|
text-shadow: var(--text-shadow) var(--button-color-hover) !important;
|
|
box-shadow: var(--box-shadow) var(--button-color-hover) !important;
|
|
background-color: var(--button-color-hover) !important;
|
|
background: -webkit-gradient(linear, left top, right top, from(var(--button-color-hover)), to(var(--button-color-hover))) !important;
|
|
background: linear-gradient(90deg, var(--button-color-hover) 0, var(--button-color-hover)) !important;
|
|
}
|
|
|
|
.switch-button-background.checked {
|
|
background-color: #4caf50 !important;
|
|
}
|
|
|
|
.switch-button-label.on {
|
|
color: #4caf50;
|
|
}
|
|
|
|
/* BAR GAUGES */
|
|
.usage-disk {
|
|
color: white;
|
|
}
|
|
|
|
/* USERS */
|
|
div.user-list {
|
|
border: 1px solid rgba(255, 255, 255, .15);
|
|
background-color: rgba(255, 255, 255, .05);
|
|
}
|
|
|
|
/* SETTINGS */
|
|
label.checkbox input:checked~.checkmark {
|
|
background: var(--button-color);
|
|
}
|
|
|
|
.logLine {
|
|
background: transparent;
|
|
}
|
|
|
|
.logLine.spacing {
|
|
color: var(--text);
|
|
background: var(--modal-bg-color);
|
|
}
|
|
|
|
#sb-info-inner,
|
|
#sb-loading-inner,
|
|
div.sb-message,
|
|
#sb-title,
|
|
#sb-title-inner {
|
|
color: var(--text);
|
|
background-color: transparent;
|
|
}
|
|
|
|
#sb-wrapper {
|
|
border: 1px rgba(0, 0, 0, 0) solid;
|
|
color: var(--text);
|
|
background: var(--modal-bg-color);
|
|
}
|
|
|
|
#sb-loading,
|
|
#sb-body-inner,
|
|
iframe {
|
|
color: var(--text);
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* PLUGINS */
|
|
div.tab [type=radio]:checked+label,
|
|
div.tab [type=radio]+label:hover {
|
|
border: 1px solid var(--accent-color);
|
|
}
|
|
|
|
/* FOOTER */
|
|
#footer {
|
|
color: var(--text);
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
/* CA */
|
|
.ca_holderDocker {
|
|
background-color: rgb(255 255 255 / 10%) !important;
|
|
border-color: rgb(255 255 255 / 25%) !important;
|
|
}
|
|
|
|
.selectedMenu,
|
|
.hoverMenu {
|
|
color: var(--link-color) !important;
|
|
}
|
|
|
|
.ca_templatesDisplay .ca_holderFav {
|
|
background: var(--button-color-hover) !important;
|
|
color: var(--text-hover) !important;
|
|
}
|
|
|
|
a.ca_appreadmore:hover {
|
|
color: var(--accent-color-hover) !important;
|
|
}
|
|
|
|
.ca_bottomLine .appIcons:hover,
|
|
.ca_bottomLine .unpinned:hover {
|
|
text-decoration: none;
|
|
color: var(--accent-color) !important;
|
|
}
|
|
|
|
.tooltipster-sidetip.tooltipster-right .tooltipster-box {
|
|
border-left: 3px solid var(--accent-color) !important;
|
|
}
|
|
|
|
.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
|
|
border-top: 3px solid var(--accent-color) !important;
|
|
}
|
|
|
|
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
|
|
border-top-color: var(--accent-color) !important;
|
|
}
|
|
|
|
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
|
|
border-right-color: var(--accent-color) !important;
|
|
}
|
|
|
|
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border,
|
|
.tooltipster-sidetip.tooltipster-top .tooltipster-box {
|
|
border-bottom-color: var(--accent-color) !important;
|
|
}
|
|
|
|
.appIconsPopUp:hover {
|
|
color: var(--accent-color) !important;
|
|
}
|
|
|
|
a.popUpLink:hover {
|
|
color: var(--accent-color-hover) !important;
|
|
}
|
|
|
|
/* AZURE THEME*/
|
|
div.frame,
|
|
div.tabs {
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
/*DROPDOWN MENU*/
|
|
.dropdown-menu {
|
|
background: var(--modal-bg-color);
|
|
}
|
|
|
|
.dropdown-menu a {
|
|
color: var(--text);
|
|
}
|
|
|
|
.dropdown-menu .divider {
|
|
background-color: rgb(255 255 255 / 10%);
|
|
border-bottom: 1px solid rgb(255 255 255 / 10%);
|
|
}
|
|
|
|
.dropdown-menu li>a:hover,
|
|
.dropdown-menu li>a:focus,
|
|
.dropdown-submenu:hover>a {
|
|
color: var(--text-hover);
|
|
background: rgb(255 255 255 / 10%);
|
|
}
|
|
|
|
/*VM MANAGER*/
|
|
div.shade-black {
|
|
background-color: rgb(0 0 0 / 15%) !important;
|
|
}
|
|
|
|
::placeholder {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
:-ms-input-placeholder {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
::-webkit-input-placeholder {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
/* MODAL */
|
|
|
|
/* .sweet-alert {
|
|
background: var(--modal-bg-color) !important;
|
|
} */
|
|
|
|
.showSweetAlert,
|
|
.swal-overlay--show-modal .swal-modal {
|
|
background: var(--modal-bg-color);
|
|
}
|
|
|
|
.sweet-alert h2,
|
|
.sweet-alert p,
|
|
.swal-title,
|
|
.swal-content,
|
|
.swal-content select {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
/*HELP TEXT*/
|
|
|
|
blockquote {
|
|
border-top: 2px solid rgb(255 255 255 / 25%);
|
|
border-bottom: 2px solid rgb(255 255 255 / 25%);
|
|
color: var(--text);
|
|
background-color: rgb(255 255 255 / 10%);
|
|
}
|
|
|
|
/* MY SERVERS */
|
|
.UnraidUPC .--hasBanner-custom .UnraidUPC-dropdown {
|
|
background-color: var(--modal-bg-color) !important;
|
|
--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 50%) !important;
|
|
-webkit-box-shadow: var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow);
|
|
box-shadow: var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow);
|
|
color: var(--text) !important;
|
|
}
|
|
#UnraidUPC .text-beta {
|
|
color: var(--text) !important;
|
|
}
|
|
.UnraidUPC-dropdown a, .UnraidUPC-dropdown button {
|
|
color: var(--text) !important;
|
|
}
|
|
.UnraidUPC-dropdown .btn-emphasize, .UnraidUPC-dropdown a:focus, .UnraidUPC-dropdown a:hover, .UnraidUPC-dropdown button:focus, .UnraidUPC-dropdown button:hover {
|
|
background-image: -webkit-gradient(linear,left top,right top,from(var(--tw-gradient-stops)));
|
|
background-image: linear-gradient(
|
|
90deg
|
|
,var(--tw-gradient-stops));
|
|
--tw-gradient-from: var(--accent-color);
|
|
--tw-gradient-stops: var(--tw-gradient-from),var(--accent-color,rgba(226,40,40,0));
|
|
--tw-gradient-to: var(--accent-color);
|
|
--tw-text-opacity: 1;
|
|
color: rgba(255,255,255,var(--tw-text-opacity));
|
|
outline: 0;
|
|
}
|
|
|
|
unraid-authed::part(div[data-v-050c892a] > button) {
|
|
background: pink !important;
|
|
} |