Browse Source

formatting

pull/166/head
gilbN 4 years ago
parent
commit
1b7a48108a
  1. 337
      CSS/themes/unraid/unraid-base.css

337
CSS/themes/unraid/unraid-base.css

@ -10,157 +10,204 @@
/* Made by @gilbN */ /* Made by @gilbN */
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
body { body {
color: var(--text); color: var(--text);
background: var(--main-bg-color); background: var(--main-bg-color);
} }
a,.blue-text {
color: var(--link-color); a,
} .blue-text {
#template { color: var(--link-color);
background: var(--main-bg-color); }
}
#menu { #template {
background: var(--main-bg-color);
}
#menu {
background: var(--main-bg-color); background: var(--main-bg-color);
} }
#nav-block #nav-item:focus:after, #nav-block #nav-item:hover:after {
#nav-block #nav-item:focus:after,
#nav-block #nav-item:hover:after {
background: var(--accent-color); background: var(--accent-color);
} }
/*DASHBOARD*/
table.share_status.dashboard { /*DASHBOARD*/
background-color: rgba(0, 0, 0, .15); table.share_status.dashboard {
border: 1px solid rgba(255, 255, 255, .25); 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);
} table.share_status.dashboard tr>td.next {
span.outer.solid { border-top: 1px solid rgba(255, 255, 255, .25);
background-color: transparent; }
}
span.outer.solid {
.sys { background-color: transparent;
background: rgba(0, 0, 0, .35); }
}
.usage-disk>span:first-child { .sys {
background-color: #4caf50 background: rgba(0, 0, 0, .35);
} }
.green-text, .passed, .green { .usage-disk>span:first-child {
color: #4caf50; background-color: #4caf50
} }
/*MAIN*/ .green-text,
#title { .passed,
border-bottom: 1px solid rgba(255, 255, 255, .25); .green {
background-color: rgba(0, 0, 0, .5); color: #4caf50;
color: var(--text) }
}
table { /*MAIN*/
background-color: rgb(0 0 0 / 25%); #title {
} border-bottom: 1px solid rgba(255, 255, 255, .25);
table.disk_status thead tr:first-child td, background-color: rgba(0, 0, 0, .5);
table tbody tr.tr_last, color: var(--text)
table.share_status tbody tr:nth-child(even), }
table.share_status thead tr:first-child td,
table.tablesorter thead tr th, table {
table.tablesorter tbody tr:nth-child(even), background-color: rgb(0 0 0 / 25%);
table.tablesorter thead tr .tablesorter-headerAsc, table.tablesorter thead tr .tablesorter-headerDesc{ }
background-color: rgba(0, 0, 0, .25);
} table.disk_status thead tr:first-child td,
table.disk_status tbody tr:nth-child(even) { table tbody tr.tr_last,
background-color: rgba(0, 0, 0, .25); table.share_status tbody tr:nth-child(even),
} table.share_status thead tr:first-child td,
table.disk_status thead tr:last-child { table.tablesorter thead tr th,
border-bottom: 1px solid rgba(255, 255, 255, .25); table.tablesorter tbody tr:nth-child(even),
} table.tablesorter thead tr .tablesorter-headerAsc,
table.tablesorter thead tr { table.tablesorter thead tr .tablesorter-headerDesc {
border-bottom: rgba(255, 255, 255, .25) 1px solid; background-color: rgba(0, 0, 0, .25);
} }
table tbody tr.tr_last { table.disk_status tbody tr:nth-child(even) {
border-top: 1px solid rgba(255, 255, 255, .25); background-color: rgba(0, 0, 0, .25);
} }
/*BUTTON*/ table.disk_status thead tr:last-child {
input[type=button], input[type=reset], input[type=submit], button, button[type=button], a.button { border-bottom: 1px solid rgba(255, 255, 255, .25);
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; table.tablesorter thead tr {
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; border-bottom: rgba(255, 255, 255, .25) 1px solid;
background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%; }
border: 1px solid transparent;
} table tbody tr.tr_last {
border-top: 1px solid rgba(255, 255, 255, .25);
input:hover[type=button], input:hover[type=reset], input:hover[type=submit], button:hover, button:hover[type=button], a.button:hover { }
color: var(--button-text);
text-shadow: var(--text-shadow) var(--button-color-hover); /*BUTTON*/
box-shadow: var(--box-shadow) var(--button-color-hover); input[type=button],
background-color: var(--button-color-hover); input[type=reset],
background: -webkit-gradient(linear, left top, right top, from(var(--button-color-hover)), to(var(--button-color-hover))); input[type=submit],
background: linear-gradient(90deg, var(--button-color-hover) 0, var(--button-color-hover)); button,
} button[type=button],
.switch-button-background.checked { a.button {
background-color: #4caf50 !important; color: var(--button-text);
} text-shadow: var(--text-shadow) var(--text-shadow-color);
.switch-button-label.on { 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;
color: #4caf50; 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;
/* BAR GAUGES */ }
.usage-disk {
color: white; input:hover[type=button],
} input:hover[type=reset],
input:hover[type=submit],
/* USERS */ button:hover,
div.user-list { button:hover[type=button],
border: 1px solid rgba(255, 255, 255, .15); a.button:hover {
background-color: rgba(255, 255, 255, .05); color: var(--button-text);
} text-shadow: var(--text-shadow) var(--button-color-hover);
box-shadow: var(--box-shadow) var(--button-color-hover);
/* SETTINGS */ background-color: var(--button-color-hover);
label.checkbox input:checked ~ .checkmark { background: -webkit-gradient(linear, left top, right top, from(var(--button-color-hover)), to(var(--button-color-hover)));
background: var(--button-color); background: linear-gradient(90deg, var(--button-color-hover) 0, var(--button-color-hover));
} }
.logLine { .switch-button-background.checked {
background: transparent; background-color: #4caf50 !important;
} }
.logLine.spacing {
color: var(--text); .switch-button-label.on {
background: var(--modal-bg-color); color: #4caf50;
} }
#sb-info-inner, #sb-loading-inner, div.sb-message,#sb-title, #sb-title-inner {
color: var(--text); /* BAR GAUGES */
background-color: transparent; .usage-disk {
} color: white;
#sb-wrapper { }
border: 1px rgba(0, 0, 0, 0) solid;
color: var(--text); /* USERS */
background: var(--modal-bg-color); div.user-list {
} border: 1px solid rgba(255, 255, 255, .15);
#sb-body, #sb-loading,#sb-body-inner, iframe { background-color: rgba(255, 255, 255, .05);
color: var(--text); }
background: transparent !important;
} /* SETTINGS */
/* FOOTER */ label.checkbox input:checked~.checkmark {
#footer { 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-body,
#sb-loading,
#sb-body-inner,
iframe {
color: var(--text);
background: transparent !important;
}
/* FOOTER */
#footer {
color: var(--text); color: var(--text);
background: var(--main-bg-color); background: var(--main-bg-color);
} }
/* CA */
.ca_holderDocker { /* CA */
background-color: rgb(255 255 255 / 10%); .ca_holderDocker {
border-color: rgb(255 255 255 / 25%); background-color: rgb(255 255 255 / 10%);
} border-color: rgb(255 255 255 / 25%);
.selectedMenu, .hoverMenu { }
color: var(--link-color);
} .selectedMenu,
.ca_holderFav { .hoverMenu {
background: var(--button-color-hover) !important; color: var(--link-color);
color: var(--text-hover) }
}
.ca_holderFav {
/* AZURE THEME*/ background: var(--button-color-hover) !important;
div.frame,div.tabs { color: var(--text-hover)
}
/* AZURE THEME*/
div.frame,
div.tabs {
background: var(--main-bg-color); background: var(--main-bg-color);
} }
Loading…
Cancel
Save