mirror of
https://github.com/gilbN/theme.park.git
synced 2024-10-03 22:17:08 +02:00
copy new files to old path
This commit is contained in:
GilbN
parent
5baa18577a
commit
4a82d00fa8
677
CSS/themes/adguard/adguard-base.css
Normal file
677
CSS/themes/adguard/adguard-base.css
Normal file
@ -0,0 +1,677 @@
|
||||
/* 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("https://theme-park.dev/CSS/defaults/placeholders.css");
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
body *::-webkit-scrollbar-thumb {
|
||||
background: hsla(0, 0%, 100%, .2);
|
||||
}
|
||||
|
||||
body *:hover::-webkit-scrollbar-thumb {
|
||||
background: hsla(0, 0%, 100%, 0.4);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
|
||||
a {
|
||||
color: var(--link-color)
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
a:-webkit-any-link:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6 {
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
/* LOGIN PAGE */
|
||||
|
||||
.login .login__form .text-center .h-6 {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.login__form .card {
|
||||
background: rgba(0, 0, 0, 0.08);
|
||||
border: 1px solid rgb(0 0 0 / 0.08);
|
||||
}
|
||||
|
||||
.login .btn-success:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.login .btn-link {
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.login .btn-link:hover {
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.form__message--error {
|
||||
color: #F44336;
|
||||
}
|
||||
|
||||
/* HEADER */
|
||||
.header {
|
||||
background: transparent;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
|
||||
.header-brand-img {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.header .btn-outline-secondary {
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.header .btn-outline-secondary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link.active {
|
||||
border-color: rgb(var(--accent-color));
|
||||
color: rgb(var(--accent-color));
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.header .nav-tabs .nav-link.active:hover {
|
||||
border-color: var(--accent-color-hover) !important;
|
||||
color: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
.header a:not([href]):not([tabindex]) {
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.header .nav-tabs {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.header .nav-tabs .nav-link:hover:not(.disabled) {
|
||||
border-color: var(--text-hover);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
.footer {
|
||||
background: rgba(0, 0, 0, 0.08);
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.03);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.footer a:not(.btn) {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.footer a:not(.btn):hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.footer .btn-outline-primary {
|
||||
color: var(--button-color);
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.footer .btn-outline-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* MAIN PAGE */
|
||||
.header__row .mobile-menu {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.container .btn-outline-primary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
background-image: none;
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.container .btn-outline-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.tooltip-container {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.tooltip-custom__container .button-action--arrow-option:not(:disabled):hover {
|
||||
cursor: pointer;
|
||||
background: rgb(0 0 0 / 0.15);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.toast--success {
|
||||
background-color: rgba(90, 173, 99, 0.75);
|
||||
}
|
||||
|
||||
/* CARDS*/
|
||||
.card {
|
||||
background-color: rgb(0 0 0 / 8%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.card-header .card-title {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.tooltip-custom__container {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.tooltip-custom__content-link {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.card-wrap,
|
||||
.card-title-stats {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.card-title-stats a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.card-title-stats a:hover {
|
||||
text-decoration: underline;
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.card .icon--lightgray {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.card .logs__text {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.card .button__action {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.card .btn-outline-danger {
|
||||
color: #F44336;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border-color: #F44336;
|
||||
}
|
||||
|
||||
.btn-outline-danger:hover {
|
||||
color: #fff;
|
||||
background-color: #F44336;
|
||||
border-color: #F44336;
|
||||
}
|
||||
|
||||
.btn-icon--green,
|
||||
.icon--green {
|
||||
color: var(--button-color);
|
||||
}
|
||||
|
||||
/* DROPDOWNS */
|
||||
.dropdown-menu {
|
||||
color: var(--text);
|
||||
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;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid rgba(0, 40, 100, 0.12);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-item:hover,
|
||||
.dropdown-item:focus {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: rgb(255 255 255 / 0.08);
|
||||
}
|
||||
|
||||
.select__menu {
|
||||
background: var(--modal-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;
|
||||
box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .5);
|
||||
}
|
||||
|
||||
.select__option:hover {
|
||||
background: rgba(255, 255, 255, .08) !important;
|
||||
}
|
||||
|
||||
.select__option {
|
||||
background: rgba(0, 0, 0, 0) !important;
|
||||
border-bottom: solid rgba(255, 255, 255, .1) 1px;
|
||||
}
|
||||
|
||||
.select__multi-value__remove {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.basic-multi-select .select__control--is-focused,
|
||||
.basic-multi-select .select__control--is-focused:hover {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
/* INSTALL */
|
||||
.setup__container {
|
||||
background-color: rgb(0 0 0 / 8%);
|
||||
}
|
||||
|
||||
.setup__progress-wrap {
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
}
|
||||
|
||||
.setup__logo {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
.checkbox__label-subtitle,
|
||||
.form__desc,
|
||||
.page-subtitle,
|
||||
.card-title small,
|
||||
.card-subtitle {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dropdown-item.active,
|
||||
.dropdown-item:active {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.service__icon {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
/* LOGS */
|
||||
.logs__table {
|
||||
background-color: rgb(0 0 0 / 8%);
|
||||
}
|
||||
|
||||
.logs__text,
|
||||
.logs__row .list-unstyled li,
|
||||
.detailed-info,
|
||||
.icon--lightgray,
|
||||
.icon--gray,
|
||||
.loading__text {
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.logs__no-data {
|
||||
color: var(--text);
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.logs__row--white {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.rt-tr-group.red,
|
||||
.logs__row--red,
|
||||
.rt-tr-group.logs__row--red {
|
||||
background-color: rgb(244 67 54 / 30%) !important;
|
||||
}
|
||||
|
||||
.rt-tr-group.blue,
|
||||
.rt-tr-group.logs__row--blue,
|
||||
.logs__row--blue {
|
||||
background-color: rgb(54 146 244 / 30%) !important;
|
||||
}
|
||||
|
||||
.ReactTable .rt-noData {
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.ReactTable .-pagination .-btn {
|
||||
color: var(--text);
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.ReactTable .-pagination .-btn:not([disabled]):hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.ReactTable .-loading,
|
||||
.ReactTable .-loading>div {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.ReactTable .rt-thead .rt-th,
|
||||
.ReactTable .rt-thead .rt-td,
|
||||
.logs__cell--header__container {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.ReactTable .rt-tbody .rt-tr-group {
|
||||
border-bottom: solid 1px rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
.ReactTable .rt-thead.-header {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.ReactTable .rt-thead .rt-th.-sort-asc, .ReactTable .rt-thead .rt-td.-sort-asc {
|
||||
-webkit-box-shadow: inset 0 3px 0 0 rgb(var(--accent-color), 0.60);
|
||||
box-shadow: inset 0 3px 0 0 rgb(var(--accent-color), 0.60);
|
||||
}
|
||||
|
||||
.ReactTable .rt-thead .rt-th.-sort-desc, .ReactTable .rt-thead .rt-td.-sort-desc {
|
||||
-webkit-box-shadow: inset 0 -3px 0 0 rgb(var(--accent-color), 0.60);
|
||||
box-shadow: inset 0 -3px 0 0 rgb(var(--accent-color), 0.60);
|
||||
}
|
||||
|
||||
.table th,
|
||||
.text-wrap table th,
|
||||
.table td,
|
||||
.text-wrap table td {
|
||||
padding: 0.75rem;
|
||||
vertical-align: top;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.loading:before {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.custom-select:focus {
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control {
|
||||
color: var(--text);
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid rgba(255, 255, 255, .1)
|
||||
}
|
||||
|
||||
.form-control--transparent {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.form-control--search {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: transparent;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.form-control:disabled, .form-control[readonly] {
|
||||
background-color: #555;
|
||||
opacity: 1;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.custom-select {
|
||||
color: var(--text);
|
||||
background: rgba(255, 255, 255, 0.1) url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxMCA1Jz48cGF0aCBmaWxsPScjOTk5JyBkPSdNMCAwTDEwIDBMNSA1TDAgMCcvPjwvc3ZnPg==") no-repeat right 0.75rem center;
|
||||
background-size: 8px 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
|
||||
}
|
||||
|
||||
.custom-select:focus {
|
||||
color: var(--text-hover);
|
||||
background: #1f1f1f url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxMCA1Jz48cGF0aCBmaWxsPScjOTk5JyBkPSdNMCAwTDEwIDBMNSA1TDAgMCcvPjwvc3ZnPg==") no-repeat right 0.75rem center;
|
||||
background-size: 8px 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
|
||||
}
|
||||
|
||||
select.form-control.select:focus,
|
||||
select:focus {
|
||||
color: var(--text-hover);
|
||||
background: #1f1f1f !important;
|
||||
}
|
||||
|
||||
.icon--selected {
|
||||
background-color: rgb(0 0 0 / 15%);
|
||||
border: solid 1px transparent;
|
||||
}
|
||||
|
||||
.tab__control,
|
||||
.tab__control--active {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn-outline-secondary {
|
||||
color: #c9c9c9;
|
||||
border-color: #c9c9c9;
|
||||
}
|
||||
|
||||
.btn-success,
|
||||
.btn-success.disabled,
|
||||
.btn-success:disabled {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-success:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-success:focus,
|
||||
.btn-success.focus {
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
color: var(--button-text);
|
||||
background-color: rgb(255 255 255 / 25%);
|
||||
border-color: rgb(255 255 255 / 0%);
|
||||
-webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.05);
|
||||
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.checkbox__input:checked+.checkbox__label:before {
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMi4zIDkuMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiPjxwYXRoIGQ9Ik0xMS44IDAuNUw1LjMgOC41IDAuNSA0LjIiLz48L3N2Zz4=);
|
||||
background-color: rgb(var(--accent-color));
|
||||
|
||||
}
|
||||
|
||||
.custom-radio .custom-control-input:checked~.custom-control-label::before,
|
||||
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-control-input:focus~.custom-control-label::before,
|
||||
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
|
||||
-webkit-box-shadow: 0 0 0 1px rgb(var(--accent-color)), 0 0 0 2px rgb(var(--accent-color), .25);
|
||||
box-shadow: 0 0 0 1px rgb(var(--accent-color)), 0 0 0 2px rgb(var(--accent-color), .25);
|
||||
}
|
||||
|
||||
/* MODALS */
|
||||
.modal-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;
|
||||
}
|
||||
|
||||
.ReactModal__Overlay--after-open {
|
||||
background-color: rgb(0 0 0 / 0.7) !important;
|
||||
}
|
||||
|
||||
/* MOBILE */
|
||||
@media (max-width: 767px) {
|
||||
.mobile-menu {
|
||||
background: #1b1b1b !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: #1f1f1f !important;
|
||||
}
|
||||
|
||||
.ReactModal__Content {
|
||||
background: var(--modal-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;
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.mobile-menu {
|
||||
background: #1b1b1b !important;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: #1f1f1f !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
::placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
834
CSS/themes/bazarr/bazarr-base.css
Normal file
834
CSS/themes/bazarr/bazarr-base.css
Normal file
@ -0,0 +1,834 @@
|
||||
/* 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("https://theme-park.dev/CSS/defaults/placeholders.css");
|
||||
|
||||
* {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* scroller */
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #1f1f1f;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
background-color: rgba(255, 255, 255, 0.35) !important;
|
||||
}
|
||||
|
||||
a,
|
||||
.page-link {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
.page-item.active .page-link {
|
||||
z-index: 3;
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.page-link {
|
||||
background-color: rgba(255, 255, 255, .07);
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.page-link:hover {
|
||||
color: var(--link-color-hover);
|
||||
text-decoration: none;
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.page-item.disabled .page-link {
|
||||
color: var(--link-color);
|
||||
background-color: rgba(255, 255, 255, .07);
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.page-link:focus {
|
||||
z-index: 3;
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color) / 25%);
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
.text-muted {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
.table {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.table thead th {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table-striped tbody tr:nth-of-type(odd) {
|
||||
background-color: rgb(0 0 0 / 15%);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.custom-control-label,
|
||||
label,
|
||||
.modal-header {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Form Stuff */
|
||||
|
||||
.header-container input[type=text] {
|
||||
padding: 0;
|
||||
transition: none;
|
||||
color: #fff;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .3) !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.header-container input[type=text]:focus {
|
||||
box-shadow: none;
|
||||
color: #fff;
|
||||
background-color: transparent !important;
|
||||
border-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color: #FFF;
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
background-color: rgba(255, 255, 255, 0.25) !important;
|
||||
border-color: rgba(255, 255, 255, 0.25) !important;
|
||||
outline: 0;
|
||||
box-shadow: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.form-control:disabled,
|
||||
.form-control[readonly] {
|
||||
background-color: rgb(255 255 255 / 15%);
|
||||
opacity: .7;
|
||||
color: #fff;
|
||||
border: 1px solid rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
:root .form-control:focus {
|
||||
box-shadow: none !important;
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
.form-group i {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.bootstrap-tagsinput {
|
||||
color: #eee;
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
border: 1px solid transparent !important;
|
||||
|
||||
}
|
||||
|
||||
.bootstrap-tagsinput.focus {
|
||||
background-color: #fff !important;
|
||||
border-color: transparent;
|
||||
outline: 0;
|
||||
box-shadow: none;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.input-group-text {
|
||||
color: var(--text);
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.custom-chip-input .main-input {
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.custom-chip-input:focus-within {
|
||||
border-color: rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.custom-chip-input .custom-chip {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
}
|
||||
|
||||
.custom-selector .selector__control .selector__multi-value,
|
||||
.selector__multi-value__label {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
/* SIDEBAR */
|
||||
.sidebar-container {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.sidebar-container .sidebar-button {
|
||||
color: var(--text) !important;
|
||||
background: transparent
|
||||
}
|
||||
|
||||
.sidebar-container .sidebar-button:active,
|
||||
.sidebar-container .sidebar-button:focus {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
background-color: rgba(0, 0, 0, 0.15) !important;
|
||||
}
|
||||
|
||||
.sidebar-container .sidebar-button:hover {
|
||||
background-color: transparent !important;
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.content-header.bg-dark .btn-dark:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.sidebar-container .sidebar-button.sb-active,
|
||||
.sidebar-container .sidebar-button.sb-active:hover {
|
||||
background-color: rgba(0, 0, 0, 0.15) !important;
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.content-header.bg-dark>button {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.content-header.bg-dark>button:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.content-header.bg-dark .btn-dark {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.btn-dark.disabled:hover,
|
||||
.btn-dark:disabled:hover {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
|
||||
.sidebar-container .sidebar-collapse-box.active:before,
|
||||
.sidebar-container .sidebar-button.sb-active:before {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
|
||||
.sidebar-container.open,
|
||||
.sidebar-container {
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-container .badge-secondary {
|
||||
color: var(--label-text-color);
|
||||
background-color: var(--arr-queue-color);
|
||||
}
|
||||
|
||||
/* TOP NAV BAR */
|
||||
.header-container .bg-primary {
|
||||
background-color: rgba(0, 0, 0, .35) !important;
|
||||
}
|
||||
|
||||
.header-container .btn-primary {
|
||||
color: var(--button-text);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.header-container .btn-primary.focus,
|
||||
.header-container .btn-primary:focus,
|
||||
.header-container .btn-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.header-container .btn-primary:not(:disabled):not(.disabled).active,
|
||||
.header-container .btn-primary:not(:disabled):not(.disabled):active,
|
||||
.header-container .show>.btn-primary.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
/* PAGES */
|
||||
.content-header.bg-dark {
|
||||
background: var(--main-bg-color) !important;
|
||||
background-repeat: repeat, no-repeat !important;
|
||||
background-attachment: fixed, fixed !important;
|
||||
background-position: center center, center center !important;
|
||||
background-size: auto, cover !important;
|
||||
-webkit-background-size: auto, cover !important;
|
||||
-moz-background-size: auto, cover !important;
|
||||
-o-background-size: auto, cover !important;
|
||||
border-bottom: solid 1px rgba(255, 255, 255, .1);
|
||||
|
||||
}
|
||||
|
||||
/* LOGIN */
|
||||
.bg-light {
|
||||
background: var(--main-bg-color) !important;
|
||||
background-repeat: repeat, no-repeat !important;
|
||||
background-attachment: fixed, fixed !important;
|
||||
background-position: center center, center center !important;
|
||||
background-size: auto, cover !important;
|
||||
-webkit-background-size: auto, cover !important;
|
||||
-moz-background-size: auto, cover !important;
|
||||
-o-background-size: auto, cover !important;
|
||||
}
|
||||
|
||||
.auth-card {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.auth-card .card-footer {
|
||||
background-color: transparent;
|
||||
border-top: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px solid rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
|
||||
.card {
|
||||
background-color: rgba(0, 0, 0, .45);
|
||||
box-shadow: 0 0 10px 1px #000000;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.settings-card:hover,
|
||||
.settings-card:focus {
|
||||
border-color: transparent;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.alert-secondary {
|
||||
color: var(--text);
|
||||
background-color: rgba(255, 255, 255, .15);
|
||||
border-color: rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
/* Series page */
|
||||
.progress-bar {
|
||||
background-color: var(--accent-color);
|
||||
}
|
||||
|
||||
.progress {
|
||||
background-color: rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
.progress-bar.bg-primary {
|
||||
background: rgb(var(--accent-color)) !important;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.progress-bar.bg-warning {
|
||||
color: #212529;
|
||||
background-color: rgba(255, 193, 7, .8) !important;
|
||||
}
|
||||
|
||||
.badge-warning {
|
||||
color: #212529;
|
||||
background-color: rgba(255, 193, 7, .8);
|
||||
}
|
||||
|
||||
.badge-primary {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.text-truncate.badge.badge-secondary {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.popover {
|
||||
background-color: #1f1f1f;
|
||||
border: 1px solid rgba(255, 255, 255, .2);
|
||||
}
|
||||
|
||||
.bs-popover-auto[x-placement^=top]>.arrow:after,
|
||||
.bs-popover-top>.arrow:after {
|
||||
border-top-color: rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
.popover-header {
|
||||
background-color: #1f1f1f;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
|
||||
}
|
||||
|
||||
.popover-body {
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.spinner-border {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
|
||||
.modal-content {
|
||||
box-shadow: 0 0 10px 1px rgba(0, 0, 0, .1);
|
||||
border-radius: 3px;
|
||||
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;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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-bottom: 1px solid var(--accent-color);
|
||||
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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-top: 1px solid var(--accent-color);
|
||||
}
|
||||
|
||||
.modal-content .badge-secondary {
|
||||
color: #fff;
|
||||
background-color: var(--accent-color);
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.modal-content button:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
.close {
|
||||
float: right;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: #eee;
|
||||
text-shadow: 0 1px 0 #eee;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.close:hover {
|
||||
color: #fff !important;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
.btn-primary,
|
||||
.btn-outline-secondary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary.focus,
|
||||
.btn-primary:focus,
|
||||
.btn-primary:hover,
|
||||
.btn-outline-secondary:hover,
|
||||
.btn-outline-secondary.focus,
|
||||
.btn-outline-secondary:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary:not(:disabled):not(.disabled).active,
|
||||
.btn-primary:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-primary.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.btn-primary:not(:disabled):not(.disabled):active:focus,
|
||||
.show>.btn-primary.dropdown-toggle:focus,
|
||||
.btn-primary.focus,
|
||||
.btn-primary:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.btn-primary.disabled,
|
||||
.btn-primary:disabled {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-dark.disabled,
|
||||
.btn-dark:disabled {
|
||||
color: var(--text-muted);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-dark.disabled:hover,
|
||||
.btn-dark:disabled:hover {
|
||||
color: var(--text-muted);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-dark {
|
||||
color: var(--button-text);
|
||||
background-color: transparent;
|
||||
/* rgba(var(--accent-color),.5)*/
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-dark.focus,
|
||||
.btn-dark:focus,
|
||||
.btn-dark:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: transparent;
|
||||
/* rgba(var(--accent-color),.8) */
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-dark.focus,
|
||||
.btn-dark:focus {
|
||||
box-shadow: 0 0 0 0.2rem transparent;
|
||||
}
|
||||
|
||||
.btn-dark:not(:disabled):not(.disabled).active,
|
||||
.btn-dark:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-dark.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-dark:not(:disabled):not(.disabled).active:focus,
|
||||
.btn-dark:not(:disabled):not(.disabled):active:focus,
|
||||
.show>.btn-dark.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem transparent;
|
||||
}
|
||||
|
||||
.btn-light {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-light.focus,
|
||||
.btn-light:focus,
|
||||
.btn-light:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-light.disabled,
|
||||
.btn-light:disabled {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-light:not(:disabled):not(.disabled).active,
|
||||
.btn-light:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-light.dropdown-toggle,
|
||||
.btn-light.focus,
|
||||
.btn-light:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-light:not(:disabled):not(.disabled).active:focus,
|
||||
.btn-light:not(:disabled):not(.disabled):active:focus,
|
||||
.show>.btn-light.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem transparent;
|
||||
}
|
||||
|
||||
.custom-control-input:focus~.custom-control-label:before {
|
||||
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, .07);
|
||||
}
|
||||
|
||||
.custom-control-input:checked~.custom-control-label:before {
|
||||
border-color: rgb(var(--accent-color));
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-control-input:focus~.custom-control-label:before {
|
||||
box-shadow: 0 0 0 .2rem rgba(var(--accent-color), .25)
|
||||
}
|
||||
|
||||
.custom-control-input:focus:not(:checked)~.custom-control-label:before {
|
||||
border-color: var(--accent-color);
|
||||
}
|
||||
|
||||
.custom-control-input:not(:disabled):active~.custom-control-label:before {
|
||||
color: #fff;
|
||||
background-color: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-checkbox .custom-control-input:indeterminate~.custom-control-label:before {
|
||||
border-color: rgb(var(--accent-color));
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label:before {
|
||||
background-color: rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label:before {
|
||||
background-color: rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.custom-radio .custom-control-input:disabled:checked~.custom-control-label:before {
|
||||
background-color: rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.custom-switch .custom-control-input:disabled:checked~.custom-control-label:before {
|
||||
background-color: rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.custom-checkbox .custom-control-input:checked~.custom-control-label:after {
|
||||
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath fill='%23000' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
input {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.custom-select:focus {
|
||||
border-color: rgb(var(--accent-color));
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 .2rem rgba(var(--accent-color), .25)
|
||||
}
|
||||
|
||||
.custom-file-input:focus~.custom-file-label {
|
||||
border-color: rgb(var(--accent-color));
|
||||
box-shadow: 0 0 0 .2rem rgba(var(--accent-color), .25)
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
.dropdown-menu,
|
||||
.dropdown-header {
|
||||
color: var(--text);
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-item:focus,
|
||||
.dropdown-item:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.custom-selector .selector__control {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border-color: rgba(0, 0, 0, 0) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
[class$="-singleValue"],
|
||||
[class$="-placeholder"],
|
||||
[class$="-indicatorContainer"] {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
[class$="-indicatorContainer"]:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.custom-selector .selector__control--is-focused {
|
||||
border-color: rgba(255, 255, 255, .2) !important;
|
||||
}
|
||||
|
||||
.selector__menu {
|
||||
background: var(--drop-down-menu-bg) !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)
|
||||
}
|
||||
|
||||
.custom-selector .selector__option--is-selected:active {
|
||||
background-color: rgba(255, 255, 255, .07) !important;
|
||||
}
|
||||
|
||||
.custom-selector .selector__option--is-focused {
|
||||
background-color: rgba(var(--accent-color), .2);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.custom-selector .selector__option--is-focused:active,
|
||||
.custom-selector .selector__option--is-focused:focus {
|
||||
background-color: rgba(var(--accent-color), .2);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.custom-selector .selector__option--is-selected {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.custom-selector .selector__option--is-selected:active {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-rc-slider .rc-slider-track {
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.custom-rc-slider .rc-slider-handle {
|
||||
border: 3px solid var(--button-color);
|
||||
}
|
||||
|
||||
.custom-rc-slider .rc-slider-handle:hover,
|
||||
.custom-rc-slider .rc-slider-handle:active {
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
|
||||
/* RECHARTS */
|
||||
.recharts-default-tooltip {
|
||||
background: #1f1f1f !important;
|
||||
border: transparent !important;
|
||||
}
|
||||
|
||||
.recharts-rectangle.recharts-tooltip-cursor {
|
||||
fill: rgba(255, 255, 255, .15) !important;
|
||||
}
|
||||
|
||||
text {
|
||||
stroke: none;
|
||||
fill: var(--text-hover);
|
||||
text-anchor: end;
|
||||
}
|
||||
|
||||
line {
|
||||
stroke: var(--text);
|
||||
fill: none;
|
||||
}
|
||||
|
||||
|
||||
/* TOASTS */
|
||||
.toast {
|
||||
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: 1px solid rgba(0, 0, 0, .1);
|
||||
box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .1);
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.toast-header {
|
||||
color: var(--text-hover);
|
||||
background-color: hsla(0, 0%, 0%, .35);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, .05);
|
||||
}
|
||||
|
||||
.alert-container .toast-container .toast .toast-body .progress .progress-bar {
|
||||
text-shadow: -2px -2px 5px rgba(var(--accent-color), .35), 2px -2px 5px rgba(var(--accent-color), .35), -2px 2px 5px rgba(var(--accent-color), .35), 2px 2px 5px rgba(var(--accent-color), .35);
|
||||
overflow: visible
|
||||
}
|
||||
|
||||
.progress-bar-striped {
|
||||
background-image: linear-gradient(45deg, rgba(var(--accent-color), .5) 25%, transparent 0, transparent 50%, rgba(var(--accent-color), .5) 0, rgba(var(--accent-color), .5) 75%, transparent 0, transparent);
|
||||
background-size: 1rem 1rem
|
||||
}
|
||||
|
||||
/* LOGS */
|
||||
/* Stack traceback */
|
||||
code.zmdi-language-python-alt {
|
||||
color: var(--text);
|
||||
}
|
||||
502
CSS/themes/bitwarden/bitwarden-base.css
Normal file
502
CSS/themes/bitwarden/bitwarden-base.css
Normal file
@ -0,0 +1,502 @@
|
||||
/* 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 */
|
||||
|
||||
* {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
img.logo {
|
||||
filter: invert(100);
|
||||
}
|
||||
|
||||
body.layout_frontend,
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
a,
|
||||
app-vault-groupings .card .card-body a,
|
||||
app-org-vault-groupings .card .card-body a,
|
||||
.groupings .card .card-body a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
app-vault-groupings .card li.active>a:first-of-type,
|
||||
app-vault-groupings .card li.active>div a:first-of-type,
|
||||
app-org-vault-groupings .card li.active>a:first-of-type,
|
||||
app-org-vault-groupings .card li.active>div a:first-of-type,
|
||||
.groupings .card li.active>a:first-of-type,
|
||||
.groupings .card li.active>div a:first-of-type {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
.text-muted,
|
||||
.form-check-block .form-check-label>small,
|
||||
.modal-header small,
|
||||
.table,
|
||||
.text-body {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
.table-hover tbody tr:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
label,
|
||||
label:not(.form-check-label):not(.btn),
|
||||
label.bold .card-header:first-child,
|
||||
.card-header,
|
||||
.modal-header {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.navbar {
|
||||
background-color: rgb(0 0 0 / 25%) !important;
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .show>.nav-link,
|
||||
.navbar-dark .navbar-nav .active>.nav-link,
|
||||
.navbar-dark .navbar-nav .nav-link.show,
|
||||
.navbar-dark .navbar-nav .nav-link.active {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.card {
|
||||
background-color: rgba(255, 255, 255, 0.07);
|
||||
}
|
||||
|
||||
app-vault-groupings .card li.active>a:first-of-type,
|
||||
app-vault-groupings .card li.active>div a:first-of-type,
|
||||
app-vault-groupings .card li.active>div>.fa {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
body>app-root>app-user-layout>app-tools>div>div>div.col-9>app-password-generator>div.card.card-password.bg-light.my-4 {
|
||||
background-color: rgb(0 0 0 / 15%) !important;
|
||||
}
|
||||
|
||||
.password-number {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* MODALS */
|
||||
.modal-content,
|
||||
.modal-footer {
|
||||
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;
|
||||
}
|
||||
|
||||
.close,
|
||||
.close:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.close:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.swal2-popup {
|
||||
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;
|
||||
color: var(--text);
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.swal2-popup .swal2-title {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.swal2-popup .swal2-content {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.swal2-popup .swal2-actions {
|
||||
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;
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.swal2-popup .swal2-actions button.swal2-confirm {
|
||||
color: #fff;
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.swal2-popup .swal2-actions button.swal2-confirm:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control:focus {
|
||||
box-shadow: none;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color: var(--text);
|
||||
background-color: rgb(0 0 0 / 0.25);
|
||||
border: 1px solid transparent;
|
||||
|
||||
}
|
||||
|
||||
.form-control:disabled,
|
||||
.form-control[readonly] {
|
||||
background-color: rgb(255 255 255 / 25%);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
.dropdown-menu {
|
||||
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: 1px solid transparent;
|
||||
box-shadow: 3px 3px 10px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.dropdown-item,
|
||||
.dropdown-item-text {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-item:hover,
|
||||
.dropdown-item:focus {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: rgb(255 255 255 / 0.08);
|
||||
}
|
||||
|
||||
a.text-danger:hover,
|
||||
a.text-danger:focus {
|
||||
color: #dd4b39 !important;
|
||||
background-color: rgb(255 255 255 / 0.08) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu .text-danger {
|
||||
font-weight: bold !important;
|
||||
background: rgb(0 0 0 / 20%) !important;
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
.list-group-item.active {
|
||||
color: var(--text);
|
||||
background-color: rgb(255 255 255 / 10%);
|
||||
border-left: 3px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.callout {
|
||||
background-color: rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border: 1px solid rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn-link {
|
||||
color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-link:hover {
|
||||
color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
transition: 0.15s;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-primary:not(:disabled):not(.disabled):active {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
transition: 0.15s;
|
||||
}
|
||||
|
||||
.btn-primary:focus,
|
||||
.swal2-popup .swal2-actions button.swal2-confirm:focus,
|
||||
.btn-primary.focus,
|
||||
.swal2-popup .swal2-actions button.focus.swal2-confirm,
|
||||
.btn-primary:not(:disabled):not(.disabled):active:focus,
|
||||
.swal2-popup .swal2-actions button.swal2-confirm:not(:disabled):not(.disabled):active:focus,
|
||||
.btn-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.swal2-popup .swal2-actions button.swal2-confirm:not(:disabled):not(.disabled).active:focus,
|
||||
.show>.btn-primary.dropdown-toggle:focus,
|
||||
.swal2-popup .swal2-actions .show>button.dropdown-toggle.swal2-confirm:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.btn[class*="btn-outline-"]:not(:hover),
|
||||
.swal2-popup .swal2-actions button[class*="btn-outline-"]:not(:hover),
|
||||
.swal2-popup .swal2-actions button.swal2-cancel {
|
||||
border-color: var(--button-color);
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-outline-secondary:hover,
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-secondary:hover:not(:disabled),
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:hover:not(:disabled) {
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.btn-outline-primary:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-primary:not(:disabled):not(.disabled):active,
|
||||
.btn-outline-primary:not(:disabled):not(.disabled).active,
|
||||
.show>.btn-outline-primary.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
|
||||
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.show>.btn-outline-primary.dropdown-toggle:focus,
|
||||
.btn-outline-secondary:focus,
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:focus,
|
||||
.btn-outline-secondary.focus,
|
||||
.swal2-popup .swal2-actions button.focus.swal2-cancel,
|
||||
.btn-outline-primary:focus,
|
||||
.btn-outline-primary.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.btn-outline-secondary:not(:disabled):not(.disabled):active,
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:not(:disabled):not(.disabled):active,
|
||||
.btn-outline-secondary:not(:disabled):not(.disabled).active,
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:not(:disabled):not(.disabled).active,
|
||||
.show>.btn-outline-secondary.dropdown-toggle,
|
||||
.swal2-popup .swal2-actions .show>button.dropdown-toggle.swal2-cancel {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus,
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:not(:disabled):not(.disabled):active:focus,
|
||||
.btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
|
||||
.swal2-popup .swal2-actions button.swal2-cancel:not(:disabled):not(.disabled).active:focus,
|
||||
.show>.btn-outline-secondary.dropdown-toggle:focus,
|
||||
.swal2-popup .swal2-actions .show>button.dropdown-toggle.swal2-cancel:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.btn-primary.disabled,
|
||||
.swal2-popup .swal2-actions button.disabled.swal2-confirm,
|
||||
.btn-primary:disabled,
|
||||
.swal2-popup .swal2-actions button.swal2-confirm:disabled {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
/* Org */
|
||||
.org-nav {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.org-nav .nav-tabs a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.org-nav .nav-tabs a.active {
|
||||
border-top: 3px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link.active,
|
||||
.nav-tabs .nav-item.show .nav-link {
|
||||
color: var(--text);
|
||||
background-color: rgb(255 255 255 / 25%);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
app-vault-groupings .card .card-body a:hover.text-muted {
|
||||
color: #fff !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
app-vault-groupings .card li.active>a:first-of-type,
|
||||
app-vault-groupings .card li.active>div a:first-of-type,
|
||||
app-org-vault-groupings .card li.active>a:first-of-type,
|
||||
app-org-vault-groupings .card li.active>div a:first-of-type {
|
||||
font-weight: bold;
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
input::-webkit-input-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus::-webkit-input-placeholder {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Firefox < 19 */
|
||||
input:-moz-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus:-moz-placeholder {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Firefox > 19 */
|
||||
input::-moz-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus::-moz-placeholder {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Internet Explorer 10 */
|
||||
input:-ms-input-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus:-ms-input-placeholder {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* ADMIN PAGE */
|
||||
|
||||
.bg-light {
|
||||
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;
|
||||
}
|
||||
|
||||
.bg-light .navbar {
|
||||
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;
|
||||
}
|
||||
|
||||
/* Cards */
|
||||
.bg-secondary {
|
||||
background-color: rgb(255 255 255 / 10%) !important;
|
||||
}
|
||||
|
||||
.bg-white {
|
||||
background-color: rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
|
||||
.page-item.active .page-link {
|
||||
z-index: 3;
|
||||
color: #fff;
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.page-item.disabled .page-link {
|
||||
color: var(--text);
|
||||
pointer-events: none;
|
||||
cursor: auto;
|
||||
background-color: rgb(0 0 0 / 10%);
|
||||
border-color: rgb(0 0 0 / 10%);
|
||||
}
|
||||
|
||||
.text-muted,
|
||||
.card-header small,
|
||||
.modal-header small {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
337
CSS/themes/calibreweb/calibreweb-base.css
Normal file
337
CSS/themes/calibreweb/calibreweb-base.css
Normal file
@ -0,0 +1,337 @@
|
||||
/* 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 */
|
||||
|
||||
/* "Re-skin" of CaliBlur https://github.com/leram84/layer.Cake/tree/master/caliBlur */
|
||||
/* Set theme to CaliBlur in UI Configuration -> View Configuration -> Theme -> CaliBlur -> Submit */
|
||||
/* APP VARS*/
|
||||
:root {
|
||||
--color-background: var(--main-bg-color);
|
||||
--color-primary: rgb(var(--accent-color));
|
||||
--color-secondary: var(--button-color);
|
||||
--color-secondary-hover: var(--button-color-hover);
|
||||
--color-background-mobile: var(--main-bg-color);
|
||||
}
|
||||
*,
|
||||
*:focus,
|
||||
*:active,
|
||||
.bootstrap-select .dropdown-toggle:focus,
|
||||
.bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
body:not(.read-frame) {
|
||||
background: var(--main-bg-color) !important;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.blur-wrapper:after {
|
||||
background: var(--main-bg-color) !important;
|
||||
}
|
||||
|
||||
body>.container-fluid {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
|
||||
body.login:not(.read-frame),
|
||||
body.shelfcreate,
|
||||
body.shelfedit {
|
||||
background: var(--main-bg-color) !important;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
.navbar-collapse.collapse {
|
||||
background: var(--modal-bg-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Book cover border */
|
||||
.container-fluid .book .cover span img {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-default a,
|
||||
.btn-default a:hover {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* TP */
|
||||
|
||||
/* TEXT */
|
||||
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
body.admin>div.container-fluid>div>div.col-sm-10>div.container-fluid>div.row:first-of-type>div.col>h2:before,
|
||||
body.admin>div.container-fluid>div>div.col-sm-10>div.discover>h2:first-of-type:before,
|
||||
body.edituser.admin>div.container-fluid>div.row-fluid>div.col-sm-10>div.discover>h1:before,
|
||||
body.newuser.admin>div.container-fluid>div.row-fluid>div.col-sm-10>div.discover>h1:before,
|
||||
.container-fluid .book .meta .author,
|
||||
.container-fluid .book .meta .author>a:hover,
|
||||
.well>h2,
|
||||
body:not(.admin)>div.container-fluid>div>div.col-sm-10>div.discover:only-of-type>h2 {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
|
||||
body,
|
||||
html,
|
||||
p {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.home-btn>a,
|
||||
.plexBack>a,
|
||||
.container-fluid .book .meta .author,
|
||||
.container-fluid .book .meta .author>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.home-btn>a:hover,
|
||||
body>div.navbar.navbar-default.navbar-static-top>div>div.home-btn>a:hover:before,
|
||||
.plexBack:not(.noBack):hover>a,
|
||||
.form-group>label,
|
||||
label,
|
||||
body.authorlist>div.container-fluid>div>div.col-sm-10>div.container:before,
|
||||
body.catlist>div.container-fluid>div>div.col-sm-10>div.container:before,
|
||||
body.langlist>div.container-fluid>div>div.col-sm-10>div.container:before,
|
||||
body.me>div.container-fluid>div>div.col-sm-10>div.discover:before,
|
||||
body.serieslist>div.container-fluid>div>div.col-sm-10>div.container:before {
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
a,
|
||||
body.admin,
|
||||
body.admin td>a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
body.admin td>a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.navigation .create-shelf a,
|
||||
.meta>a>p {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
.navigation .create-shelf a:hover,
|
||||
.author>a:hover,
|
||||
.meta>a>p:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
/* tables */
|
||||
|
||||
th,
|
||||
body.tasks>div.container-fluid>div>div.col-sm-10>div.discover>div.bootstrap-table>div.fixed-table-container>div.fixed-table-body>#table>thead>tr>th>.th-inner {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
|
||||
/* MODAL */
|
||||
.modal-content {
|
||||
background: var(--modal-bg-color);
|
||||
}
|
||||
|
||||
#GeneralDeleteModal .bg-danger {
|
||||
background: var(--modal-bg-color);
|
||||
}
|
||||
|
||||
/* ICONS */
|
||||
.glyphicon,
|
||||
#add-to-shelf>span,
|
||||
#btnGroupDrop1>span,
|
||||
#readbtn>span,
|
||||
#sendbtn>span,
|
||||
.book-meta .btn-toolbar>.btn-group>.btn-group:nth-child(1)>a:first-of-type>span,
|
||||
.book-meta .btn-toolbar>.btn-group>.btn-warning>span,
|
||||
.btn-toolbar>.btn-group>#btnGroupDrop2>span,
|
||||
.btn-toolbar>.btn-group>.btn-group>#btnGroupDrop2>span,
|
||||
div[aria-label="Edit/Delete book"]>.btn>span {
|
||||
color: var(--text);
|
||||
|
||||
}
|
||||
|
||||
#add-to-shelf:hover span,
|
||||
#btnGroupDrop1:hover>span,
|
||||
#readbtn:hover>span,
|
||||
#sendbtn:hover>span,
|
||||
.book-meta .btn-toolbar>.btn-group>.btn-group:nth-child(1)>a:first-of-type:hover>span,
|
||||
.book-meta .btn-toolbar>.btn-group>.btn-warning:hover>span,
|
||||
.btn-toolbar>.btn-group>#btnGroupDrop2:hover>span,
|
||||
.btn-toolbar>.btn-group>.btn-group>#btnGroupDrop2:hover>span,
|
||||
div[aria-label="Edit/Delete book"]>.btn>span:hover,
|
||||
#btnGroupDrop1[aria-expanded=true]>span,
|
||||
#shelf-actions>.btn-group.open>#add-to-shelf>span {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a:focus,
|
||||
.dropdown-menu>li>a:hover {
|
||||
color: var(--text-hover);
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
/* SIDEMENU */
|
||||
.navigation li a:hover .glyphicon,
|
||||
.navigation li a:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.navigation li a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.navigation .nav-head {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
body>div.navbar.navbar-default.navbar-static-top>div>div.navbar-header>a:hover {
|
||||
color: var(--accent-color-hover) !important;
|
||||
-webkit-transition: color .2s;
|
||||
-o-transition: color .2s;
|
||||
transition: color .2s;
|
||||
background-color: rgba(0, 0, 0, .55) !important;
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.navbar-default .navbar-nav>li>a:focus .glyphicon,
|
||||
.navbar-default .navbar-nav>li>a:hover .glyphicon {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
|
||||
.btn-primary,
|
||||
.btn-primary>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#add-to-shelf>span::before) {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover:not(#add-to-shelf),
|
||||
.btn-primary:hover>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#edit_book):not(#add-to-shelf span):not(#add-to-shelf) {
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary.active,
|
||||
.btn-primary:active,
|
||||
.btn-primary:focus,
|
||||
.btn-primary:hover,
|
||||
.open .dropdown-toggle.btn-primary,
|
||||
.btn-primary:focus>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#add-to-shelf span),
|
||||
.btn-primary:active>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#add-to-shelf span),
|
||||
.btn-primary:hover>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#add-to-shelf span) {
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary.active.focus:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary.active:focus:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary.active:hover:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary:active.focus:not(#edit_book):not(#add-to-shelf:not([data-original-title="Download :"])):not(#btnGroupDrop1),
|
||||
.btn-primary:active:focus:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary:active:hover:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.open>.dropdown-toggle.btn-primary.focus:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.open>.dropdown-toggle.btn-primary:focus:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.open>.dropdown-toggle.btn-primary:hover:not(#edit_book):not(#add-to-shelf):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary:hover>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#edit_book):not(#add-to-shelf span):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary:active>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#edit_book):not(#add-to-shelf span):not([data-original-title="Download :"]):not(#btnGroupDrop1),
|
||||
.btn-primary:focus>span.glyphicon:not(#edit_book > span):not(#btnGroupDrop1 > span.glyphicon.glyphicon-download):not(#edit_book):not(#add-to-shelf span):not([data-original-title="Download :"]):not(#btnGroupDrop1) {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.book-meta>.bookinfo .btn-info,
|
||||
.book-meta>.bookinfo .btn-success {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
font-size: 13px;
|
||||
display: inline-block;
|
||||
border-radius: 4px;
|
||||
vertical-align: middle;
|
||||
font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
-webkit-transition: background-color .2s, color .2s;
|
||||
-o-transition: background-color .2s, color .2s;
|
||||
transition: background-color .2s, color .2s;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.book-meta>.bookinfo .btn-info:hover,
|
||||
.book-meta>.bookinfo .btn-success:hover {
|
||||
color: var(--label-text-color);
|
||||
text-decoration: none;
|
||||
background: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
[data-target="#fileModal"] span {
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
[data-target="#fileModal"]:hover span {
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
/* ALERT */
|
||||
|
||||
.alert {
|
||||
background: var(--modal-bg-color);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* SERIES PAGE */
|
||||
/* from caliBlur_overide.css */
|
||||
.cover .badge {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border-radius: 0;
|
||||
padding: 0 8px;
|
||||
box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
|
||||
line-height: 24px;
|
||||
}
|
||||
.cover {
|
||||
box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
.cover .read {
|
||||
padding: 0 0;
|
||||
line-height: 15px;
|
||||
}
|
||||
body.serieslist.grid-view div.container-fluid > div > div.col-sm-10::before {
|
||||
display: none;
|
||||
}
|
||||
16
CSS/themes/deluge/aquamarine.css
Normal file
16
CSS/themes/deluge/aquamarine.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE AQUAMARINE THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/aquamarine.css);
|
||||
16
CSS/themes/deluge/dark.css
Normal file
16
CSS/themes/deluge/dark.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE DARK THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/dark.css);
|
||||
2453
CSS/themes/deluge/deluge-base.css
Normal file
2453
CSS/themes/deluge/deluge-base.css
Normal file
File diff suppressed because it is too large
Load Diff
16
CSS/themes/deluge/dracula.css
Normal file
16
CSS/themes/deluge/dracula.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE DRACULA THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/dracula.css);
|
||||
16
CSS/themes/deluge/hotline.css
Normal file
16
CSS/themes/deluge/hotline.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE HOTLINE THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/hotline.css);
|
||||
16
CSS/themes/deluge/organizr-dark.css
Normal file
16
CSS/themes/deluge/organizr-dark.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE ORGANIZR-DARK THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/organizr-dark.css);
|
||||
16
CSS/themes/deluge/plex.css
Normal file
16
CSS/themes/deluge/plex.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE PLEX THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/plex.css);
|
||||
16
CSS/themes/deluge/space-gray.css
Normal file
16
CSS/themes/deluge/space-gray.css
Normal file
@ -0,0 +1,16 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* DELUGE SPACE GRAY THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/deluge/deluge-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/space-gray.css);
|
||||
277
CSS/themes/dozzle/dozzle-base.css
Normal file
277
CSS/themes/dozzle/dozzle-base.css
Normal file
@ -0,0 +1,277 @@
|
||||
/* 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 */
|
||||
|
||||
:root {
|
||||
--scheme-main-ter: var(--main-bg-color);
|
||||
--text-strong-color: var(--button-text-hover);
|
||||
--border-color: rgb(255 255 255 / 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-color: rgba(255, 255, 255, .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-color: rgba(255, 255, 255, .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: rgba(255, 255, 255, .08);
|
||||
color: var(--text-strong-color);
|
||||
}
|
||||
|
||||
/* Side Menu*/
|
||||
.menu-list a:hover {
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
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: rgba(255, 255, 255, .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: rgba(0, 0, 0, .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: rgba(0, 0, 0, .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: rgba(0, 0, 0, .45);
|
||||
}
|
||||
|
||||
.date {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
686
CSS/themes/duplicacy/duplicacy-base.css
Normal file
686
CSS/themes/duplicacy/duplicacy-base.css
Normal file
@ -0,0 +1,686 @@
|
||||
/* 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 {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
a:not(.timeline-content a) {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
a:hover:not(.timeline-content a) {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
a.disabled-link {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
body,
|
||||
.category,
|
||||
.card .labels p,
|
||||
.card .stats,
|
||||
.vis-time-axis .vis-text,
|
||||
.footer .copyright,
|
||||
.navbar-default .navbar-brand,
|
||||
.sidebar .nav li>a,
|
||||
.off-canvas-sidebar .nav li>a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.card label,
|
||||
.card,
|
||||
.card .title {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
label {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.main-panel {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.content .card {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f05050;
|
||||
}
|
||||
|
||||
.text-danger:hover {
|
||||
color: #ec2626;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.text-primary:hover {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
::placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.card {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.col-sm-6 .card,
|
||||
.col-md-12 .card {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.card-container,
|
||||
.col-xs-4 .card,
|
||||
.col-xs-12 .card,
|
||||
.col-xs-8 .card {
|
||||
background: rgb(0 0 0 / 8%) !important;
|
||||
}
|
||||
|
||||
#schedule-0,
|
||||
#schedule-1,
|
||||
#schedule-2,
|
||||
#schedule-3,
|
||||
#schedule-4,
|
||||
#schedule-5,
|
||||
#schedule-6,
|
||||
#schedule-7,
|
||||
#schedule-8,
|
||||
#schedule-9,
|
||||
#schedule-10,
|
||||
#schedule-11,
|
||||
#schedule-12,
|
||||
#schedule-13,
|
||||
#schedule-14,
|
||||
#schedule-15,
|
||||
#schedule-16,
|
||||
#schedule-17,
|
||||
#schedule-18,
|
||||
#schedule-19,
|
||||
#schedule-20,
|
||||
[id*="#schedule-"] {
|
||||
background-color: rgb(0 0 0 / 8%);
|
||||
}
|
||||
|
||||
/* TIMELINE */
|
||||
.vis-timeline {
|
||||
border: 1px solid rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
/* CHARTS */
|
||||
.ct-label {
|
||||
fill: var(--text);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.ct-grid {
|
||||
stroke: var(--text);
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
.vis-labelset .vis-label .vis-inner {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* STORAGE PAGE */
|
||||
.card .nav-tabs>li.active>a,
|
||||
.card .nav-tabs>li.active>a:focus,
|
||||
.card .nav-tabs>li.active>a:hover {
|
||||
color: var(--text);
|
||||
cursor: default;
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border: 1px solid rgba(255, 255, 255, .25);
|
||||
border-bottom-color: #eee;
|
||||
border-radius: 6px 6px 0 0;
|
||||
}
|
||||
|
||||
.card .nav>li>a:hover,
|
||||
.card .nav>li>a:focus {
|
||||
background-color: rgba(255, 255, 255, .07);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: var(--text);
|
||||
}
|
||||
|
||||
.navbar-default {
|
||||
background-color: rgb(0 0 0 / 26%);
|
||||
border-bottom: 1px solid rgb(255 255 255 / 25%);
|
||||
}
|
||||
|
||||
/* SIDEBAR */
|
||||
.sidebar[data-background-color="black"]:after,
|
||||
.sidebar[data-background-color="black"]:before,
|
||||
.off-canvas-sidebar[data-background-color="black"]:after,
|
||||
.off-canvas-sidebar[data-background-color="black"]:before {
|
||||
background: rgb(0 0 0 / 10%);
|
||||
}
|
||||
|
||||
.sidebar[data-background-color="black"] .logo,
|
||||
.off-canvas-sidebar[data-background-color="black"] .logo {
|
||||
border-bottom: 1px solid rgba(var(--accent-color));
|
||||
}
|
||||
|
||||
.sidebar .nav li.active>a:before,
|
||||
.sidebar .nav li.active>a:after {
|
||||
border-right: 17px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
|
||||
.off-canvas-sidebar .nav li.active>a:before,
|
||||
.off-canvas-sidebar .nav li.active>a:after {
|
||||
border-right: 17px solid rgb(var(--accent-color));
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar[data-active-color="success"] .nav li.active>a,
|
||||
.off-canvas-sidebar[data-active-color="success"] .nav li.active>a {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.sidebar .nav li>a:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.modal-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: 1px solid transparent;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
background: var(--modal-header-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;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
border-top: 1px solid rgb(var(--accent-color));
|
||||
background: var(--modal-footer-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;
|
||||
}
|
||||
|
||||
.modal-body .nav-tabs>li.active>a,
|
||||
.nav-tabs>li.active>a:focus,
|
||||
.nav-tabs>li.active>a:hover {
|
||||
color: var(--text);
|
||||
cursor: default;
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border: 1px solid transparent;
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
.modal-body .nav>li>a:hover,
|
||||
.nav>li>a:focus {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.modal-body .nav-tabs>li.active>a:hover {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.modal-body .nav-tabs>li>a:hover {
|
||||
border-color: #fff3 #fff3 #fff3;
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
.modal-body .nav-tabs>li>a {
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
#modal_storage_info_tab_content {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.modal-body .nav .open>a,
|
||||
.nav .open>a:focus,
|
||||
.nav .open>a:hover {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
/* DROPDOWN */
|
||||
.dropdown-menu {
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.dropdown a:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control.border-input {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.form-control,
|
||||
textarea {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
}
|
||||
|
||||
.form-control[disabled],
|
||||
.form-control[readonly],
|
||||
fieldset[disabled] .form-control {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
#input_s3_provider:focus,
|
||||
#schedule_frequency:focus,
|
||||
#modal_restore_storage:focus,
|
||||
#modal_restore_id:focus,
|
||||
#modal_restore_revision:focus,
|
||||
#job_type:focus,
|
||||
#job_repository:focus,
|
||||
#backup_storage:focus,
|
||||
#administration_expiration:focus {
|
||||
background: white;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.form-check-label {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn {
|
||||
color: var(--button-text);
|
||||
border-width: 1px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.main-panel .btn:hover,
|
||||
.main-panel .btn:focus {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.timepicker-spinner .btn:hover,
|
||||
.timepicker-spinner .btn:focus {
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
color: var(--text-hover);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.timepicker-spinner .btn {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.timepicker-spinner .input-group-btn-vertical {
|
||||
border-left: 1px solid transparent;
|
||||
}
|
||||
|
||||
.btn-info.btn-fill {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-info.btn-fill:hover,
|
||||
.btn-info.btn-fill:active,
|
||||
.btn-info.btn-fill.active,
|
||||
.btn-info.btn-fill:focus {
|
||||
background: var(--button-color-hover);
|
||||
border: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
border-color: var(--button-color);
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-primary:focus,
|
||||
.btn-primary:active:focus {
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary.btn-fill {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary.btn-fill:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
|
||||
}
|
||||
|
||||
div>div>div.modal-footer>button.btn.btn-default.pull-left,
|
||||
.navbar .navbar-nav>li>a.btn-danger.btn-fill,
|
||||
.btn-danger.btn-fill {
|
||||
border-color: #f05050;
|
||||
background-color: #f05050;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
div>div>div.modal-footer>button.btn.btn-default.pull-left:hover,
|
||||
div>div>div.modal-footer>button.btn.btn-default.pull-left:focus,
|
||||
.navbar .navbar-nav>li>a.btn-danger.btn-fill:hover,
|
||||
.navbar .navbar-nav>li>a.btn-danger.btn-fill:focus,
|
||||
.btn-danger.btn-fill:hover,
|
||||
.btn-danger.btn-fill:focus {
|
||||
border-color: #ec2626;
|
||||
color: #fff;
|
||||
background-color: #ec2626;
|
||||
}
|
||||
|
||||
div.bootbox.modal.fade.bootbox-confirm.in>div>div>div.modal-footer>button.btn.btn-default {
|
||||
border-color: #f05050;
|
||||
background-color: #f05050;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
div.bootbox.modal.fade.bootbox-confirm.in>div>div>div.modal-footer>button.btn.btn-default:hover,
|
||||
div.bootbox.modal.fade.bootbox-confirm.in>div>div>div.modal-footer>button.btn.btn-default:focus {
|
||||
border-color: #ec2626;
|
||||
color: #fff;
|
||||
background-color: #ec2626;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.navbar .navbar-nav>li>a.btn-success,
|
||||
.btn-success {
|
||||
border-color: var(--button-color);
|
||||
color: var(--button-color);
|
||||
}
|
||||
|
||||
.navbar .navbar-nav>li>a.btn-success:hover,
|
||||
.navbar .navbar-nav>li>a.btn-success:focus,
|
||||
.navbar .navbar-nav>li>a.btn-success:active,
|
||||
.navbar .navbar-nav>li>a.btn-success.active,
|
||||
.open>.navbar .navbar-nav>li>a.btn-success.dropdown-toggle,
|
||||
.btn-success:hover,
|
||||
.btn-success:focus,
|
||||
.btn-success:active,
|
||||
.btn-success.active,
|
||||
.open>.btn-success.dropdown-toggle {
|
||||
background-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-icon {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.btn-icon.active.focus,
|
||||
.btn-icon.active:focus,
|
||||
.btn-icon.active:hover,
|
||||
.btn-icon:active.focus,
|
||||
.btn-icon:active:focus,
|
||||
.btn-icon:active:hover,
|
||||
.btn-icon:hover,
|
||||
.btn-icon:focus,
|
||||
.btn-icon:active,
|
||||
.btn-icon.active,
|
||||
.open>.dropdown-toggle.btn-icon.focus,
|
||||
.open>.dropdown-toggle.btn-icon:focus,
|
||||
.open>.dropdown-toggle.btn-icon:hover {
|
||||
background-color: var(--accent-color-hover) !important;
|
||||
color: var(--label-text-color);
|
||||
border-color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.radio-box input:checked~.radio-button {
|
||||
background-color: var(--button-color);
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
.table>tbody>tr.active>td,
|
||||
.table>tbody>tr.active>th,
|
||||
.table>tbody>tr>td.active,
|
||||
.table>tbody>tr>th.active,
|
||||
.table>tfoot>tr.active>td,
|
||||
.table>tfoot>tr.active>th,
|
||||
.table>tfoot>tr>td.active,
|
||||
.table>tfoot>tr>th.active,
|
||||
.table>thead>tr.active>td,
|
||||
.table>thead>tr.active>th,
|
||||
.table>thead>tr>td.active,
|
||||
.table>thead>tr>th.active,
|
||||
.row-clickable.active {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.fixed-header th {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.table thead tr>th,
|
||||
.table thead tr>td,
|
||||
.table tbody tr>th,
|
||||
.table tbody tr>td,
|
||||
.table tfoot tr>th,
|
||||
.table tfoot tr>td {
|
||||
border-top: 1px solid rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.list-group-item.active,
|
||||
.list-group-item.active:focus,
|
||||
.list-group-item.active:hover {
|
||||
background-color: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* PROGRESS BARS */
|
||||
.progress {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.progress span {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
.main-panel>.footer {
|
||||
background: rgb(0 0 0 / 0.25);
|
||||
}
|
||||
|
||||
/* MOBILE */
|
||||
@media (max-width: 991px) {
|
||||
.off-canvas-sidebar .sidebar-wrapper {
|
||||
box-shadow: 0 0 10px 0px #000000;
|
||||
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;
|
||||
}
|
||||
|
||||
.off-canvas-sidebar .nav li.active>a:before,
|
||||
.off-canvas-sidebar .nav>li.active>a:after {
|
||||
border-left: 17px solid rgb(var(--accent-color));
|
||||
}
|
||||
}
|
||||
350
CSS/themes/duplicati/duplicati-base.css
Normal file
350
CSS/themes/duplicati/duplicati-base.css
Normal file
@ -0,0 +1,350 @@
|
||||
@import url("https://theme-park.dev/CSS/defaults/placeholders.css");
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
body .container .header {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
body .container .footer {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.mainmenu {
|
||||
background: initial;
|
||||
}
|
||||
|
||||
.mainmenu ul li a {
|
||||
background-color: initial !important;
|
||||
}
|
||||
|
||||
.mainmenu ul li a.active {
|
||||
background-color: initial !important;
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
body .container .header .action-icons>.pause,
|
||||
body .container .header .action-icons-small>.pause {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/pause.png);
|
||||
}
|
||||
|
||||
body .container .header .action-icons>.throttle,
|
||||
body .container .header .action-icons-small>.throttle {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/throttle.png);
|
||||
}
|
||||
|
||||
body .container .body .content div.add .steps .step.active span,
|
||||
body .container .body .content div.restore .steps .step.active span {
|
||||
border: 4px var(--button-color) solid;
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
body .container .body .content div.add .steps-legend li.active,
|
||||
body .container .body .content div.restore .steps-legend li.active {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
body .container .body .content div.add .steps .step span,
|
||||
body .container .body .content div.restore .steps .step span {
|
||||
display: block;
|
||||
border: 4px var(--button-color) solid;
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
body .container .body .content div.add .steps-legend li,
|
||||
body .container .body .content div.restore .steps-legend li {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
body .container .body .content div.add .steps .step,
|
||||
body .container .body .content div.restore .steps .step {
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
a,
|
||||
a span:not(.tabs>li>a>span):not(.buttons>a>span),
|
||||
body .container .body a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a span:hover:not(.tabs>li>a>span):not(.buttons>a>span) {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
body .container .header a {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
body .container .header a:hover {
|
||||
color: var(--accent-color-hover)
|
||||
}
|
||||
|
||||
.taskmenu dt {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
dt {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
dd {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.tasklist dd a,
|
||||
.tasklist dd p {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
.tasklist dd a:hover,
|
||||
.tasklist dd p:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.action-icons {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.submit {
|
||||
color: var(--button-text) !important;
|
||||
background: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.submit:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
background: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
form.styled input,
|
||||
form.styled textarea,
|
||||
form.styled select,
|
||||
form.styled .input.select select {
|
||||
color: var(--text);
|
||||
border: none;
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
form.styled input:focus,
|
||||
form.styled textarea:focus {
|
||||
color: var(--text-hover);
|
||||
border: none;
|
||||
background: rgba(0, 0, 0, .45);
|
||||
}
|
||||
|
||||
select:focus,
|
||||
form.styled select:focus,
|
||||
form.styled .input.select select:focus {
|
||||
background: #1f1f1f;
|
||||
color: var(--text-hover);
|
||||
border: none;
|
||||
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
body .container .header .state {
|
||||
background: rgb(var(--accent-color), .1);
|
||||
color: var(--text);
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* DROP DOWN MENU */
|
||||
@media (max-width:1150px),
|
||||
(max-width:1150px) and (min-resolution:192dpi),
|
||||
(max-width:1150px) and (min-resolution:1.25dppx) {
|
||||
body .container .body .mainmenu {
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
body .container .body .contextmenu {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background: var(--drop-down-menu-bg);
|
||||
border: 1px rgba(255, 255, 255, 0.1) solid;
|
||||
box-shadow: 0 4px 8px rgb(0 0 0 / 30%);
|
||||
z-index: 200;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
body .container .body .contextmenu li a:hover {
|
||||
background: rgba(255, 255, 255, 0.25);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
body .container .body .mainmenu>ul>li>a.home {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/home.png) no-repeat 8px 7px;
|
||||
}
|
||||
|
||||
body .container .body .mainmenu>ul>li>a.add {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/add.png) no-repeat 8px 7px;
|
||||
}
|
||||
|
||||
body .container .body .mainmenu>ul>li>a.restore {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/restore.png) no-repeat 8px 7px;
|
||||
}
|
||||
|
||||
body .container .body .mainmenu>ul>li>a.settings {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/settings.png) no-repeat 8px 7px;
|
||||
}
|
||||
|
||||
body .container .body .mainmenu>ul>li>a.about {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/about.png) no-repeat 8px 7px;
|
||||
}
|
||||
|
||||
body .container .body .mainmenu>ul>li>a.logout {
|
||||
background: url(https://theme-park.dev/Resources/duplicati/logout.png) no-repeat 8px 7px;
|
||||
}
|
||||
|
||||
#threedotmenu_add_destination>ul>li>a>span {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
|
||||
/* MODAL */
|
||||
|
||||
div.connection-lost div.title,
|
||||
div.modal-dialog div.title {
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background: var(--modal-bg-color);
|
||||
border-radius: 5px 5px 0 0;
|
||||
padding: 10px 20px;
|
||||
font-weight: bold;
|
||||
color: var(--text);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
div.connection-lost div.content,
|
||||
div.modal-dialog div.content {
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background: var(--modal-bg-color);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
#login-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button,
|
||||
form.styled .buttons input,
|
||||
form.styled .buttons a {
|
||||
display: block;
|
||||
background: var(--button-color);
|
||||
color: var(--button-text) !important;
|
||||
padding: 5px 15px;
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
width: auto;
|
||||
border: none;
|
||||
font-family: 'Clear Sans', sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 300;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.button:hover,
|
||||
form.styled .buttons input:hover,
|
||||
form.styled .buttons a:hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
ul.tabs>li.active>a {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
ul.tabs>li.active {
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
|
||||
ul.tabs>li {
|
||||
display: inline;
|
||||
margin-right: 10px;
|
||||
border: 1px solid var(--button-color);
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
/* FOLDER TREE*/
|
||||
.tree-view li div.selected {
|
||||
border-color: rgba(255, 255, 255, .1);
|
||||
background-color: rgba(252, 252, 252, .25);
|
||||
}
|
||||
|
||||
|
||||
/* PROGRESS BAR */
|
||||
body .container .header .state .progress-bar {
|
||||
background: rgba(var(--accent-color), 0.25);
|
||||
}
|
||||
|
||||
/* LOGIN */
|
||||
#login h2 {
|
||||
background: rgba(255, 255, 255, .15);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
#login fieldset p {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#login fieldset {
|
||||
background-color: rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
#login fieldset input[type="submit"] {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
#login fieldset input[type="submit"]:hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
#login fieldset input[type="email"],
|
||||
#login fieldset input[type="password"] {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
color: var(--text);
|
||||
}
|
||||
747
CSS/themes/emby/emby-base.css
Normal file
747
CSS/themes/emby/emby-base.css
Normal file
@ -0,0 +1,747 @@
|
||||
:root {
|
||||
--theme-primary-color: var(--accent-color);
|
||||
--theme-text-color: var(--text);
|
||||
--theme-text-color-opaque: var(--text-hover);
|
||||
--theme-accent-text-color: var(--accent-color);
|
||||
--theme-primary-color-lightened: var(--accent-color-hover);
|
||||
--theme-icon-focus-background: rgba(var(--accent-color), 0.2);
|
||||
|
||||
--theme-background: var(--main-bg-color);
|
||||
--header-blur-background: rgba(20,20,20,0.66);
|
||||
--drawer-background: #2C2C2E;
|
||||
--docked-drawer-background: rgba(0, 0, 0, 0.25);
|
||||
--button-background: var(--button-color);
|
||||
--card-background: rgba(0, 0, 0, 0.15);
|
||||
--footer-background: var(--modal-footer-color);
|
||||
--footer-blur-background: rgba(29,29,31,0.66);
|
||||
|
||||
--header-background: var(--theme-background);
|
||||
--theme-body-secondary-text-color: rgba(255, 255, 255, .6);
|
||||
--line-background: rgba(255, 255, 255, .08);
|
||||
--line-size: .08em;
|
||||
--scrollbar-thumb-background: rgba(255,255,255,.3);
|
||||
}
|
||||
|
||||
@media (pointer: fine) {
|
||||
:not(.layout-tv):root {
|
||||
--theme-background: var(--main-bg-color);
|
||||
--header-blur-background: rgba(20,20,20,0.66);
|
||||
--drawer-background: #2C2C2E;
|
||||
--docked-drawer-background: rgba(0, 0, 0, 0.25);
|
||||
--button-background: #1f1f1f;
|
||||
--card-background: rgba(0, 0, 0, 0.15);
|
||||
--footer-background: var(--modal-footer-color);
|
||||
--footer-blur-background: rgba(29,29,31,0.66);
|
||||
}
|
||||
}
|
||||
|
||||
.layout-tv:root {
|
||||
--theme-background: var(--main-bg-color);
|
||||
--header-blur-background: rgba(20,20,20,0.66);
|
||||
--drawer-background: #2C2C2E;
|
||||
--docked-drawer-background: rgba(0, 0, 0, 0.25);
|
||||
--button-background: #1f1f1f;
|
||||
--card-background: rgba(0, 0, 0, 0.15);
|
||||
--footer-background: var(--modal-footer-color);
|
||||
--footer-blur-background: rgba(29,29,31,0.66);
|
||||
}
|
||||
|
||||
/*TP CUSTOM */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.inputLabel,
|
||||
label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
a:not(.emby-button),
|
||||
.cardText.cardTextCentered.cardText-first>button {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
a:hover:not(.emby-button),
|
||||
.cardText.cardTextCentered.cardText-first>button:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
/*TP END*/
|
||||
|
||||
html {
|
||||
color: var(--theme-text-color);
|
||||
scrollbar-color: var(--scrollbar-thumb-background) transparent
|
||||
}
|
||||
|
||||
.emby-collapsible-button {
|
||||
border-color: var(--line-background) !important
|
||||
}
|
||||
|
||||
.skinHeader-withBackground.skinHeader-withfulldrawer {
|
||||
border-bottom: .08em solid var(--line-background)
|
||||
}
|
||||
|
||||
.skinHeader-withBackground {
|
||||
background: var(--header-background);
|
||||
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;
|
||||
}
|
||||
|
||||
.appfooter,
|
||||
.formDialogFooter:not(.formDialogFooter-clear) {
|
||||
background: var(--footer-background);
|
||||
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;
|
||||
}
|
||||
|
||||
.formDialogHeader:not(.formDialogHeader-clear) {
|
||||
background: var(--modal-header-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;
|
||||
}
|
||||
|
||||
.dialog {
|
||||
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;
|
||||
}
|
||||
|
||||
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
|
||||
.skinHeader-withBackground {
|
||||
background: var(--header-blur-background);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em)
|
||||
}
|
||||
|
||||
.appfooter-withbackdropfilter {
|
||||
background: var(--footer-blur-background);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em)
|
||||
}
|
||||
}
|
||||
|
||||
.skinHeader.semiTransparent {
|
||||
-webkit-backdrop-filter: none !important;
|
||||
backdrop-filter: none !important;
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0)));
|
||||
background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
|
||||
background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
|
||||
background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
border-bottom: 0;
|
||||
color: rgba(255, 255, 255, .87)
|
||||
}
|
||||
|
||||
.pageTitleWithDefaultLogo {
|
||||
background-image: url(https://theme-park.dev/Resources/emby/logowhite.png)
|
||||
}
|
||||
|
||||
.backgroundContainer,
|
||||
html {
|
||||
background: var(--theme-background);
|
||||
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;
|
||||
}
|
||||
|
||||
.backgroundContainer.withBackdrop {
|
||||
background-color: rgba(0, 0, 0, .83)
|
||||
}
|
||||
|
||||
@media not all and (min-width: 50em) {
|
||||
.itemBackgroundContainer.withBackdrop {
|
||||
background: var(--theme-background);
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
.paper-icon-button-light-tv:focus,
|
||||
.paper-icon-button-light:active {
|
||||
color: rgb(var(--theme-primary-color));
|
||||
background-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
|
||||
@media(hover: hover) and (pointer:fine) {
|
||||
.paper-icon-button-light:focus {
|
||||
color: rgb(var(--theme-primary-color));
|
||||
background-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
}
|
||||
|
||||
.detailButton-icon,
|
||||
.fab,
|
||||
.raised:not(.raised-mini) {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.detailButton-icon {
|
||||
border-color: rgba(255, 255, 255, .3)
|
||||
}
|
||||
|
||||
.emby-select-withcolor {
|
||||
color: inherit;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border: var(--line-size) solid transparent
|
||||
}
|
||||
|
||||
.toast {
|
||||
background: var(--button-background);
|
||||
color: var(--theme-text-color)
|
||||
}
|
||||
|
||||
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
|
||||
|
||||
.detailButton-icon,
|
||||
.emby-select-withcolor.detailTrackSelect,
|
||||
.fab,
|
||||
.raised:not(.nobackdropfilter) {
|
||||
background: rgba(85, 85, 85, .3);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em)
|
||||
}
|
||||
|
||||
.dialog-blur,
|
||||
.toast {
|
||||
color: #fff;
|
||||
background: rgba(56, 56, 56, .76);
|
||||
-webkit-backdrop-filter: blur(2.5em) saturate(1.8);
|
||||
backdrop-filter: blur(2.5em) saturate(1.8);
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important
|
||||
}
|
||||
|
||||
.toast-large {
|
||||
color: rgba(255, 255, 255, .87)
|
||||
}
|
||||
}
|
||||
|
||||
.fab:focus,
|
||||
.raised:focus {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.button-submit:not(.emby-button-tv) {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text)
|
||||
}
|
||||
|
||||
.button-submit:not(.emby-button-tv):focus,
|
||||
.button-submit:not(.emby-button-tv):hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover)
|
||||
}
|
||||
|
||||
.emby-select-withcolor>option {
|
||||
color: inherit;
|
||||
background: var(--button-background)
|
||||
}
|
||||
|
||||
.emby-select-withcolor:focus {
|
||||
border-color: rgb(var(--theme-primary-color)) !important
|
||||
}
|
||||
|
||||
.emby-select-tv-withcolor:focus {
|
||||
background-color: rgb(var(--theme-primary-color)) !important;
|
||||
color: #fff !important
|
||||
}
|
||||
|
||||
.checkboxLabel {
|
||||
color: inherit
|
||||
}
|
||||
|
||||
.emby-checkbox-focusring:focus:before {
|
||||
background-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
|
||||
.inputLabelFocused,
|
||||
.selectLabelFocused,
|
||||
.textareaLabelFocused {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.button-link {
|
||||
color: var(--link-color)
|
||||
}
|
||||
|
||||
.button-flat-accent {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.paperList,
|
||||
.visualCardBox {
|
||||
background-color: var(--card-background)
|
||||
}
|
||||
|
||||
.collapseContent {
|
||||
border: var(--line-size) solid var(--line-background)
|
||||
}
|
||||
|
||||
.fieldDescription,
|
||||
.listItemBodyText-secondary,
|
||||
.secondaryText {
|
||||
color: var(--theme-body-secondary-text-color)
|
||||
}
|
||||
|
||||
.cardText-secondary {
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.cardText-first {
|
||||
color: var(--theme-text-color-opaque)
|
||||
}
|
||||
|
||||
.actionsheetDivider {
|
||||
background: var(--line-background)
|
||||
}
|
||||
|
||||
@media(hover: hover) and (pointer:fine) {
|
||||
.actionSheetMenuItem:hover {
|
||||
background-color: rgba(255, 255, 255, .2)
|
||||
}
|
||||
}
|
||||
|
||||
.selectionCommandsPanel {
|
||||
background: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.itemSelectionCount {
|
||||
color: var(--label-text-color) !important;
|
||||
|
||||
}
|
||||
|
||||
.upNextDialog-countdownText {
|
||||
color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.alphaPickerButton {
|
||||
color: var(--theme-body-secondary-text-color);
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.alphaPickerButton-selected {
|
||||
color: var(--theme-text-color-opaque)
|
||||
}
|
||||
|
||||
.alphaPickerButton-tv:focus {
|
||||
background-color: rgb(var(--theme-primary-color));
|
||||
color: #fff !important
|
||||
}
|
||||
|
||||
.detailTableBodyRow-shaded:nth-child(even) {
|
||||
background: #1c1c1c;
|
||||
background: rgba(30, 30, 30, .9)
|
||||
}
|
||||
|
||||
.listItem-border {
|
||||
border-color: var(--line-background) !important
|
||||
}
|
||||
|
||||
.listItem-focusscale:focus {
|
||||
background: rgba(54, 54, 54, .8)
|
||||
}
|
||||
|
||||
.progressring-spiner {
|
||||
border-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.mediaInfoText {
|
||||
background: var(--button-background)
|
||||
}
|
||||
|
||||
.starIcon {
|
||||
color: #cb272a
|
||||
}
|
||||
|
||||
.mediaInfoTimerIcon {
|
||||
color: #cb272a
|
||||
}
|
||||
|
||||
.emby-input,
|
||||
.emby-textarea {
|
||||
color: inherit;
|
||||
background: rgb(0 0 0 / 25%);
|
||||
border: var(--line-size) solid rgba(255, 255, 255, 0.1)
|
||||
}
|
||||
|
||||
.emby-input:focus,
|
||||
.emby-textarea:focus {
|
||||
border-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span:before {
|
||||
border-color: currentColor
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span:before {
|
||||
border-color: rgb(var(--theme-primary-color)) !important;
|
||||
background-color: rgb(var(--theme-primary-color)) !important;
|
||||
|
||||
}
|
||||
|
||||
.checkboxLabel::after {
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.itemProgressBarForeground {
|
||||
background-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.itemProgressBarForeground-recording {
|
||||
background-color: #cb272a
|
||||
}
|
||||
|
||||
.countIndicator {
|
||||
background: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.playedIndicator {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.mainDrawer {
|
||||
background: var(--drawer-background)
|
||||
}
|
||||
|
||||
.drawer-docked {
|
||||
background: var(--docked-drawer-background);
|
||||
border-right: var(--line-size) solid var(--line-background)
|
||||
}
|
||||
|
||||
@media(hover: hover) and (pointer:fine) {
|
||||
.navMenuOption:hover {
|
||||
background: #303030
|
||||
}
|
||||
}
|
||||
|
||||
.navMenuOption-selected {
|
||||
background-color: var(--theme-icon-focus-background) !important;
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.emby-button-focusscale:focus,
|
||||
.emby-button-focusscale:focus .detailButton-icon {
|
||||
background: rgb(var(--theme-primary-color));
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.emby-tab-button {
|
||||
color: var(--theme-body-secondary-text-color)
|
||||
}
|
||||
|
||||
.emby-tab-button-active {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.emby-tab-button-active.emby-button-tv {
|
||||
color: var(--theme-text-color-opaque)
|
||||
}
|
||||
|
||||
.emby-tab-button.emby-button-tv:focus {
|
||||
color: rgb(var(--accent-color));
|
||||
background: 0 0
|
||||
}
|
||||
|
||||
.emby-button {
|
||||
outline-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.channelCell,
|
||||
.guide-headerTimeslots,
|
||||
.timeslotHeaders {
|
||||
background: var(--theme-background);
|
||||
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;
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
.channelCell-mobilefocus {
|
||||
background: var(--theme-background) !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;
|
||||
}
|
||||
}
|
||||
|
||||
.channelCell-mobilefocus:not(:focus-visible) {
|
||||
background: var(--theme-background) !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;
|
||||
}
|
||||
|
||||
.channelCell-mobilefocus:not(:-moz-focusring) {
|
||||
background: var(--theme-background) !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;
|
||||
}
|
||||
|
||||
.channelCell,
|
||||
.epgRow,
|
||||
.programCell {
|
||||
border-color: rgba(255, 255, 255, .05)
|
||||
}
|
||||
|
||||
.guide-currentTimeIndicatorDot {
|
||||
border-right-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
|
||||
.guide-currentTimeIndicatorDot:after {
|
||||
border-top-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.firstChannelCell {
|
||||
border-color: transparent
|
||||
}
|
||||
|
||||
.programCell-sports {
|
||||
background: #3949ab !important
|
||||
}
|
||||
|
||||
.programCell-movie {
|
||||
background: #5e35b1 !important
|
||||
}
|
||||
|
||||
.programCell-kids {
|
||||
background: #039be5 !important
|
||||
}
|
||||
|
||||
.programCell-news {
|
||||
background: #43a047 !important
|
||||
}
|
||||
|
||||
.channelCell:focus,
|
||||
.programCell:focus {
|
||||
background-color: rgb(var(--theme-primary-color));
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.guide-programTextIcon {
|
||||
color: #1e1e1e;
|
||||
background: #555
|
||||
}
|
||||
|
||||
.infoBanner {
|
||||
background: var(--card-background);
|
||||
padding: 1em;
|
||||
-webkit-border-radius: .3em;
|
||||
border-radius: .3em
|
||||
}
|
||||
|
||||
.ratingbutton-icon-withrating {
|
||||
color: #c33 !important
|
||||
}
|
||||
|
||||
.downloadbutton-icon-on {
|
||||
color: #4285f4
|
||||
}
|
||||
|
||||
.downloadbutton-icon-complete {
|
||||
color: #4285f4
|
||||
}
|
||||
|
||||
.playstatebutton-icon-played {
|
||||
color: #c33 !important
|
||||
}
|
||||
|
||||
.repeatButton-active {
|
||||
color: #4285f4
|
||||
}
|
||||
|
||||
.card:focus .card-focuscontent {
|
||||
border-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.cardContent-button {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.cardContent-shadow {
|
||||
background-color: var(--card-background)
|
||||
}
|
||||
|
||||
.defaultCardBackground0 {
|
||||
background-color: var(--card-background)
|
||||
}
|
||||
|
||||
.defaultCardBackground1 {
|
||||
background-color: #d2b019
|
||||
}
|
||||
|
||||
.defaultCardBackground2 {
|
||||
background-color: #338abb
|
||||
}
|
||||
|
||||
.defaultCardBackground3 {
|
||||
background-color: #6b689d
|
||||
}
|
||||
|
||||
.defaultCardBackground4 {
|
||||
background-color: #dd452b
|
||||
}
|
||||
|
||||
.defaultCardBackground5 {
|
||||
background-color: #5ccea9
|
||||
}
|
||||
|
||||
.cardOverlayButtonIcon {
|
||||
background-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.cardScalable.cardPadder-portrait>div>button>i {
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track-piece {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--scrollbar-thumb-background)
|
||||
}
|
||||
|
||||
.emby-slider-background {
|
||||
background: var(--scrollbar-thumb-background)
|
||||
}
|
||||
|
||||
.emby-slider {
|
||||
color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-moz-range-track {
|
||||
background: #444
|
||||
}
|
||||
|
||||
.emby-slider::-moz-range-progress {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-webkit-slider-thumb {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-moz-range-thumb {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-ms-thumb {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider-background-lower {
|
||||
background-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.scrollbuttoncontainer {
|
||||
color: #fff;
|
||||
background: rgba(20, 20, 20, .5)
|
||||
}
|
||||
|
||||
.recordingIcon-active {
|
||||
color: #c33 !important
|
||||
}
|
||||
|
||||
.drawerLogo {
|
||||
background-image: url(https://theme-park.dev/Resources/emby/logowhite.png);
|
||||
border-bottom-color: var(--line-background)
|
||||
}
|
||||
|
||||
.searchTabsContainer {
|
||||
border-bottom: var(--line-size) solid var(--line-background)
|
||||
}
|
||||
|
||||
.emby-search-tab-button.emby-tab-button-active {
|
||||
background: rgb(var(--accent-color)) !important
|
||||
}
|
||||
|
||||
.textActionButton.dragging {
|
||||
background: var(--button-background) !important
|
||||
}
|
||||
|
||||
.dragging-over.full-drop-target {
|
||||
background: rgb(var(--theme-primary-color)) !important;
|
||||
color: #fff !important
|
||||
}
|
||||
|
||||
.dragging-over-top:before {
|
||||
background: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.dragging-over-bottom:after {
|
||||
background: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
.navMenuOption:hover:not(.navMenuOption-selected) {
|
||||
background: 0 !important;
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.mainDrawer {
|
||||
background: var(--header-blur-background);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
}
|
||||
|
||||
.jstree-default .jstree-clicked {
|
||||
background: rgb(var(--accent-color));
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
684
CSS/themes/filebrowser/filebrowser-base.css
Normal file
684
CSS/themes/filebrowser/filebrowser-base.css
Normal file
@ -0,0 +1,684 @@
|
||||
/* 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 */
|
||||
|
||||
/* PLACEHOLDERS */
|
||||
input::-webkit-input-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus::-webkit-input-placeholder {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Firefox < 19 */
|
||||
input:-moz-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus:-moz-placeholder {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Firefox > 19 */
|
||||
input::-moz-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus::-moz-placeholder {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Internet Explorer 10 */
|
||||
input:-ms-input-placeholder {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input:focus:-ms-input-placeholder {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.message {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
#login {
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
body {
|
||||
|
||||
color: var(--text);
|
||||
font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
th {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
#login input[type=password],
|
||||
#login input[type=text] {
|
||||
color: var(--text-hover) !important;
|
||||
background-color: rgba(0, 0, 0, 0.15) !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#loading {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
#loading .spinner * {
|
||||
background-color: #FFF !important;
|
||||
}
|
||||
|
||||
html {
|
||||
min-height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
@media (max-width: 736px) {
|
||||
|
||||
nav,
|
||||
nav.active {
|
||||
background: var(--modal-bg-color) !important;
|
||||
}
|
||||
|
||||
#dropdown.active {
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
background: rgba(0, 0, 0, .45);
|
||||
height: 100%;
|
||||
top: 64px;
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.overlay:not(nav) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
nav .action {
|
||||
color: var(--text);
|
||||
font-size: 13px;
|
||||
font-family: Open Sans Semibold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
padding-top: 0px;
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
|
||||
nav .action:hover {
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
nav>div {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
header {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
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-bottom: transparent;
|
||||
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
header>div:first-child {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
body {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.shell {
|
||||
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;
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.shell__prompt i {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.action {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
#listing.list .item {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
color: var(--text);
|
||||
border: none;
|
||||
}
|
||||
|
||||
#listing.list .item:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
color: var(--text-hover);
|
||||
border: none;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
#listing.list .item.header {
|
||||
background-color: rgba(0, 0, 0, .45);
|
||||
color: var(--text-hover);
|
||||
border-bottom: none;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.material-icons,
|
||||
.prompt .file-list ul li:before {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.action:hover {
|
||||
background-color: rgba(var(--accent-color), .1);
|
||||
}
|
||||
|
||||
.action .counter {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
border: 2px solid var(--label-text-color);
|
||||
}
|
||||
|
||||
.share__box {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.share__box__info {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.share__box__download {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--text-hover);
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.share__box__element {
|
||||
border-top: 1px solid rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
#listing.list .item div:first-of-type i {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#listing .item i {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#listing.mosaic:hover .item:hover i:hover {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
#listing .item[aria-selected=true] {
|
||||
background-color: rgba(255, 255, 255, 0.2) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
#listing h2 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#listing #multiple-selection {
|
||||
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;
|
||||
}
|
||||
|
||||
#breadcrumbs span a {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#breadcrumbs {
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#listing .item {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
color: var(--text);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.input {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
select>option {
|
||||
background: #1f1f1f;
|
||||
}
|
||||
|
||||
#search #input {
|
||||
background: #fff;
|
||||
display: flex;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#search #result {
|
||||
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;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#search .boxes {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
#search .boxes h3 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#search .boxes>div>div {
|
||||
background-color: rgba(0, 0, 0, .10);
|
||||
}
|
||||
|
||||
#search .boxes>div>div:hover {
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
#search.active #input {
|
||||
background: var(--main-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;
|
||||
height: 60px;
|
||||
color: black;
|
||||
}
|
||||
|
||||
#search.active i,
|
||||
#search.active input {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#search #result>div>:first-child {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
.card h3 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.card#share ul li a {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
select {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.card#share .input-group * {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
select,
|
||||
button {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.collapsible>label * {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
a,
|
||||
.link,
|
||||
.breadcrumbs span a,
|
||||
.breadcrumbs,
|
||||
.breadcrumbs span {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.link:hover,
|
||||
.breadcrumbs span a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
table th {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.card.floating {
|
||||
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;
|
||||
}
|
||||
|
||||
#search #input {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#listing.mosaic .item {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
#listing.mosaic .item:hover {
|
||||
box-shadow: none !important;
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.dashboard p label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dashboard #nav li.active {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dashboard #nav ul li.active {
|
||||
border-color: rgb(var(--accent-color));
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dashboard #nav ul li.active:before {
|
||||
background: rgb(var(--accent-color));
|
||||
opacity: .08;
|
||||
}
|
||||
|
||||
.dashboard #nav ul li:hover {
|
||||
background: rgb(var(--accent-color), .15);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dashboard #nav .wrapper {
|
||||
border-bottom: 2px solid var(--accent-color-hover);
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
main {
|
||||
margin-left: 270px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
nav {
|
||||
width: 175px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.button:not(.button--flat.button--red) {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.button:hover:not(.button--flat.button--red),
|
||||
.button:active:not(.button--flat.button--red),
|
||||
.button:focus:not(.button--flat.button--red) {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
button:hover:not(.action),
|
||||
input[type=submit]:hover {
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.button--flat {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.button--flat:hover {
|
||||
background: var(--dark-red);
|
||||
color: #FFF;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
|
||||
#editor-container {
|
||||
background: var(--modal-bg-color);
|
||||
}
|
||||
|
||||
/* ACE EDITOR */
|
||||
|
||||
.ace-chrome .ace_gutter {
|
||||
background: #282a36 !important;
|
||||
color: rgb(144, 145, 148) !important;
|
||||
}
|
||||
|
||||
.ace-chrome .ace_print-margin {
|
||||
width: 1px;
|
||||
background: #44475a
|
||||
}
|
||||
|
||||
.ace-chrome {
|
||||
background-color: #282a36;
|
||||
color: #f8f8f2
|
||||
}
|
||||
|
||||
.ace-chrome .ace_cursor {
|
||||
color: #f8f8f0
|
||||
}
|
||||
|
||||
.ace-chrome .ace_marker-layer .ace_selection {
|
||||
background: #44475a
|
||||
}
|
||||
|
||||
.ace-chrome.ace_multiselect .ace_selection.ace_start {
|
||||
box-shadow: 0 0 3px 0px #282a36;
|
||||
border-radius: 2px
|
||||
}
|
||||
|
||||
.ace-chrome .ace_marker-layer .ace_step {
|
||||
background: rgb(198, 219, 174)
|
||||
}
|
||||
|
||||
.ace-chrome .ace_marker-layer .ace_bracket {
|
||||
margin: -1px 0 0 -1px;
|
||||
border: 1px solid #a29709
|
||||
}
|
||||
|
||||
.ace-chrome .ace_marker-layer .ace_active-line {
|
||||
background: #44475a
|
||||
}
|
||||
|
||||
.ace-chrome .ace_gutter-active-line {
|
||||
background-color: #44475a
|
||||
}
|
||||
|
||||
.ace-chrome .ace_marker-layer .ace_selected-word {
|
||||
box-shadow: 0px 0px 0px 1px #a29709;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.ace-chrome .ace_fold {
|
||||
background-color: #50fa7b;
|
||||
border-color: #f8f8f2
|
||||
}
|
||||
|
||||
.ace-chrome .ace_keyword {
|
||||
color: #ff79c6
|
||||
}
|
||||
|
||||
.ace-chrome .ace_constant.ace_language {
|
||||
color: #bd93f9
|
||||
}
|
||||
|
||||
.ace-chrome .ace_constant.ace_numeric {
|
||||
color: #bd93f9
|
||||
}
|
||||
|
||||
.ace-chrome .ace_constant.ace_character {
|
||||
color: #bd93f9
|
||||
}
|
||||
|
||||
.ace-chrome .ace_constant.ace_character.ace_escape {
|
||||
color: #ff79c6
|
||||
}
|
||||
|
||||
.ace-chrome .ace_constant.ace_other {
|
||||
color: #bd93f9
|
||||
}
|
||||
|
||||
.ace-chrome .ace_support.ace_function {
|
||||
color: #8be9fd
|
||||
}
|
||||
|
||||
.ace-chrome .ace_support.ace_constant {
|
||||
color: #6be5fd
|
||||
}
|
||||
|
||||
.ace-chrome .ace_support.ace_class {
|
||||
font-style: italic;
|
||||
color: #66d9ef
|
||||
}
|
||||
|
||||
.ace-chrome .ace_support.ace_type {
|
||||
font-style: italic;
|
||||
color: #66d9ef
|
||||
}
|
||||
|
||||
.ace-chrome .ace_storage {
|
||||
color: #ff79c6
|
||||
}
|
||||
|
||||
.ace-chrome .ace_storage.ace_type {
|
||||
font-style: italic;
|
||||
color: #8be9fd
|
||||
}
|
||||
|
||||
.ace-chrome .ace_invalid {
|
||||
color: #F8F8F0;
|
||||
background-color: #ff79c6
|
||||
}
|
||||
|
||||
.ace-chrome .ace_invalid.ace_deprecated {
|
||||
color: #F8F8F0;
|
||||
background-color: #bd93f9
|
||||
}
|
||||
|
||||
.ace-chrome .ace_string {
|
||||
color: #f1fa8c
|
||||
}
|
||||
|
||||
.ace-chrome .ace_comment {
|
||||
color: #6272a4
|
||||
}
|
||||
|
||||
.ace-chrome .ace_variable {
|
||||
color: #50fa7b
|
||||
}
|
||||
|
||||
.ace-chrome .ace_variable.ace_parameter {
|
||||
font-style: italic;
|
||||
color: #ffb86c
|
||||
}
|
||||
|
||||
.ace-chrome .ace_entity.ace_other.ace_attribute-name {
|
||||
color: #50fa7b
|
||||
}
|
||||
|
||||
.ace-chrome .ace_entity.ace_name.ace_function {
|
||||
color: #50fa7b
|
||||
}
|
||||
|
||||
.ace-chrome .ace_entity.ace_name.ace_tag {
|
||||
color: #ff79c6
|
||||
}
|
||||
|
||||
.ace-chrome .ace_invisible {
|
||||
color: #626680;
|
||||
}
|
||||
|
||||
.ace-chrome .ace_indent-guide {
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYHB3d/8PAAOIAdULw8qMAAAAAElFTkSuQmCC) right repeat-y
|
||||
}
|
||||
|
||||
.credits {
|
||||
|
||||
color: var(--text-muted);
|
||||
}
|
||||
732
CSS/themes/flood/flood-base.css
Normal file
732
CSS/themes/flood/flood-base.css
Normal file
@ -0,0 +1,732 @@
|
||||
/* 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 */
|
||||
|
||||
/* MOBILE */
|
||||
|
||||
@media (max-width: 720px) {
|
||||
|
||||
.modal__body,
|
||||
.modal__content__wrapper,
|
||||
.modal__header,
|
||||
body,
|
||||
.dark .torrents,
|
||||
.torrents,
|
||||
.action-bar {
|
||||
background: #1b1b1b !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
body,
|
||||
.dark .torrents,
|
||||
.torrents {
|
||||
color: var(--text);
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
.inverse .h1,
|
||||
.inverse .h2,
|
||||
.inverse .h3,
|
||||
.inverse .h4,
|
||||
.inverse .h5,
|
||||
.inverse .h6,
|
||||
.inverse h1,
|
||||
.inverse h2,
|
||||
.inverse h3,
|
||||
.inverse h4,
|
||||
.inverse h5,
|
||||
.inverse h6 .dark .torrents__alert,
|
||||
.torrents__alert {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* AUTH PAGE */
|
||||
|
||||
.application__view--auth-form {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
|
||||
.panel--light {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.panel {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 1px 3px 1px rgba(0, 0, 0, .2);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
|
||||
.input,
|
||||
.inverse .input {
|
||||
background: rgba(255, 255, 255, .05);
|
||||
color: #fff;
|
||||
border: 1px solid #0000;
|
||||
box-shadow: 0 1px 1px rgba(210, 216, 222, 0), 0 1px 3px 1px rgba(210, 216, 222, 0);
|
||||
}
|
||||
|
||||
.input:hover,
|
||||
.inverse .input:hover {
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.input:active,
|
||||
.input:focus,
|
||||
.inverse .input:active,
|
||||
.inverse .input:focus,
|
||||
.inverse .button--quaternary:active {
|
||||
background-color: rgba(52, 156, 244, .05);
|
||||
color: var(--text);
|
||||
border-color: rgb(var(--accent-color));
|
||||
box-shadow: 0 1px 1px rgb(var(--accent-color) / 15%), 0 1px 3px 1px rgb(var(--accent-color) / 20%), 0 0 0 1px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.button--quaternary,
|
||||
.inverse .button--quaternary {
|
||||
background: rgba(255, 255, 255, .05);
|
||||
border-color: transparent;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0), 0 1px 3px 1px rgba(0, 0, 0, 0);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.button--quaternary:focus-visible,
|
||||
.button--quaternary:hover,
|
||||
.inverse .button--quaternary:focus,
|
||||
.inverse .button--quaternary:hover {
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.button--quaternary:active,
|
||||
.button--quaternary:focus,
|
||||
.inverse .button--quaternary:active,
|
||||
.inverse .button--quaternary:focus {
|
||||
border-color: rgb(var(--accent-color));
|
||||
box-shadow: 0 1px 1px rgb(var(--accent-color) / 15%), 0 1px 3px 1px rgb(var(--accent-color) / 20%), 0 0 0 1px rgb(var(--accent-color));
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.context-menu__items .select__item:focus-visible,
|
||||
.context-menu__items .select__item:hover {
|
||||
background: rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
.inverse .form__element__addon {
|
||||
border-color: rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.form__element__addon--is-interactive:focus .icon,
|
||||
.form__element__addon--is-interactive:hover .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
transition: all .125s;
|
||||
}
|
||||
|
||||
.form__element:active~.form__element__addon .icon,
|
||||
.form__element:focus~.form__element__addon .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.form__element__addon .icon {
|
||||
fill: var(--text-hover);
|
||||
}
|
||||
|
||||
.select__item--is-selected .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.sortable-list__item {
|
||||
background: rgb(255 255 255 / 10%);
|
||||
border: 1px solid rgb(255 255 255 / 10%);
|
||||
|
||||
}
|
||||
|
||||
.css-1759iaw {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.css-q5wzhq:hover {
|
||||
color: var(--text-hover);
|
||||
background: rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.css-m5tpeq:hover {
|
||||
color: var(--text-hover);
|
||||
background: rgba(94, 114, 140, 0.1);
|
||||
}
|
||||
|
||||
/* Cancel button */
|
||||
.button--tertiary {
|
||||
background: rgb(255 255 255 / 20%);
|
||||
border-color: #768a9b;
|
||||
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
|
||||
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
|
||||
}
|
||||
|
||||
.inverse .button--tertiary {
|
||||
border-color: rgb(255 255 255 / 0%);
|
||||
}
|
||||
|
||||
.inverse .button--tertiary:focus,
|
||||
.inverse .button--tertiary:hover {
|
||||
background: rgba(255, 255, 255, .35);
|
||||
border-color: #0000;
|
||||
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
|
||||
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
|
||||
}
|
||||
|
||||
.inverse .button--tertiary:active {
|
||||
background: rgba(255, 255, 255, .35);
|
||||
border-color: #0000;
|
||||
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
|
||||
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
|
||||
}
|
||||
|
||||
.inverse .button--tertiary:focus,
|
||||
.inverse .button--tertiary:hover {
|
||||
background: rgba(255, 255, 255, .35);
|
||||
border-color: #0000;
|
||||
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
|
||||
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
|
||||
}
|
||||
|
||||
/* DROPDOWN MENUS*/
|
||||
|
||||
.context-menu__items,
|
||||
.menu {
|
||||
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-radius: 4px;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, .05), 0 1px 3px 1px rgba(0, 0, 0, .1), 0 0 0 1px rgba(0, 0, 0, .1);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.select__item--is-selected,
|
||||
.menu__item.is-selectable.is-selected,
|
||||
.dark .sidebar__icon-button:focus-visible,
|
||||
.dark .sidebar__icon-button:hover,
|
||||
.sidebar__icon-button:focus-visible,
|
||||
.sidebar__icon-button:hover,
|
||||
.dark .sidebar__icon-button:focus-visible .icon,
|
||||
.dark .sidebar__icon-button:hover .icon,
|
||||
.sidebar__icon-button:focus-visible .icon,
|
||||
.sidebar__icon-button:hover .icon {
|
||||
color: rgb(var(--accent-color));
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.menu__item.is-selectable:focus-within,
|
||||
.menu__item.is-selectable:hover {
|
||||
background: rgba(255, 255, 255, .1);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.button--primary,
|
||||
.inverse .button--primary {
|
||||
background: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
color: var(--button-text)
|
||||
}
|
||||
|
||||
.inverse .button--primary:focus,
|
||||
.inverse .button--primary:hover {
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.button--primary:active {
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
|
||||
|
||||
::placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.error {
|
||||
background: #f34570;
|
||||
border-radius: 3px;
|
||||
color: #fff;
|
||||
padding: 8px 12px;
|
||||
transition: opacity .25s;
|
||||
}
|
||||
|
||||
/* TORRENT PAGE */
|
||||
|
||||
.dark .torrent--is-condensed.torrent--is-selected,
|
||||
.dark .torrent--is-condensed.torrent--is-selected+.torrent,
|
||||
.torrent--is-condensed.torrent--is-selected,
|
||||
.torrent--is-condensed.torrent--is-selected+.torrent {
|
||||
border-color: rgba(var(--accent-color), .7);
|
||||
}
|
||||
|
||||
.dark .torrent--is-selected:after,
|
||||
.dark .torrent--is-selected:hover:after,
|
||||
.torrent--is-selected:after,
|
||||
.torrent--is-selected:hover:after {
|
||||
background: rgba(var(--accent-color), .7);
|
||||
}
|
||||
|
||||
.dark .table__row--heading,
|
||||
.table__row--heading {
|
||||
background: rgba(255, 255, 255, .15);
|
||||
box-shadow: 0 1px 0 hsl(0deg 0% 100% / 12%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dark .torrent__detail--name,
|
||||
.torrent__detail--name {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dark .torrent--is-condensed,
|
||||
.torrent--is-condensed {
|
||||
border-top: 1px solid hsla(0, 0%, 100%, .12);
|
||||
}
|
||||
|
||||
.dark .torrent__detail,
|
||||
.torrent__detail {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.torrent--is-downloading--actively .torrent__detail--downRate {
|
||||
color: #39ce83;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.dark .torrent--is-condensed.torrent--is-selected .torrent__detail,
|
||||
.torrent--is-condensed.torrent--is-selected .torrent__detail,
|
||||
.dark .torrent--is-condensed.torrent--is-selected.torrent--is-stopped .torrent__detail,
|
||||
.torrent--is-condensed.torrent--is-selected.torrent--is-stopped .torrent__detail {
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.table__heading:focus-visible,
|
||||
.table__heading:hover,
|
||||
.dark .table__heading:focus-visible,
|
||||
.dark .table__heading:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dark .table__heading--is-sorted,
|
||||
.table__heading--is-sorted {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dark .table__heading,
|
||||
.table__heading {
|
||||
border-right: 1px solid hsla(0, 0%, 100%, .12);
|
||||
}
|
||||
|
||||
.dark .table__heading__handle:after,
|
||||
.table__heading__handle:after {
|
||||
background: hsla(0, 0%, 100%, .6);
|
||||
}
|
||||
|
||||
.torrent--is-condensed:nth-child(0n+1),
|
||||
.dark .torrent--is-condensed,
|
||||
.torrent--is-condensed {
|
||||
border-top: 1px solid hsla(0, 0%, 100%, .12);
|
||||
}
|
||||
|
||||
.torrent-details__sub-heading__secondary,
|
||||
.dark .torrent-details__sub-heading__secondary {
|
||||
color: var(--text);
|
||||
display: flex;
|
||||
font-size: .85rem;
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
|
||||
.torrent-details__sub-heading__tertiary .icon,
|
||||
.dark .torrent-details__sub-heading__tertiary .icon {
|
||||
fill: rgba(var(--accent-color), .5);
|
||||
height: 12px;
|
||||
margin-right: 3px;
|
||||
margin-top: -3px;
|
||||
vertical-align: middle;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.torrent-details__table,
|
||||
.dark .torrent-details__table,
|
||||
.torrent-details__table__heading--tertiary,
|
||||
.dark .torrent-details__table__heading--tertiary,
|
||||
.torrent-details__detail__label,
|
||||
.dark .torrent-details__detail__label {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.torrent-details__section--file-tree .directory-tree__node {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.torrent-details__section--file-tree .directory-tree__parent-directory,
|
||||
.dark .torrent-details__section--file-tree .directory-tree__parent-directory {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dark .torrent-details__table__heading--primary,
|
||||
.torrent-details__table__heading--primary,
|
||||
.dark .torrent-details__table__heading--secondary .torrent-details__table__heading--secondary,
|
||||
.dark .torrent-details__table__heading--tertiary,
|
||||
.torrent-details__table__heading--tertiary {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.torrent-details__section .badge {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.torrent-details__action.is-active {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.priority-meter--max-3.priority-meter--level-1:after {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* TOB NAVBAR */
|
||||
.action-bar {
|
||||
background: var(--main-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-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dark .action .icon,
|
||||
.action .icon {
|
||||
fill: var(--text-hover);
|
||||
}
|
||||
|
||||
.dark .action:focus-visible,
|
||||
.dark .action:hover,
|
||||
.action:focus-visible,
|
||||
.action:hover {
|
||||
background: rgba(255, 255, 255, .1);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.action:focus-visible .icon,
|
||||
.action:hover .icon,
|
||||
.dark .action:focus-visible .icon,
|
||||
.dark .action:hover .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dropdown__value,
|
||||
.dropdown.is-expanded .dropdown__header .dropdown__value {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* SIDE MENU */
|
||||
.dark .application__sidebar,
|
||||
.application__sidebar {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
box-shadow: 1px 0 hsl(0deg 0% 100% / 12%);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.sidebar-filter__item--heading,
|
||||
.sidebar-filter__item--heading:focus-visible,
|
||||
.sidebar-filter__item--heading:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item,
|
||||
.sidebar-filter__item {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item.is-active,
|
||||
.sidebar-filter__item.is-active {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item.is-active .icon,
|
||||
.sidebar-filter__item.is-active .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item.is-active .badge,
|
||||
.sidebar-filter__item.is-active .badge {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item .icon,
|
||||
.sidebar-filter__item .icon {
|
||||
fill: rgb(var(--accent-color), .3);
|
||||
}
|
||||
|
||||
.sidebar-filter .badge,
|
||||
.dark .sidebar-filter .badge {
|
||||
background: rgb(var(--accent-color), .3);
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item:focus-visible .icon,
|
||||
.dark .sidebar-filter__item:hover .icon,
|
||||
.sidebar-filter__item:focus-visible .icon,
|
||||
.sidebar-filter__item:hover .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dark .sidebar-filter__item:focus-visible,
|
||||
.dark .sidebar-filter__item:hover,
|
||||
.sidebar-filter__item:focus-visible,
|
||||
.sidebar-filter__item:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.search.is-in-use .textbox {
|
||||
background: rgba(var(--accent-color), .25);
|
||||
border-bottom: 1px solid rgba(var(--accent-color), .3);
|
||||
border-top: 1px solid rgba(var(--accent-color), .3);
|
||||
color: #eee;
|
||||
padding-right: 45px;
|
||||
}
|
||||
|
||||
.search.is-in-use .icon {
|
||||
fill: rgb(var(--accent-color));
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.search .textbox {
|
||||
border: 1px solid rgba(var(--accent-color), .2);
|
||||
background: rgba(var(--accent-color), .1);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.search .icon {
|
||||
fill: white;
|
||||
}
|
||||
|
||||
.dark .sidebar__diskusage .progress-bar__fill,
|
||||
.sidebar__diskusage .progress-bar__fill {
|
||||
background: hsla(0, 0%, 100%, .38);
|
||||
}
|
||||
|
||||
.dark .sidebar__diskusage .progress-bar__fill__wrapper,
|
||||
.sidebar__diskusage .progress-bar__fill__wrapper {
|
||||
background: hsla(0, 0%, 100%, .12);
|
||||
}
|
||||
|
||||
.torrent--is-selected.torrent--is-stopped .progress-bar__icon .icon {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.torrent--is-selected.torrent--is-stopped .progress-bar__fill {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.dark .sidebar__icon-button,
|
||||
.sidebar__icon-button {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.sidebar__icon-button .icon,
|
||||
.dark .sidebar__icon-button .icon {
|
||||
fill: var(--text);
|
||||
}
|
||||
|
||||
.diskusage__details-list__label {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.tooltip__content {
|
||||
background: #1b1b1b;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.modal__body,
|
||||
.modal__content__wrapper,
|
||||
.modal__header {
|
||||
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;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.modal--size-large {
|
||||
width: 776px;
|
||||
}
|
||||
|
||||
.modal--vertical.modal--tabs-in-header .modal__header {
|
||||
box-shadow: inset -1px 0 0 rgba(255, 255, 255, .1);
|
||||
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;
|
||||
}
|
||||
|
||||
.modal--vertical.modal--tabs-in-header .modal__header,
|
||||
.modal--vertical.modal--tabs-in-body .modal__tabs {
|
||||
/* Modal side menu*/
|
||||
background: rgb(0 0 0 / 45%) !important;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.modal__tabs .modal__tab.is-active:after {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal--vertical .modal__tabs .modal__tab:after {
|
||||
width: 3px;
|
||||
}
|
||||
|
||||
.modal__header {
|
||||
color: var(--text-hover);
|
||||
box-shadow: inset 0 -1px 0 rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.modal__tabs .modal__tab.is-active {
|
||||
color: var(--text-hover);
|
||||
background: rgb(255 255 255 / 15%);
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
|
||||
.modal__tabs {
|
||||
color: var(--text);
|
||||
font-size: .85rem;
|
||||
font-weight: 500;
|
||||
margin: 5px -5px 0;
|
||||
}
|
||||
|
||||
.toggle-input__indicator__icon .icon {
|
||||
fill: var(--button-text);
|
||||
transition: all .25s;
|
||||
}
|
||||
|
||||
.inverse .toggle-input__indicator {
|
||||
background: var(--button-color);
|
||||
border: 1px solid var(--button-color);
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 1px 3px 1px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.inverse .toggle-input:hover .toggle-input__indicator {
|
||||
border-color: var(--button-color-hover);
|
||||
background: var(--button-color-hover)
|
||||
}
|
||||
|
||||
.toggle-input:active,
|
||||
.toggle-input:focus {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.toggle-input:active .toggle-input__indicator .icon,
|
||||
.toggle-input:active .toggle-input__indicator__icon .icon,
|
||||
.toggle-input:focus .toggle-input__indicator .icon,
|
||||
.toggle-input:focus .toggle-input__indicator__icon .icon {
|
||||
fill: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.inverse .toggle-input:active .toggle-input__indicator,
|
||||
.inverse .toggle-input:focus .toggle-input__indicator,
|
||||
.toggle-input:active .toggle-input__indicator,
|
||||
.toggle-input:focus .toggle-input__indicator {
|
||||
border-color: var(--accent-color-hover);
|
||||
box-shadow: 0 1px 1px rgb(var(--accent-color) / 15%), 0 1px 3px 1px rgb(var(--accent-color) / 20%), 0 0 0 1px var(--accent-color-hover);
|
||||
;
|
||||
}
|
||||
|
||||
.interactive-list {
|
||||
background: rgb(255 255 255 / 10%);
|
||||
border: 1px solid rgb(255 255 255 / 10%);
|
||||
box-shadow: 0 1px 1px rgb(0 0 0 / 15%), 0 1px 3px 1px rgb(0 0 0 / 20%);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropzone__icon .icon--files {
|
||||
fill: rgba(var(--accent-color), .5);
|
||||
height: 64px;
|
||||
transition: fill .25s;
|
||||
width: 64px;
|
||||
}
|
||||
|
||||
.dropzone__browse-button {
|
||||
color: rgb(var(--accent-color));
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.dropzone:hover {
|
||||
border-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.dropzone:hover .dropzone__icon .icon {
|
||||
fill: var(--accent-color-hover);
|
||||
}
|
||||
395
CSS/themes/gaps/gaps-base.css
Normal file
395
CSS/themes/gaps/gaps-base.css
Normal file
@ -0,0 +1,395 @@
|
||||
/* 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 {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h4.text-primary,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
label {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.alert-heading {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.bg-primary {
|
||||
background-color: transparent !important;
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.navbar .list-ul-active,
|
||||
.info-circle-active,
|
||||
.arrow-clockwise-active,
|
||||
.gear-active,
|
||||
.rss-active,
|
||||
.exclamation-triangle-active,
|
||||
.collection-fill-active,
|
||||
.activePage {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.bg-primary .navbar-nav .active>.nav-link {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.default {
|
||||
background-color: var(--text);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link:hover,
|
||||
.navbar-dark .navbar-nav .nav-link:focus {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link:hover .default,
|
||||
.navbar-dark .navbar-nav .nav-link:focus .default {
|
||||
background-color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
table.dataTable.stripe tbody tr.odd,
|
||||
table.dataTable.display tbody tr.odd,
|
||||
table.dataTable tbody tr {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
table.dataTable.hover tbody tr:hover,
|
||||
table.dataTable.display tbody tr:hover {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
table.dataTable thead th,
|
||||
table.dataTable thead td {
|
||||
border-bottom: 1px solid #00000000;
|
||||
}
|
||||
|
||||
table.dataTable.row-border tbody th,
|
||||
table.dataTable.row-border tbody td,
|
||||
table.dataTable.display tbody th,
|
||||
table.dataTable.display tbody td {
|
||||
border-top: 1px solid rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
|
||||
color: var(--text) !important;
|
||||
border: 1px solid transparent;
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
|
||||
color: var(--text-hover) !important;
|
||||
border: 1px solid transparent;
|
||||
background: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* Cards */
|
||||
.card {
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
border: 1px solid rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.card .text-muted {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
#movies .card img {
|
||||
height: 200px !important;
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.card-text .text-info {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-primary,
|
||||
.btn-info {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.btn-primary:not(:disabled):not(.disabled):active:focus,
|
||||
.btn-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.show>.btn-primary.dropdown-toggle:focus,
|
||||
.btn-info:focus,
|
||||
.btn-info.focus {
|
||||
-webkit-box-shadow: 0 0 0 0.2rem rgb(var(--accent-color), .5);
|
||||
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-info:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.list-group-item.active {
|
||||
color: var(--label-text-color);
|
||||
background: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.list-group-item.active:hover {
|
||||
color: var(--label-text-color);
|
||||
background: var(--accent-color-hover);
|
||||
border-color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.list-group-item-action:hover,
|
||||
.list-group-item-action:focus {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
.nav-tabs .nav-link.active,
|
||||
.nav-tabs .nav-link.active:hover,
|
||||
.nav-tabs .nav-link.active:focus,
|
||||
.nav-tabs .nav-item.open .nav-link:focus,
|
||||
.nav-pills .nav-link.active:focus,
|
||||
.nav-pills .nav-item.open .nav-link:focus,
|
||||
.nav-tabs .nav-item.show .nav-link {
|
||||
color: rgb(var(--accent-color));
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link,
|
||||
.nav-tabs .nav-item.open .nav-link,
|
||||
.nav-pills .nav-link,
|
||||
.nav-pills .nav-link.active,
|
||||
.nav-pills .nav-link.active:hover,
|
||||
.nav-pills .nav-item.open .nav-link {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link:hover,
|
||||
.nav-tabs .nav-link:focus,
|
||||
.nav-tabs .nav-item.open .nav-link:hover,
|
||||
.nav-pills .nav-item.open .nav-link:hover {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border-color: transparent;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link.active:hover {
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.badge-primary {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#plexServers .card-header {
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
#plexServers .border-secondary {
|
||||
border-color: #0000 !important;
|
||||
}
|
||||
|
||||
#plexServers .list-group-item {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border: none;
|
||||
}
|
||||
|
||||
#plexServers .card-footer {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
color: var(--text);
|
||||
background: var(--drop-down-menu-bg);
|
||||
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: 1px solid transparent;
|
||||
box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-item:hover,
|
||||
.dropdown-item:focus {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
/* Input */
|
||||
[type="search"] {
|
||||
outline-offset: -2px;
|
||||
-webkit-appearance: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* Progress Bar */
|
||||
.progress-bar-striped {
|
||||
background-image: linear-gradient(45deg, rgba(var(--accent-color)) 25%, transparent 25%, transparent 50%, rgba(var(--accent-color)) 50%, rgba(var(--accent-color)) 75%, transparent 75%, transparent);
|
||||
background-size: .625rem .625rem;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
background-color: rgb(var(--accent-color), .15);
|
||||
-webkit-transition: width .6s ease;
|
||||
transition: width .6s ease;
|
||||
}
|
||||
561
CSS/themes/gitea/chroma.css
Normal file
561
CSS/themes/gitea/chroma.css
Normal file
@ -0,0 +1,561 @@
|
||||
/*
|
||||
/* dP oo
|
||||
/* 88
|
||||
/* 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88 .dP .d8888b. dP
|
||||
/* 88'`88'`88 88' `88 88' `88 88' `88 88888" 88' `88 88
|
||||
/* 88 88 88 88. .88 88 88 88. .88 88 `8b. 88. .88 88
|
||||
/* dP dP dP `88888P' dP dP `88888P' dP `YP `88888P8 dP
|
||||
|
||||
/* Source: https://gist.github.com/ntrrg/f70d4dc6ed8a739a36fe7c55f422c5f3 */
|
||||
:root {
|
||||
/* Background */
|
||||
--code-background: #1f1f1f;
|
||||
--code-color: #f8f8f2;
|
||||
|
||||
/* Error */
|
||||
--code-err-background: #960050;
|
||||
--code-err-color: #1e0010;
|
||||
|
||||
/* LineHighlight */
|
||||
--code-hl-background: #ffffcc;
|
||||
|
||||
/* Keyword */
|
||||
--code-k-color: #66d9ef;
|
||||
|
||||
/* KeywordConstant */
|
||||
--code-kc-color: #66d9ef;
|
||||
|
||||
/* KeywordDeclaration */
|
||||
--code-kd-color: #66d9ef;
|
||||
|
||||
/* KeywordNamespace */
|
||||
--code-kn-color: #f92672;
|
||||
|
||||
/* KeywordPseudo */
|
||||
--code-kp-color: #66d9ef;
|
||||
|
||||
/* KeywordReserved */
|
||||
--code-kr-color: #66d9ef;
|
||||
|
||||
/* KeywordType */
|
||||
--code-kt-color: #66d9ef;
|
||||
|
||||
/* NameAttribute */
|
||||
--code-na-color: #a6e22e;
|
||||
|
||||
/* NameClass */
|
||||
--code-nc-color: #a6e22e;
|
||||
|
||||
/* NameConstant */
|
||||
--code-no-color: #66d9ef;
|
||||
|
||||
/* NameDecorator */
|
||||
--code-nd-color: #a6e22e;
|
||||
|
||||
/* NameException */
|
||||
--code-ne-color: #a6e22e;
|
||||
|
||||
/* NameFunction */
|
||||
--code-nf-color: #a6e22e;
|
||||
|
||||
/* NameOther */
|
||||
--code-nx-color: #a6e22e;
|
||||
|
||||
/* NameTag */
|
||||
--code-nt-color: #f92672;
|
||||
|
||||
/* Literal */
|
||||
--code-l-color: #ae81ff;
|
||||
|
||||
/* LiteralDate */
|
||||
--code-ld-color: #e6db74;
|
||||
|
||||
/* LiteralString */
|
||||
--code-s-color: #e6db74;
|
||||
|
||||
/* LiteralStringAffix */
|
||||
--code-sa-color: #e6db74;
|
||||
|
||||
/* LiteralStringBacktick */
|
||||
--code-sb-color: #e6db74;
|
||||
|
||||
/* LiteralStringChar */
|
||||
--code-sc-color: #e6db74;
|
||||
|
||||
/* LiteralStringDelimiter */
|
||||
--code-dl-color: #e6db74;
|
||||
|
||||
/* LiteralStringDoc */
|
||||
--code-sd-color: #e6db74;
|
||||
|
||||
/* LiteralStringDouble */
|
||||
--code-s2-color: #e6db74;
|
||||
|
||||
/* LiteralStringEscape */
|
||||
--code-se-color: #ae81ff;
|
||||
|
||||
/* LiteralStringHeredoc */
|
||||
--code-sh-color: #e6db74;
|
||||
|
||||
/* LiteralStringInterpol */
|
||||
--code-si-color: #e6db74;
|
||||
|
||||
/* LiteralStringOther */
|
||||
--code-sx-color: #e6db74;
|
||||
|
||||
/* LiteralStringRegex */
|
||||
--code-sr-color: #e6db74;
|
||||
|
||||
/* LiteralStringSingle */
|
||||
--code-s1-color: #e6db74;
|
||||
|
||||
/* LiteralStringSymbol */
|
||||
--code-ss-color: #e6db74;
|
||||
|
||||
/* LiteralNumber */
|
||||
--code-m-color: #ae81ff;
|
||||
|
||||
/* LiteralNumberBin */
|
||||
--code-mb-color: #ae81ff;
|
||||
|
||||
/* LiteralNumberFloat */
|
||||
--code-mf-color: #ae81ff;
|
||||
|
||||
/* LiteralNumberHex */
|
||||
--code-mh-color: #ae81ff;
|
||||
|
||||
/* LiteralNumberInteger */
|
||||
--code-mi-color: #ae81ff;
|
||||
|
||||
/* LiteralNumberIntegerLong */
|
||||
--code-il-color: #ae81ff;
|
||||
|
||||
/* LiteralNumberOct */
|
||||
--code-mo-color: #ae81ff;
|
||||
|
||||
/* Operator */
|
||||
--code-o-color: #f92672;
|
||||
|
||||
/* OperatorWord */
|
||||
--code-ow-color: #f92672;
|
||||
|
||||
/* Comment */
|
||||
--code-c-color: #75715e;
|
||||
|
||||
/* CommentHashbang */
|
||||
--code-ch-color: #75715e;
|
||||
|
||||
/* CommentMultiline */
|
||||
--code-cm-color: #75715e;
|
||||
|
||||
/* CommentSingle */
|
||||
--code-c1-color: #75715e;
|
||||
|
||||
/* CommentSpecial */
|
||||
--code-cs-color: #75715e;
|
||||
|
||||
/* CommentPreproc */
|
||||
--code-cp-color: #75715e;
|
||||
|
||||
/* CommentPreprocFile */
|
||||
--code-cpf-color: #75715e;
|
||||
|
||||
/* GenericDeleted */
|
||||
--code-gd-color: #f92672;
|
||||
|
||||
/* GenericInserted */
|
||||
--code-gi-color: #a6e22e;
|
||||
|
||||
/* GenericSubheading */
|
||||
--code-gu-color: #75715e;
|
||||
}
|
||||
|
||||
/* CHROMA */
|
||||
/* Table */
|
||||
.chroma .ui.table tbody tr {
|
||||
border-color: #333640;
|
||||
background: var(--code-background);
|
||||
}
|
||||
/* Background */
|
||||
.chroma,
|
||||
.markdown:not(code) .highlight pre,
|
||||
.markdown:not(code) pre {
|
||||
background-color: var(--code-background);
|
||||
color: var(--code-color);
|
||||
}
|
||||
|
||||
/* Error */
|
||||
.chroma .err {
|
||||
background-color: var(--code-err-background);
|
||||
color: var(--code-err-color);
|
||||
}
|
||||
|
||||
/* LineTableTD */
|
||||
.chroma .lntd {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* LineTable */
|
||||
.chroma .lntable {
|
||||
width: auto;
|
||||
|
||||
border: 0;
|
||||
border-spacing: 0;
|
||||
display: block;
|
||||
margin: 0;
|
||||
overflow: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* LineHighlight */
|
||||
.chroma .hl {
|
||||
width: 100%;
|
||||
|
||||
background-color: var(--code-hl-background);
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* LineNumbersTable */
|
||||
.chroma .lnt {
|
||||
margin-right: 0.4em;
|
||||
padding: 0 0.4em 0 0.4em;
|
||||
}
|
||||
|
||||
/* LineNumbers */
|
||||
.chroma .ln {
|
||||
margin-right: 0.4em;
|
||||
padding: 0 0.4em 0 0.4em;
|
||||
}
|
||||
|
||||
/* Keyword */
|
||||
.chroma .k {
|
||||
color: var(--code-k-color);
|
||||
}
|
||||
|
||||
/* KeywordConstant */
|
||||
.chroma .kc {
|
||||
color: var(--code-kc-color);
|
||||
}
|
||||
|
||||
/* KeywordDeclaration */
|
||||
.chroma .kd {
|
||||
color: var(--code-kd-color);
|
||||
}
|
||||
|
||||
/* KeywordNamespace */
|
||||
.chroma .kn {
|
||||
color: var(--code-kn-color);
|
||||
}
|
||||
|
||||
/* KeywordPseudo */
|
||||
.chroma .kp {
|
||||
color: var(--code-kp-color);
|
||||
}
|
||||
|
||||
/* KeywordReserved */
|
||||
.chroma .kr {
|
||||
color: var(--code-kr-color);
|
||||
}
|
||||
|
||||
/* KeywordType */
|
||||
.chroma .kt {
|
||||
color: var(--code-kt-color);
|
||||
}
|
||||
|
||||
/* Name */
|
||||
.chroma .n {
|
||||
color: var(--code-n-color);
|
||||
}
|
||||
|
||||
/* NameAttribute */
|
||||
.chroma .na {
|
||||
color: var(--code-na-color);
|
||||
}
|
||||
|
||||
/* NameBuiltin */
|
||||
.chroma .nb {
|
||||
color: var(--code-nb-color);
|
||||
}
|
||||
|
||||
/* NameBuiltinPseudo */
|
||||
.chroma .bp {
|
||||
color: var(--code-bp-color);
|
||||
}
|
||||
|
||||
/* NameClass */
|
||||
.chroma .nc {
|
||||
color: var(--code-nc-color);
|
||||
}
|
||||
|
||||
/* NameConstant */
|
||||
.chroma .no {
|
||||
color: var(--code-no-color);
|
||||
}
|
||||
|
||||
/* NameDecorator */
|
||||
.chroma .nd {
|
||||
color: var(--code-nd-color);
|
||||
}
|
||||
|
||||
/* NameEntity */
|
||||
.chroma .ni {
|
||||
color: var(--code-ni-color);
|
||||
}
|
||||
|
||||
/* NameException */
|
||||
.chroma .ne {
|
||||
color: var(--code-ne-color);
|
||||
}
|
||||
|
||||
/* NameFunction */
|
||||
.chroma .nf {
|
||||
color: var(--code-nf-color);
|
||||
}
|
||||
|
||||
/* NameFunctionMagic */
|
||||
.chroma .fm {
|
||||
color: var(--code-fm-color);
|
||||
}
|
||||
|
||||
/* NameLabel */
|
||||
.chroma .nl {
|
||||
color: var(--code-nl-color);
|
||||
}
|
||||
|
||||
/* NameNamespace */
|
||||
.chroma .nn {
|
||||
color: var(--code-nn-color);
|
||||
}
|
||||
|
||||
/* NameOther */
|
||||
.chroma .nx {
|
||||
color: var(--code-nx-color);
|
||||
}
|
||||
|
||||
/* NameProperty */
|
||||
.chroma .py {
|
||||
color: var(--code-py-color);
|
||||
}
|
||||
|
||||
/* NameTag */
|
||||
.chroma .nt {
|
||||
color: var(--code-nt-color);
|
||||
}
|
||||
|
||||
/* NameVariable */
|
||||
.chroma .nv {
|
||||
color: var(--code-nv-color);
|
||||
}
|
||||
|
||||
/* NameVariableClass */
|
||||
.chroma .vc {
|
||||
color: var(--code-vc-color);
|
||||
}
|
||||
|
||||
/* NameVariableGlobal */
|
||||
.chroma .vg {
|
||||
color: var(--code-vg-color);
|
||||
}
|
||||
|
||||
/* NameVariableInstance */
|
||||
.chroma .vi {
|
||||
color: var(--code-vi-color);
|
||||
}
|
||||
|
||||
/* NameVariableMagic */
|
||||
.chroma .vm {
|
||||
color: var(--code-vm-color);
|
||||
}
|
||||
|
||||
/* Literal */
|
||||
.chroma .l {
|
||||
color: var(--code-l-color);
|
||||
}
|
||||
|
||||
/* LiteralDate */
|
||||
.chroma .ld {
|
||||
color: var(--code-ld-color);
|
||||
}
|
||||
|
||||
/* LiteralString */
|
||||
.chroma .s {
|
||||
color: var(--code-s-color);
|
||||
}
|
||||
|
||||
/* LiteralStringAffix */
|
||||
.chroma .sa {
|
||||
color: var(--code-sa-color);
|
||||
}
|
||||
|
||||
/* LiteralStringBacktick */
|
||||
.chroma .sb {
|
||||
color: var(--code-sb-color);
|
||||
}
|
||||
|
||||
/* LiteralStringChar */
|
||||
.chroma .sc {
|
||||
color: var(--code-sc-color);
|
||||
}
|
||||
|
||||
/* LiteralStringDelimiter */
|
||||
.chroma .dl {
|
||||
color: var(--code-dl-color);
|
||||
}
|
||||
|
||||
/* LiteralStringDoc */
|
||||
.chroma .sd {
|
||||
color: var(--code-sd-color);
|
||||
}
|
||||
|
||||
/* LiteralStringDouble */
|
||||
.chroma .s2 {
|
||||
color: var(--code-s2-color);
|
||||
}
|
||||
|
||||
/* LiteralStringEscape */
|
||||
.chroma .se {
|
||||
color: var(--code-se-color);
|
||||
}
|
||||
|
||||
/* LiteralStringHeredoc */
|
||||
.chroma .sh {
|
||||
color: var(--code-sh-color);
|
||||
}
|
||||
|
||||
/* LiteralStringInterpol */
|
||||
.chroma .si {
|
||||
color: var(--code-si-color);
|
||||
}
|
||||
|
||||
/* LiteralStringOther */
|
||||
.chroma .sx {
|
||||
color: var(--code-sx-color);
|
||||
}
|
||||
|
||||
/* LiteralStringRegex */
|
||||
.chroma .sr {
|
||||
color: var(--code-sr-color);
|
||||
}
|
||||
|
||||
/* LiteralStringSingle */
|
||||
.chroma .s1 {
|
||||
color: var(--code-s1-color);
|
||||
}
|
||||
|
||||
/* LiteralStringSymbol */
|
||||
.chroma .ss {
|
||||
color: var(--code-ss-color);
|
||||
}
|
||||
|
||||
/* LiteralNumber */
|
||||
.chroma .m {
|
||||
color: var(--code-m-color);
|
||||
}
|
||||
|
||||
/* LiteralNumberBin */
|
||||
.chroma .mb {
|
||||
color: var(--code-mb-color);
|
||||
}
|
||||
|
||||
/* LiteralNumberFloat */
|
||||
.chroma .mf {
|
||||
color: var(--code-mf-color);
|
||||
}
|
||||
|
||||
/* LiteralNumberHex */
|
||||
.chroma .mh {
|
||||
color: var(--code-mh-color);
|
||||
}
|
||||
|
||||
/* LiteralNumberInteger */
|
||||
.chroma .mi {
|
||||
color: var(--code-mi-color);
|
||||
}
|
||||
|
||||
/* LiteralNumberIntegerLong */
|
||||
.chroma .il {
|
||||
color: var(--code-il-color);
|
||||
}
|
||||
|
||||
/* LiteralNumberOct */
|
||||
.chroma .mo {
|
||||
color: var(--code-mo-color);
|
||||
}
|
||||
|
||||
/* Operator */
|
||||
.chroma .o {
|
||||
color: var(--code-o-color);
|
||||
}
|
||||
|
||||
/* OperatorWord */
|
||||
.chroma .ow {
|
||||
color: var(--code-ow-color);
|
||||
}
|
||||
|
||||
/* Punctuation */
|
||||
.chroma .p {
|
||||
color: var(--code-p-color);
|
||||
}
|
||||
|
||||
/* Comment */
|
||||
.chroma .c {
|
||||
color: var(--code-c-color);
|
||||
}
|
||||
|
||||
/* CommentHashbang */
|
||||
.chroma .ch {
|
||||
color: var(--code-ch-color);
|
||||
}
|
||||
|
||||
/* CommentMultiline */
|
||||
.chroma .cm {
|
||||
color: var(--code-cm-color);
|
||||
}
|
||||
|
||||
/* CommentSingle */
|
||||
.chroma .c1 {
|
||||
color: var(--code-c1-color);
|
||||
}
|
||||
|
||||
/* CommentSpecial */
|
||||
.chroma .cs {
|
||||
color: var(--code-cs-color);
|
||||
}
|
||||
|
||||
/* CommentPreproc */
|
||||
.chroma .cp {
|
||||
color: var(--code-cp-color);
|
||||
}
|
||||
|
||||
/* CommentPreprocFile */
|
||||
.chroma .cpf {
|
||||
color: var(--code-cpf-color);
|
||||
}
|
||||
|
||||
/* GenericDeleted */
|
||||
.chroma .gd {
|
||||
color: var(--code-gd-color);
|
||||
}
|
||||
|
||||
/* GenericEmph */
|
||||
.chroma .ge {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* GenericInserted */
|
||||
.chroma .gi {
|
||||
color: var(--code-gi-color);
|
||||
}
|
||||
|
||||
/* GenericStrong */
|
||||
.chroma .gs {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* GenericSubheading */
|
||||
.chroma .gu {
|
||||
color: var(--code-gu-color);
|
||||
}
|
||||
1605
CSS/themes/gitea/gitea-base.css
Normal file
1605
CSS/themes/gitea/gitea-base.css
Normal file
File diff suppressed because it is too large
Load Diff
0
CSS/themes/grafana/.deprecated
Normal file
0
CSS/themes/grafana/.deprecated
Normal file
1309
CSS/themes/grafana/grafana-base.css
Normal file
1309
CSS/themes/grafana/grafana-base.css
Normal file
File diff suppressed because it is too large
Load Diff
599
CSS/themes/grafana/organizr-dashboard.css
Normal file
599
CSS/themes/grafana/organizr-dashboard.css
Normal file
@ -0,0 +1,599 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
/* GRAFANA THEME FOR ORGANIZR DASHBOARD INTEGRATION */
|
||||
body {
|
||||
color: #FFFFFF !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.main-view {
|
||||
background: linear-gradient(180deg,#ffffff00 10px,#ffffff00 100px) !important;
|
||||
}
|
||||
div.flot-text {
|
||||
color: #FFF !important;
|
||||
}
|
||||
/* Loading page */
|
||||
.theme-dark, .theme-light, .preloader {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* login page */
|
||||
.login-branding {
|
||||
border-right: none !important;
|
||||
}
|
||||
|
||||
/* sidemenu */
|
||||
.sidemenu-open .sidemenu {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
.sidemenu__logo:hover {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
.sidemenu-item.active, .sidemenu-item:hover {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.sidemenu .sidemenu__logo_small_breakpoint {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
}
|
||||
|
||||
/* Dashboard dropdown menu */
|
||||
.search-dropdown__col_1 {
|
||||
background: transparent !important;
|
||||
}
|
||||
.search-container {
|
||||
left: 0px !important;
|
||||
}
|
||||
.navbar-page-btn {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
/* Panel fullscreen navbar */
|
||||
.panel-in-fullscreen .navbar {
|
||||
background: linear-gradient(90deg,rgba(0, 0, 0, .15),rgba(0, 0, 0, 0.25)) !important;
|
||||
}
|
||||
|
||||
/* Dashboard search menu */
|
||||
.search-field-wrapper {
|
||||
background-color: #1f1f1f !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.search-field-wrapper>input {
|
||||
height: 55px !important;
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
.search-field-icon {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
/* Dashboard settings menu */
|
||||
.dashboard-settings__aside {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
.dashboard-page--settings-open .navbar {
|
||||
background: linear-gradient(90deg,rgba(0, 0, 0, .15),rgba(0, 0, 0, 0.25)) !important;
|
||||
}
|
||||
.navbar-button--primary {
|
||||
border-color: #ffffff00 !important;
|
||||
}
|
||||
.dashboard-settings__aside-header {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.dashboard-settings__nav-item {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.bootstrap-tagsinput {
|
||||
background-color: #09090b !important;
|
||||
}
|
||||
.gf-form-select-wrapper .gf-form-input {
|
||||
background-color: #393a3b !important;
|
||||
}
|
||||
|
||||
/*Datasources Menu*/
|
||||
|
||||
.add-data-source-item {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.add-data-source-item:hover {
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border: 1px solid #00000000;
|
||||
color: #fff;
|
||||
}
|
||||
/* Variable label color */
|
||||
.template-variable {
|
||||
color: #f79520 !important;
|
||||
}
|
||||
|
||||
/* Variable label box */
|
||||
.gf-form-label {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
border: none !important;
|
||||
color: #FFF;
|
||||
}
|
||||
.gf-form-input:focus {
|
||||
color: #FFF !important;
|
||||
background-color: #262626 !important;
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.variable-option.highlighted, .variable-option:hover {
|
||||
background-color: hsla(0,0%,100%,.1) !important;
|
||||
}
|
||||
|
||||
/* Variable dashboard dropdown */
|
||||
.variable-value-link {
|
||||
padding: 7.4px 10px !important;
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
border: none !important;
|
||||
color: #FFFFFF !important;
|
||||
}
|
||||
|
||||
/* Variable input box */
|
||||
.gf-form-input {
|
||||
color: #FFFFFF !important;
|
||||
background-color: rgba(255, 255, 255, 0.15) !important;
|
||||
border: 0px solid #262628 !important;
|
||||
|
||||
}
|
||||
|
||||
/* NAVBAR BUTTONS */
|
||||
.navbar-button {
|
||||
color: #FFF !important;
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
background-image: linear-gradient(180deg,rgba(0, 0, 0, 0.25),rgba(0, 0, 0, 0.25)) !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
/* Custom Range Refreshing every X Dropdown */
|
||||
.gf-timepicker-absolute-section select {
|
||||
background-color: #393a3b !important;
|
||||
}
|
||||
|
||||
/* PANEL BACKGROUND COLOR*/
|
||||
.panel-container {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border: transparent;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.panel-container.panel-transparent, .panel-container--transparent {
|
||||
background-color: transparent;
|
||||
border: transparent;
|
||||
}
|
||||
.panel-header:hover {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
.panel-loading {
|
||||
color: transparent;
|
||||
}
|
||||
/* ////PANEL BACKGROUND COLOR//// */
|
||||
|
||||
.graph-legend-table .graph-legend-series:nth-child(odd) {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* Panel text color*/
|
||||
div.flot-text {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
/* panel loading circle*/
|
||||
.panel-loading {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
/* panel resize arrow */
|
||||
.theme-dark .react-grid-item>.react-resizable-handle:after {
|
||||
border-right: 2px solid #fff !important;
|
||||
border-bottom: 2px solid #fff !important;
|
||||
}
|
||||
|
||||
/* table panel background color */
|
||||
.table-panel-container {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
/* table panel border size */
|
||||
.table-panel-table td {
|
||||
padding: .45em 0 .45em 1.1em;
|
||||
border-bottom: 1px solid #171819;
|
||||
border-right: 1px solid #171819;
|
||||
}
|
||||
/* Edit panel tabs */
|
||||
.tabbed-view-header {
|
||||
box-shadow: none;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border-bottom: none;
|
||||
}
|
||||
.tabbed-view-panel-title {
|
||||
padding-left: 10px;
|
||||
}
|
||||
/* worldmap zoom buttons and leaflet */
|
||||
.leaflet-bar a, .leaflet-bar a:hover {
|
||||
background-color: #1f1f1f !important;
|
||||
border-bottom: 1px solid #1f1f1f !important;
|
||||
color: white !important;
|
||||
}
|
||||
.leaflet-bar a:hover {
|
||||
background-color: #1b1b1b !important;
|
||||
}
|
||||
.leaflet-control-attribution {
|
||||
display: none;
|
||||
}
|
||||
/* New Dashboard */
|
||||
.add-panel__item {
|
||||
background: linear-gradient(135deg,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.25));
|
||||
box-shadow: -1px -1px 0 0 hsla(0,0%,100%,.1), 1px 1px 0 0 rgba(0, 0, 0, 0);
|
||||
}
|
||||
.add-panel__item.active, .add-panel__item:hover {
|
||||
background: linear-gradient(135deg,rgba(0, 0, 0, 0.25),rgba(0, 0, 0, 0.25));
|
||||
}
|
||||
.add-panel__header {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
box-shadow: none;
|
||||
border-bottom: 0px;
|
||||
}
|
||||
|
||||
@import url(https://theme-park.dev/CSS/themes/grafana/grafana-base.css);
|
||||
|
||||
:root {
|
||||
--main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #cc7b19;
|
||||
--button-color-hover: #e59029;
|
||||
--accent-color: #e5a00d;
|
||||
--accent-color-hover: #ffc107;
|
||||
}
|
||||
|
||||
|
||||
/*V7*/
|
||||
|
||||
/*LOGIN*/
|
||||
.css-bnbqsv {background: var(--main-bg-color)}
|
||||
.css-3iwqj4 { background: transparent;}
|
||||
#login-view > div > form > div:nth-child(1) > div:nth-child(2) > div > div > input, #login-view > div > form > div:nth-child(2) > div:nth-child(2) > div > div > input {
|
||||
height: 38px;
|
||||
}
|
||||
/*Buttons*/
|
||||
.css-y3nv3e-button,
|
||||
.css-cc7c9f-button,
|
||||
.css-1vlnne-button,
|
||||
.css-1ihbihm-button,
|
||||
.css-14zdxje-button,
|
||||
.css-179z9yx-button,
|
||||
.css-370vzt-button,
|
||||
.css-msayan-button,
|
||||
.css-19kbjxc-button,
|
||||
.gf-form-button-row a, .gf-form-button-row button,
|
||||
.page-action-bar>a, .page-action-bar>button,
|
||||
.btn-primary{
|
||||
background: var(--button-color) !important;
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
.css-y3nv3e-button:hover,
|
||||
.css-y3nv3e-button:focus,
|
||||
.css-cc7c9f-button:hover,
|
||||
.css-cc7c9f-button:focus,
|
||||
.css-1vlnne-button:hover,
|
||||
.css-1vlnne-button:focus,
|
||||
.css-1ihbihm-button:hover,
|
||||
.css-1ihbihm-button:focus,
|
||||
.css-14zdxje-button:hover,
|
||||
.css-14zdxje-button:focus,
|
||||
.css-179z9yx-button:hover,
|
||||
.css-179z9yx-button:focus,
|
||||
.css-370vzt-button:hover,
|
||||
.css-370vzt-button:focus,
|
||||
.css-msayan-button:hover,
|
||||
.css-msayan-button:focus,
|
||||
.css-19kbjxc-button:hover,
|
||||
.css-19kbjxc-button:focus,
|
||||
.gf-form-button-row a, .gf-form-button-row button:hover,
|
||||
.btn-primary:hover{
|
||||
color: rgb(255, 255, 255);
|
||||
background: var(--button-color-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.css-1d9e5zy-button {color: #fff; background: var(--button-color)}
|
||||
.css-1d9e5zy-button:hover {color: #fff; background: var(--button-color-hover)}
|
||||
|
||||
/*INPUT*/
|
||||
input:focus {box-shadow: none !important;}
|
||||
.css-17rc2pp-input-wrapper:focus, .css-1i9is3t:focus {
|
||||
box-shadow:none;
|
||||
color: transparent;
|
||||
}
|
||||
.gf-form-select-box__control--is-focused {
|
||||
border-color: transparent;
|
||||
outline: none;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.css-1bjepp-input-input {
|
||||
background-color: hsla(0,0%,100%,.25);
|
||||
border-radius: 3px;
|
||||
border-color: transparent;
|
||||
-webkit-transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
|
||||
transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
|
||||
}
|
||||
|
||||
.css-1bjepp-input-input:focus {
|
||||
box-shadow: none !important;
|
||||
background-color: white;
|
||||
color: black;
|
||||
transition: background-color .2s;
|
||||
-webkit-transition: background-color .2s;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.css-14hvfbu-input-wrapper:focus {
|
||||
border-color:transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.css-1w5c5dq-input-inputWrapper input:not(:last-child) {
|
||||
height: 100%
|
||||
}
|
||||
/*Disabled input*/
|
||||
.css-1bjepp-input-input:disabled {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
color: rgb(159, 167, 179);
|
||||
}
|
||||
.css-1bjepp-input-input:hover {border-color: transparent;}
|
||||
body > grafana-app > div > div > react-container > div > div > div.view > div > div.page-container.page-body > div:nth-child(2) > form > div > div > div > div.css-1w5c5dq-input-inputWrapper > input {height: 100%;}
|
||||
|
||||
|
||||
/* SEARCH */
|
||||
.css-x9mxj5 {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
.css-1m6pigl:focus + label {
|
||||
outline-offset: 2px;
|
||||
box-shadow: rgba(20, 22, 25, 0) 0px 0px 0px 2px, rgba(31, 97, 196, 0) 0px 0px 0px 4px !important;
|
||||
z-index: 3;
|
||||
outline: transparent dotted 2px;
|
||||
transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
|
||||
}
|
||||
.css-1m6pigl:checked + label {
|
||||
color: var(--accent-color) !important;
|
||||
border-color: rgba(255, 255, 255, .1);
|
||||
background: rgba(0, 0, 0, .5);
|
||||
}
|
||||
.css-b40tk8:focus + label {
|
||||
box-shadow: rgba(20, 22, 25, 0) 0px 0px 0px 2px, rgba(31, 97, 196, 0) 0px 0px 0px 4px !important;
|
||||
|
||||
}
|
||||
.css-y0yg3l {
|
||||
background: var(--main-bg-color);
|
||||
border-color: transparent;
|
||||
}
|
||||
.css-y0yg3l {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.css-1je3bh6 {
|
||||
background: transparent;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
/*Folder bars*/
|
||||
.css-1umfglk {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
.css-1umfglk:hover {
|
||||
background: rgba(0, 0, 0, .35);
|
||||
}
|
||||
|
||||
/* Login Error message*/
|
||||
.css-1ow9mne-input-input {
|
||||
line-height: 1.5;
|
||||
height: 38px;
|
||||
background-color: hsla(0,0%,100%,.25);
|
||||
border-radius: 3px;
|
||||
border-color: transparent;
|
||||
-webkit-transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
|
||||
transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
|
||||
}
|
||||
.css-1ow9mne-input-input {
|
||||
box-shadow: none !important;
|
||||
background-color: white;
|
||||
color: black;
|
||||
transition: background-color .2s;
|
||||
-webkit-transition: background-color .2s;
|
||||
height: 38px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.css-13o428a {
|
||||
margin: 10px 0px 0px;
|
||||
}
|
||||
|
||||
/*Welcome to Grafana*/
|
||||
.css-15xxblz,.css-1ld19yb {background: rgba(0, 0, 0, .25);}
|
||||
|
||||
.css-1as70ku, .css-u5zjuh {
|
||||
background: rgba(0, 0, 0, .25);}
|
||||
.css-17abkeq, .css-5ak73y {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
/* Import */
|
||||
body > grafana-app > div > div > react-container > div > div > div.view > div > div.page-container.page-body > form > div:nth-child(4) > div:nth-child(2) > div > div.css-1w5c5dq-input-inputWrapper > input {height:100%}
|
||||
|
||||
|
||||
/*PANEL EDIT*/
|
||||
|
||||
/*Header*/
|
||||
.css-1marj6o {
|
||||
display: flex;
|
||||
-webkit-box-pack: justify;
|
||||
justify-content: space-between;
|
||||
padding: 8px;
|
||||
background: transparent;
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
/*Background*/
|
||||
.css-azp59k {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
/*Query box*/
|
||||
.css-hz0utb {
|
||||
background: rgba(0, 0, 0, .35);
|
||||
border-right: 1px solid rgba(0, 0, 0, 0);
|
||||
}
|
||||
.query-keyword, .css-wvxxxy, .css-fpnw35 {
|
||||
font-weight: 500;
|
||||
color: var(--accent-color);
|
||||
}
|
||||
.css-lvafs5 {
|
||||
background: rgba(0, 0, 0, .5);
|
||||
}
|
||||
|
||||
.css-ui3sz4-activeTabStyle {
|
||||
margin-right: 16px;
|
||||
position: relative;
|
||||
display: block;
|
||||
color: rgb(216, 217, 218);
|
||||
cursor: default;
|
||||
list-style: none;
|
||||
padding: 11px 15px 9px;
|
||||
border-style: solid;
|
||||
border-image: initial;
|
||||
border-width: 0px 1px 1px;
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
border-color: transparent !important;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
overflow: hidden;
|
||||
}
|
||||
.css-1awj6q7-counter {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
color: rgb(255, 255, 255);
|
||||
}
|
||||
/*Transform tab*/
|
||||
.css-y2f54e {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
.css-y2f54e:hover {
|
||||
background: rgba(0, 0, 0, .35);
|
||||
}
|
||||
.css-1e8invk::before {
|
||||
background:rgba(0, 0, 0, .35) !important;
|
||||
}
|
||||
|
||||
/* Right side menu*/
|
||||
.css-1xj5tuf {
|
||||
background: rgba(0, 0, 0, .35);
|
||||
border-left: 1px solid transparent;
|
||||
}
|
||||
/*Dropdown bottom borders*/
|
||||
.css-1majipf {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .08);
|
||||
}
|
||||
/*Settings text input*/
|
||||
.css-1f38lle:focus {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.css-1gokw4e input:checked + label, .css-1gokw4e input:checked + label:hover {
|
||||
background: var(--accent-color);
|
||||
}
|
||||
.css-1gokw4e label {
|
||||
background: white;
|
||||
}
|
||||
/*Visualization*/
|
||||
.css-1lemfi9 {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
border-color: transparent;
|
||||
}
|
||||
.css-1fsv7gr:hover > div:first-child {
|
||||
border-color: var(--accent-color);
|
||||
}
|
||||
.css-1emhacm-currentVisualizationItem > div:first-child {
|
||||
outline-offset: 2px;
|
||||
box-shadow: rgb(20, 22, 25) 0px 0px 0px 2px, var(--accent-color) 0px 0px 0px 4px;
|
||||
}
|
||||
/*Old stat panel unit dropdown */
|
||||
body > grafana-app > div > div > react-container > div > div.css-azp59k > div.css-1bd2u9 > div > div.Pane.vertical.Pane2 > div > div > div.css-1xj5tuf > div > div.view > div:nth-child(3) > div:nth-child(1) > div.panel-options-group__body > panel-editor-tab > panel-editor-tab-singlestatoptions > div > div:nth-child(2) > div:nth-child(6) > unit-picker > div > div > div > div > input {
|
||||
height: 100%;
|
||||
}
|
||||
/*Buttons*/
|
||||
.css-m58wdd:hover {
|
||||
color: rgba(255, 255, 255, .94);
|
||||
z-index: 2;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: rgba(255, 255, 255, .1);
|
||||
border-image: initial;
|
||||
background: rgba(255, 255, 255, .15)
|
||||
}
|
||||
.css-m58wdd {
|
||||
color: rgba(255, 255, 255, .94);
|
||||
z-index: 2;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: rgba(255, 255, 255, 0);
|
||||
border-image: initial;
|
||||
background: rgba(255, 255, 255, .08)
|
||||
}
|
||||
input:checked+.gf-form-switch__slider {
|
||||
background: var(--accent-color);
|
||||
}
|
||||
/* RuPaul Drag Line*/
|
||||
.css-pii3u7:hover {
|
||||
border-color: rgba(255, 255, 255, .25);
|
||||
}
|
||||
|
||||
.css-1t13ra6 {
|
||||
border-color: rgba(255, 255, 255, .09);
|
||||
}
|
||||
.css-1t13ra6:hover {
|
||||
border-color: rgba(255, 255, 255, .25);
|
||||
}
|
||||
|
||||
/*SETTINGS*/
|
||||
/*Teams*/
|
||||
.css-1w9m9al-call-to-action-card {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
|
||||
/*DASHBOARD SETINGS*/
|
||||
.dashboard-settings,.dashboard-settings__body2 {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
.navbar--edit {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
border-bottom: 1px solid transparent;
|
||||
-webkit-box-shadow: 0 0 10px transparent;
|
||||
box-shadow: 0 0 10px transparent;
|
||||
}
|
||||
.grafana-info-box {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
border-top: 3px solid var(--accent-color);
|
||||
}
|
||||
/* Variables*/
|
||||
.filter-table--hover tbody tr:hover {
|
||||
background: hsla(0,0%,100%,.15);
|
||||
}
|
||||
.filter-table tbody tr:nth-child(odd):hover {
|
||||
background: hsla(0,0%,100%,.15) !important;
|
||||
}
|
||||
/*Placeholder text*/
|
||||
::placeholder {color: #fff !important;}
|
||||
:-ms-input-placeholder {color: #fff !important;}
|
||||
::-webkit-input-placeholder {color: #fff !important;}
|
||||
642
CSS/themes/guacamole/guacamole-base.css
Normal file
642
CSS/themes/guacamole/guacamole-base.css
Normal file
@ -0,0 +1,642 @@
|
||||
/* 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 */
|
||||
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
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) !important;
|
||||
}
|
||||
|
||||
div.displayMiddle {
|
||||
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;
|
||||
}
|
||||
|
||||
input::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
input:focus::-webkit-input-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Firefox < 19 */
|
||||
input:-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
input:focus:-moz-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Firefox > 19 */
|
||||
input::-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
input:focus::-moz-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Internet Explorer 10 */
|
||||
input:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
input:focus:-ms-input-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* LOGIN MENU */
|
||||
div.login-ui {
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.login-ui div.login-dialog {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
border: none;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
button,
|
||||
a.button {
|
||||
background-color: var(--button-color);
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
input[type="submit"]:hover,
|
||||
button:hover,
|
||||
a.button:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-ui .login-fields .labeled-field input:focus {
|
||||
background: rgba(0, 0, 0, 0.45) !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.login-ui .login-fields .labeled-field.empty input {
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.login-ui .login-fields .labeled-field.empty input:focus {
|
||||
background: rgba(0, 0, 0, 0.45) !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.login-ui .login-dialog .login-fields input {
|
||||
background-color: rgba(0, 0, 0, 0.45) !important;
|
||||
}
|
||||
|
||||
div.location,
|
||||
input[type=text],
|
||||
input[type=email],
|
||||
input[type=number],
|
||||
input[type=password],
|
||||
textarea {
|
||||
color: white !important;
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
input[type=checkbox],
|
||||
input[type=number],
|
||||
input[type=text],
|
||||
input[type=email],
|
||||
input[type=radio],
|
||||
textarea {
|
||||
color: var(--text-hover) !important;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* HOME MENU */
|
||||
.header h2 {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.connection .icon.vnc,
|
||||
.connection .icon.rdp {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-monitor.png);
|
||||
}
|
||||
|
||||
.connection .icon.ssh,
|
||||
.connection .icon.telnet {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-text.png);
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-title {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-user.png);
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/"] {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-home-dark.png);
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/users"],
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/connections"],
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/sessions"],
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/preferences"] {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-config-dark.png);
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-contents li a.logout {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-logout-dark.png);
|
||||
}
|
||||
|
||||
.icon.user {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-user.png);
|
||||
}
|
||||
|
||||
.pager .icon.first-page {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-first-page.png);
|
||||
}
|
||||
|
||||
.pager .icon.prev-page {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-prev-page.png);
|
||||
}
|
||||
|
||||
.pager .icon.next-page {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-next-page.png);
|
||||
}
|
||||
|
||||
.pager .icon.last-page {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-last-page.png);
|
||||
}
|
||||
|
||||
.loading::before {
|
||||
background-image: url('https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/cog.png');
|
||||
}
|
||||
|
||||
table.sorted th.sort-primary.sort-descending:after {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/up.png);
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-indicator {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/down.png);
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-indicator:hover {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/down.png);
|
||||
color: #f9be03;
|
||||
}
|
||||
|
||||
table.sorted th.sort-primary:after {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/down.png);
|
||||
}
|
||||
|
||||
thead {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
table.sorted th,
|
||||
table.sorted td {
|
||||
border: 1px solid rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
.settings table.session-list tr.session:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.menu-dropdown.open,
|
||||
.menu-dropdown.open:hover {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.menu-dropdown {
|
||||
border-left: none;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-contents li a {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
padding: .75em;
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-contents li a.current,
|
||||
.menu-dropdown .menu-contents li a.current:hover {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-contents li a:hover {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.menu-dropdown:hover {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-contents {
|
||||
background: var(--drop-down-menu-bg);
|
||||
|
||||
}
|
||||
|
||||
.header .filter input {
|
||||
-moz-border-radius: 0;
|
||||
-webkit-border-radius: 0;
|
||||
-khtml-border-radius: 0;
|
||||
border-radius: 0;
|
||||
border: 0;
|
||||
border-left: 1px solid rgba(0, 0, 0, 0.125);
|
||||
background-color: transparent;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.header .filter {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.filter .search-string {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/magnifier.png) !important;
|
||||
background-repeat: no-repeat !important;
|
||||
background-size: 1.75em !important;
|
||||
background-position: .25em center !important;
|
||||
padding: .5em !important;
|
||||
padding-left: 2.25em !important;
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 0;
|
||||
}
|
||||
|
||||
div.location,
|
||||
input[type=text],
|
||||
input[type=email],
|
||||
input[type=number],
|
||||
input[type=password],
|
||||
textarea {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
|
||||
.user a:visited,
|
||||
.connection a:visited,
|
||||
.connection-group a:visited {
|
||||
text-decoration: none;
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.recent-connections .connection:hover {
|
||||
background: hsla(0, 0%, 100%, 0.08);
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.list-item:not(.selected) .caption:hover {
|
||||
background: hsla(0, 0%, 100%, 0.07);
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.list-item .name {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.list-item:not(.selected) .caption:hover .name {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
/* SIDE MENU */
|
||||
.menu,
|
||||
.menu .header {
|
||||
background: var(--modal-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;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.menu-content,
|
||||
.menu-content .header,
|
||||
.menu-body {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.clipboard,
|
||||
.clipboard-service-target {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* NOTIFICATION BOX */
|
||||
.notification.error {
|
||||
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;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.notification {
|
||||
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;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
.page-tabs .page-list li a[href]:visited {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.page-tabs .page-list li a[href] {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.page-tabs .page-list li a[href]:hover {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.user a:visited,
|
||||
.connection a:visited,
|
||||
.connection-group a:visited {
|
||||
text-decoration: none;
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.user a:hover,
|
||||
.user-group a:hover,
|
||||
.connection a:hover,
|
||||
.connection-group a:hover,
|
||||
a.ng-binding:hover:not(.add-user):not(.button) {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.user a,
|
||||
.connection a,
|
||||
.connection-group a,
|
||||
a.ng-binding:not(.add-user):not(.button) {
|
||||
text-decoration: none;
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
div.location,
|
||||
input[type=text],
|
||||
input[type=email],
|
||||
input[type=number],
|
||||
input[type=password],
|
||||
textarea {
|
||||
border: 0;
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.location-chooser .dropdown {
|
||||
background: #666;
|
||||
}
|
||||
|
||||
/* USER SETTINGS */
|
||||
.page-tabs .page-list li a[href],
|
||||
.section-tabs li a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.page-tabs .page-list li a[href].current,
|
||||
.page-tabs .page-list li a[href].current:hover,
|
||||
.section-tabs li a.current,
|
||||
.section-tabs li a.current:hover {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
cursor: default;
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.page-tabs .page-list li a[href]:hover,
|
||||
.section-tabs li a:hover {
|
||||
background-color: hsla(0, 0%, 100%, 0.07);
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.manage-user .page-tabs .page-list li.linked a[href]:before {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/checkmark.png);
|
||||
}
|
||||
|
||||
.manage-user .page-tabs .page-list li.read-only a[href]:before {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/lock.png);
|
||||
}
|
||||
|
||||
.manage-user .notice.read-only {
|
||||
background: hsla(0, 0%, 100%, 0.07);
|
||||
}
|
||||
|
||||
/* DUA 2FA PAGE */
|
||||
.duo-signature-response-field {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.base-wrapper {
|
||||
border: 1px solid transparent !important;
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.base-body {
|
||||
background-color: #333 !important;
|
||||
}
|
||||
|
||||
h1.spacious-frame-view {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
@media screen and (-webkit-max-device-pixel-ratio: 1.25),
|
||||
screen and (max-resolution: 120dpi) {
|
||||
|
||||
h1,
|
||||
.h1 {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.white-wrapper {
|
||||
background-color: #333 !important;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
form:not(.inline) fieldset {
|
||||
background-color: #333 !important;
|
||||
}
|
||||
|
||||
label span {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
input[type=radio] {
|
||||
border: 1px solid var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Connection */
|
||||
|
||||
#connection-warning {
|
||||
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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* File Transfer */
|
||||
#file-transfer-dialog .transfer-manager {
|
||||
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;
|
||||
}
|
||||
|
||||
.transfer.error {
|
||||
background: rgba(244, 67, 54, 0.5);
|
||||
}
|
||||
|
||||
.transfer-manager .header h2 {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.transfer .in-progress .progress {
|
||||
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;
|
||||
}
|
||||
|
||||
.related-objects .abbreviated-related-objects ul li {
|
||||
display: inline-block;
|
||||
margin: .25em;
|
||||
padding: .25em;
|
||||
border: 1px solid rgb(var(--accent-color));
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.related-objects .abbreviated-related-objects ul li label span {
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
441
CSS/themes/jackett/jackett-base.css
Normal file
441
CSS/themes/jackett/jackett-base.css
Normal file
@ -0,0 +1,441 @@
|
||||
/* 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 */
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
body {
|
||||
background-repeat: repeat;
|
||||
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,
|
||||
#header-title {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top-color: rgb(var(--accent-color), .25);
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_length,
|
||||
.dataTables_wrapper .dataTables_filter,
|
||||
.dataTables_wrapper .dataTables_info,
|
||||
.dataTables_wrapper .dataTables_processing,
|
||||
.dataTables_wrapper .dataTables_paginate,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
|
||||
color: #fff !important;
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button.current:active,
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
|
||||
color: var(--button-text-hover) !important;
|
||||
border: 1px solid var(--button-color-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
background: var(--button-color-hover) !important;
|
||||
box-shadow: inset 0 0 3px var(--button-color-hover);
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button {
|
||||
color: var(--button-text) !important;
|
||||
border: 1px solid transparent;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
border: 1px solid var(--button-color-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
background: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:focus,
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.dataTables_wrapper .dataTables_filter input {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border: none;
|
||||
outline: none;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
table.dataTable.cell-border tbody tr:first-child th,
|
||||
table.dataTable.cell-border tbody tr:first-child td {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
table.dataTable.cell-border tbody tr th:first-child,
|
||||
table.dataTable.cell-border tbody tr td:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
table.dataTable.cell-border tbody th,
|
||||
table.dataTable.cell-border tbody td {
|
||||
border-top: 1px solid #ddd0;
|
||||
border-right: 1px solid #0000;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
textarea {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
||||
#page {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
table.dataTable.stripe tbody tr.odd,
|
||||
table.dataTable.display tbody tr.odd {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
table.dataTable.hover tbody tr:hover,
|
||||
table.dataTable.display tbody tr:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
table.dataTable tbody tr {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
table.dataTable tfoot th,
|
||||
table.dataTable tfoot td {
|
||||
border-top: 1px solid #0000;
|
||||
}
|
||||
|
||||
table.dataTable thead th,
|
||||
table.dataTable thead td {
|
||||
border-bottom: 1px solid #0000;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid #ccc0;
|
||||
|
||||
}
|
||||
|
||||
select {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: var(--text) !important;
|
||||
border: 1px solid rgba(0, 0, 0, 0) !important;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
||||
box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
||||
height: 26px;
|
||||
padding: 0 8px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1f1f1f !important;
|
||||
color: var(--text) !important;
|
||||
border: 1px solid #1f1f1f !important;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
||||
}
|
||||
|
||||
.form-control:focus:not([checked="checked"]) {
|
||||
border-color: rgb(var(--accent-color));
|
||||
outline: 0;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(var(--accent-color), .6);
|
||||
box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(var(--accent-color), .6);
|
||||
}
|
||||
|
||||
.form-control[disabled],
|
||||
.form-control[readonly],
|
||||
fieldset[disabled] .form-control {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.dataTables_length select,
|
||||
.dataTables_filter input,
|
||||
.dataTable.compact tfoot td select {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid rgba(204, 204, 204, 0);
|
||||
}
|
||||
|
||||
#footer {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-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;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a:focus,
|
||||
.dropdown-menu>li>a:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.dropdown-menu>.active>a,
|
||||
.dropdown-menu>.active>a:focus,
|
||||
.dropdown-menu>.active>a:hover {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-default.active,
|
||||
.btn-default.focus,
|
||||
.btn-default:active,
|
||||
.btn-default:focus,
|
||||
.btn-default:hover,
|
||||
.open>.dropdown-toggle.btn-default {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary.active,
|
||||
.btn-primary.focus,
|
||||
.btn-primary:active,
|
||||
.btn-primary:focus,
|
||||
.btn-primary:hover,
|
||||
.open>.dropdown-toggle.btn-primary {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary.active,
|
||||
.btn-primary:active,
|
||||
.open>.dropdown-toggle.btn-primary {
|
||||
background-image: none
|
||||
}
|
||||
|
||||
.btn-primary.disabled,
|
||||
.btn-primary.disabled.active,
|
||||
.btn-primary.disabled.focus,
|
||||
.btn-primary.disabled:active,
|
||||
.btn-primary.disabled:focus,
|
||||
.btn-primary.disabled:hover,
|
||||
.btn-primary[disabled],
|
||||
.btn-primary[disabled].active,
|
||||
.btn-primary[disabled].focus,
|
||||
.btn-primary[disabled]:active,
|
||||
.btn-primary[disabled]:focus,
|
||||
.btn-primary[disabled]:hover,
|
||||
fieldset[disabled] .btn-primary,
|
||||
fieldset[disabled] .btn-primary.active,
|
||||
fieldset[disabled] .btn-primary.focus,
|
||||
fieldset[disabled] .btn-primary:active,
|
||||
fieldset[disabled] .btn-primary:focus,
|
||||
fieldset[disabled] .btn-primary:hover {
|
||||
background-color: hsla(0, 0%, 100%, 0.35);
|
||||
border-color: hsla(0, 0%, 100%, 0.35);
|
||||
}
|
||||
|
||||
.btn-primary .badge {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#page>form>div:nth-child(2)>input[type=submit] {
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
border-radius: 3px;
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
#page>form>div:nth-child(2)>input[type=submit]:hover,
|
||||
#page>form>div:nth-child(2)>input[type=submit]:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
color: #fff;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid #0000;
|
||||
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
color: #ffffff;
|
||||
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: transparent;
|
||||
}
|
||||
|
||||
pre {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.jackettlogWarn,
|
||||
.jackettlogWarn pre {
|
||||
background-color: #FFFF8E !important;
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
.indexer-caps {
|
||||
padding: 0 15px 15px 15px;
|
||||
border-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#logo {
|
||||
filter: invert(1);
|
||||
}
|
||||
936
CSS/themes/jellyfin/jellyfin-base.css
Normal file
936
CSS/themes/jellyfin/jellyfin-base.css
Normal file
@ -0,0 +1,936 @@
|
||||
:root {
|
||||
--theme-primary-color: var(--accent-color);
|
||||
--theme-text-color: var(--text);
|
||||
--theme-text-color-opaque: var(--text-hover);
|
||||
--theme-accent-text-color: var(--accent-color);
|
||||
--theme-primary-color-lightened: var(--accent-color-hover);
|
||||
--theme-icon-focus-background: rgba(var(--accent-color), 0.2);
|
||||
|
||||
--theme-background: var(--main-bg-color);
|
||||
--header-blur-background: rgba(20, 20, 20, 0.66);
|
||||
--drawer-background: #2C2C2E;
|
||||
--docked-drawer-background: rgba(0, 0, 0, 0.25);
|
||||
--button-background: var(--button-color);
|
||||
--card-background: rgba(0, 0, 0, 0.15);
|
||||
--footer-background: var(--modal-footer-color);
|
||||
--footer-blur-background: rgba(29, 29, 31, 0.66);
|
||||
|
||||
--header-background: var(--theme-background);
|
||||
--theme-body-secondary-text-color: rgba(255, 255, 255, .6);
|
||||
--line-background: rgba(255, 255, 255, .08);
|
||||
--line-size: .08em;
|
||||
--scrollbar-thumb-background: rgba(255, 255, 255, .3);
|
||||
}
|
||||
|
||||
@media (pointer: fine) {
|
||||
:not(.layout-tv):root {
|
||||
--theme-background: var(--main-bg-color);
|
||||
--header-blur-background: rgba(20, 20, 20, 0.66);
|
||||
--drawer-background: #2C2C2E;
|
||||
--docked-drawer-background: rgba(0, 0, 0, 0.25);
|
||||
--button-background: #1f1f1f;
|
||||
--card-background: rgba(0, 0, 0, 0.15);
|
||||
--footer-background: var(--modal-footer-color);
|
||||
--footer-blur-background: rgba(29, 29, 31, 0.66);
|
||||
}
|
||||
}
|
||||
|
||||
.layout-tv:root {
|
||||
--theme-background: var(--main-bg-color);
|
||||
--header-blur-background: rgba(20, 20, 20, 0.66);
|
||||
--drawer-background: #2C2C2E;
|
||||
--docked-drawer-background: rgba(0, 0, 0, 0.25);
|
||||
--button-background: #1f1f1f;
|
||||
--card-background: rgba(0, 0, 0, 0.15);
|
||||
--footer-background: var(--modal-footer-color);
|
||||
--footer-blur-background: rgba(29, 29, 31, 0.66);
|
||||
}
|
||||
|
||||
/*TP CUSTOM */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.inputLabel {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
a:not(.emby-button),
|
||||
.cardText.cardTextCentered.cardText-first>button,
|
||||
.emby-linkbutton>a {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
a:hover:not(.emby-button),
|
||||
.cardText.cardTextCentered.cardText-first>button:hover,
|
||||
.emby-linkbutton>a:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
/*TP END*/
|
||||
|
||||
html {
|
||||
color: var(--theme-text-color);
|
||||
scrollbar-color: var(--scrollbar-thumb-background) transparent
|
||||
}
|
||||
|
||||
.emby-collapsible-button {
|
||||
border-color: var(--line-background) !important
|
||||
}
|
||||
|
||||
.skinHeader-withBackground.skinHeader-withfulldrawer {
|
||||
border-bottom: .08em solid var(--line-background)
|
||||
}
|
||||
|
||||
.skinHeader-withBackground {
|
||||
background: var(--header-background);
|
||||
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;
|
||||
}
|
||||
|
||||
.appfooter,
|
||||
.formDialogFooter:not(.formDialogFooter-clear) {
|
||||
background: var(--footer-background);
|
||||
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;
|
||||
}
|
||||
|
||||
.formDialogHeader:not(.formDialogHeader-clear) {
|
||||
background: var(--modal-header-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;
|
||||
}
|
||||
|
||||
.dialog {
|
||||
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;
|
||||
}
|
||||
|
||||
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
|
||||
.skinHeader-withBackground {
|
||||
background: var(--header-blur-background);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em)
|
||||
}
|
||||
|
||||
.appfooter-withbackdropfilter {
|
||||
background: var(--footer-blur-background);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em)
|
||||
}
|
||||
}
|
||||
|
||||
.skinHeader.semiTransparent {
|
||||
-webkit-backdrop-filter: none !important;
|
||||
backdrop-filter: none !important;
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0)));
|
||||
background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
|
||||
background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
|
||||
background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
border-bottom: 0;
|
||||
color: rgba(255, 255, 255, .87)
|
||||
}
|
||||
|
||||
|
||||
.backgroundContainer:not(.backgroundContainer.withBackdrop),
|
||||
html {
|
||||
background: var(--theme-background);
|
||||
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;
|
||||
}
|
||||
|
||||
.backgroundContainer.withBackdrop {
|
||||
background-color: rgba(0, 0, 0, .83)
|
||||
}
|
||||
|
||||
@media not all and (min-width: 50em) {
|
||||
.itemBackgroundContainer.withBackdrop {
|
||||
background: var(--theme-background);
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
.paper-icon-button-light-tv:focus,
|
||||
.paper-icon-button-light:active {
|
||||
color: rgb(var(--theme-primary-color));
|
||||
background-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
|
||||
@media(hover: hover) and (pointer:fine) {
|
||||
.paper-icon-button-light:focus {
|
||||
color: rgb(var(--theme-primary-color));
|
||||
background-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
}
|
||||
|
||||
.fab,
|
||||
.raised {
|
||||
background: var(--button-background);
|
||||
color: var(--theme-text-color)
|
||||
}
|
||||
|
||||
.detailButton-icon {
|
||||
background: none !important;
|
||||
border-color: rgba(255, 255, 255, .3)
|
||||
}
|
||||
|
||||
.emby-select-withcolor {
|
||||
color: inherit;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border: var(--line-size) solid transparent
|
||||
}
|
||||
|
||||
.toast {
|
||||
background: var(--button-background);
|
||||
color: var(--theme-text-color)
|
||||
}
|
||||
|
||||
.dialog-blur,
|
||||
.toast {
|
||||
background: var(--button-background) !important;
|
||||
color: var(--theme-text-color) !important;
|
||||
}
|
||||
|
||||
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
|
||||
|
||||
.detailButton-icon:not(.playstatebutton-icon-unplayed),
|
||||
.emby-select-withcolor.detailTrackSelect,
|
||||
.fab,
|
||||
.raised:not(.nobackdropfilter) {
|
||||
background: rgba(85, 85, 85, .3);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em)
|
||||
}
|
||||
|
||||
.dialog-blur,
|
||||
.toast {
|
||||
color: #fff;
|
||||
background: rgba(56, 56, 56, .76);
|
||||
-webkit-backdrop-filter: blur(2.5em) saturate(1.8);
|
||||
backdrop-filter: blur(2.5em) saturate(1.8);
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important
|
||||
}
|
||||
|
||||
.toast-large {
|
||||
color: rgba(255, 255, 255, .87)
|
||||
}
|
||||
}
|
||||
|
||||
.fab:focus,
|
||||
.raised:focus {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.button-submit:not(.emby-button-tv) {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text)
|
||||
}
|
||||
|
||||
.button-submit:not(.emby-button-tv):focus {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover)
|
||||
}
|
||||
|
||||
.emby-select-withcolor>option {
|
||||
color: inherit;
|
||||
background: var(--button-background)
|
||||
}
|
||||
|
||||
.emby-select-withcolor:focus {
|
||||
border-color: rgb(var(--theme-primary-color)) !important
|
||||
}
|
||||
|
||||
.emby-select-tv-withcolor:focus {
|
||||
background-color: rgb(var(--theme-primary-color)) !important;
|
||||
color: var(--label-text-color) !important
|
||||
}
|
||||
|
||||
.checkboxLabel {
|
||||
color: inherit
|
||||
}
|
||||
|
||||
.emby-checkbox-focusring:focus:before {
|
||||
background-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
|
||||
.inputLabelFocused,
|
||||
.selectLabelFocused,
|
||||
.textareaLabelFocused {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.button-link {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
.button-link:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.button-flat-accent {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.paperList,
|
||||
.visualCardBox {
|
||||
background-color: var(--card-background)
|
||||
}
|
||||
|
||||
.collapseContent {
|
||||
border: var(--line-size) solid var(--line-background)
|
||||
}
|
||||
|
||||
.fieldDescription,
|
||||
.listItemBodyText-secondary,
|
||||
.secondaryText {
|
||||
color: var(--theme-body-secondary-text-color)
|
||||
}
|
||||
|
||||
.cardText-secondary {
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.cardText-first {
|
||||
color: var(--theme-text-color-opaque)
|
||||
}
|
||||
|
||||
.actionsheetDivider {
|
||||
background: var(--line-background)
|
||||
}
|
||||
|
||||
@media(hover: hover) and (pointer:fine) {
|
||||
.actionSheetMenuItem:hover {
|
||||
background-color: rgba(255, 255, 255, .2);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.selectionCommandsPanel {
|
||||
background: rgb(rgb(var(--theme-primary-color)));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.itemSelectionCount {
|
||||
color: var(--label-text-color) !important;
|
||||
|
||||
}
|
||||
|
||||
.upNextDialog-countdownText {
|
||||
color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.alphaPickerButton {
|
||||
color: var(--theme-body-secondary-text-color);
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.alphaPickerButton-selected {
|
||||
color: var(--theme-text-color-opaque)
|
||||
}
|
||||
|
||||
.alphaPickerButton-tv:focus {
|
||||
background-color: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color) !important
|
||||
}
|
||||
|
||||
.detailTableBodyRow-shaded:nth-child(even) {
|
||||
background: #1c1c1c;
|
||||
background: rgba(30, 30, 30, .9)
|
||||
}
|
||||
|
||||
.listItem-border {
|
||||
border-color: var(--line-background) !important
|
||||
}
|
||||
|
||||
.listItem-focusscale:focus {
|
||||
background: rgba(54, 54, 54, .8)
|
||||
}
|
||||
|
||||
.listItemIcon:not(.listItemIcon-transparent) {
|
||||
background-color: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.progressring-spiner {
|
||||
border-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.mediaInfoText {
|
||||
background: var(--button-background)
|
||||
}
|
||||
|
||||
.starIcon {
|
||||
color: #cb272a
|
||||
}
|
||||
|
||||
.mediaInfoTimerIcon {
|
||||
color: #cb272a
|
||||
}
|
||||
|
||||
.emby-input,
|
||||
.emby-textarea {
|
||||
color: inherit;
|
||||
background: rgb(0 0 0 / 25%);
|
||||
border: var(--line-size) solid rgba(255, 255, 255, 0.1)
|
||||
}
|
||||
|
||||
.emby-input:focus,
|
||||
.emby-textarea:focus {
|
||||
border-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span:before {
|
||||
border-color: currentColor
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span:before {
|
||||
border-color: rgb(var(--theme-primary-color)) !important;
|
||||
background-color: rgb(var(--theme-primary-color)) !important;
|
||||
|
||||
}
|
||||
|
||||
.checkboxLabel::after,
|
||||
.checkboxIcon {
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.itemProgressBarForeground {
|
||||
background-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.itemProgressBarForeground-recording {
|
||||
background-color: #cb272a
|
||||
}
|
||||
|
||||
.countIndicator {
|
||||
background: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.playedIndicator {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.mainDrawer {
|
||||
background: var(--drawer-background)
|
||||
}
|
||||
|
||||
.drawer-docked {
|
||||
background: var(--docked-drawer-background);
|
||||
border-right: var(--line-size) solid var(--line-background)
|
||||
}
|
||||
|
||||
@media(hover: hover) and (pointer:fine) {
|
||||
.navMenuOption:hover {
|
||||
background: #303030
|
||||
}
|
||||
}
|
||||
|
||||
.navMenuOption-selected {
|
||||
background-color: var(--theme-icon-focus-background) !important;
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.emby-button-focusscale:focus,
|
||||
.emby-button-focusscale:focus .detailButton-icon {
|
||||
background: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color)
|
||||
}
|
||||
|
||||
.emby-tab-button {
|
||||
color: var(--theme-body-secondary-text-color)
|
||||
}
|
||||
|
||||
.emby-tab-button-active {
|
||||
color: rgb(var(--theme-accent-text-color))
|
||||
}
|
||||
|
||||
.emby-tab-button-active.emby-button-tv {
|
||||
color: var(--theme-text-color-opaque)
|
||||
}
|
||||
|
||||
.emby-tab-button.emby-button-tv:focus {
|
||||
color: rgb(var(--accent-color));
|
||||
background: 0 0
|
||||
}
|
||||
|
||||
.emby-button {
|
||||
outline-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.channelCell,
|
||||
.guide-headerTimeslots,
|
||||
.timeslotHeaders {
|
||||
background: var(--theme-background);
|
||||
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;
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
.channelCell-mobilefocus {
|
||||
background: var(--theme-background) !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;
|
||||
}
|
||||
}
|
||||
|
||||
.channelCell-mobilefocus:not(:focus-visible) {
|
||||
background: var(--theme-background) !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;
|
||||
}
|
||||
|
||||
.channelCell-mobilefocus:not(:-moz-focusring) {
|
||||
background: var(--theme-background) !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;
|
||||
}
|
||||
|
||||
.channelCell,
|
||||
.epgRow,
|
||||
.programCell {
|
||||
border-color: rgba(255, 255, 255, .05)
|
||||
}
|
||||
|
||||
.guide-currentTimeIndicatorDot {
|
||||
border-right-color: var(--theme-icon-focus-background)
|
||||
}
|
||||
|
||||
.guide-currentTimeIndicatorDot:after {
|
||||
border-top-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.firstChannelCell {
|
||||
border-color: transparent
|
||||
}
|
||||
|
||||
.programCell-sports {
|
||||
background: #3949ab !important
|
||||
}
|
||||
|
||||
.programCell-movie {
|
||||
background: #5e35b1 !important
|
||||
}
|
||||
|
||||
.programCell-kids {
|
||||
background: #039be5 !important
|
||||
}
|
||||
|
||||
.programCell-news {
|
||||
background: #43a047 !important
|
||||
}
|
||||
|
||||
.channelCell:focus,
|
||||
.programCell:focus {
|
||||
background-color: rgb(var(--theme-primary-color));
|
||||
color: var(--label-text-color)
|
||||
}
|
||||
|
||||
.guide-programTextIcon {
|
||||
color: #1e1e1e;
|
||||
background: #555
|
||||
}
|
||||
|
||||
.infoBanner {
|
||||
background: var(--card-background);
|
||||
padding: 1em;
|
||||
-webkit-border-radius: .3em;
|
||||
border-radius: .3em
|
||||
}
|
||||
|
||||
.ratingbutton-icon-withrating {
|
||||
color: #c33 !important
|
||||
}
|
||||
|
||||
.downloadbutton-icon-on {
|
||||
color: #4285f4
|
||||
}
|
||||
|
||||
.downloadbutton-icon-complete {
|
||||
color: #4285f4
|
||||
}
|
||||
|
||||
.playstatebutton-icon-played {
|
||||
color: #c33 !important
|
||||
}
|
||||
|
||||
.repeatButton-active {
|
||||
color: #4285f4
|
||||
}
|
||||
|
||||
.card:focus .card-focuscontent {
|
||||
border-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.cardContent-button {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.cardContent-shadow {
|
||||
background-color: var(--card-background)
|
||||
}
|
||||
|
||||
.defaultCardBackground0 {
|
||||
background-color: var(--card-background)
|
||||
}
|
||||
|
||||
.defaultCardBackground1 {
|
||||
background-color: #d2b019
|
||||
}
|
||||
|
||||
.defaultCardBackground2 {
|
||||
background-color: #338abb
|
||||
}
|
||||
|
||||
.defaultCardBackground3 {
|
||||
background-color: #6b689d
|
||||
}
|
||||
|
||||
.defaultCardBackground4 {
|
||||
background-color: #dd452b
|
||||
}
|
||||
|
||||
.defaultCardBackground5 {
|
||||
background-color: #5ccea9
|
||||
}
|
||||
|
||||
.cardOverlayButtonIcon {
|
||||
background-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.cardScalable.cardPadder-portrait>div>button>i {
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track-piece {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--scrollbar-thumb-background)
|
||||
}
|
||||
|
||||
.emby-slider-background {
|
||||
background: var(--scrollbar-thumb-background)
|
||||
}
|
||||
|
||||
.emby-slider {
|
||||
color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-moz-range-track {
|
||||
background: #444
|
||||
}
|
||||
|
||||
.emby-slider::-moz-range-progress {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-webkit-slider-thumb {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-moz-range-thumb {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider::-ms-thumb {
|
||||
background: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.emby-slider-background-lower {
|
||||
background-color: rgb(var(--theme-primary-color))
|
||||
}
|
||||
|
||||
.scrollbuttoncontainer {
|
||||
color: #fff;
|
||||
background: rgba(20, 20, 20, .5)
|
||||
}
|
||||
|
||||
.recordingIcon-active {
|
||||
color: #c33 !important
|
||||
}
|
||||
|
||||
.searchTabsContainer {
|
||||
border-bottom: var(--line-size) solid var(--line-background)
|
||||
}
|
||||
|
||||
.emby-search-tab-button.emby-tab-button-active {
|
||||
background: rgb(var(--accent-color)) !important
|
||||
}
|
||||
|
||||
.textActionButton.dragging {
|
||||
background: var(--button-background) !important
|
||||
}
|
||||
|
||||
.dragging-over.full-drop-target {
|
||||
background: rgb(var(--theme-primary-color)) !important;
|
||||
color: var(--label-text-color) !important
|
||||
}
|
||||
|
||||
.dragging-over-top:before {
|
||||
background: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.dragging-over-bottom:after {
|
||||
background: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
|
||||
/* TP CUSTOM */
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
.navMenuOption:hover:not(.navMenuOption-selected) {
|
||||
background: 0 !important;
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.mainDrawer {
|
||||
background: var(--header-background);
|
||||
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;
|
||||
}
|
||||
|
||||
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
|
||||
.mainDrawer {
|
||||
background: var(--header-blur-background);
|
||||
-webkit-backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
backdrop-filter: saturate(1.8) blur(1.5em);
|
||||
}
|
||||
}
|
||||
|
||||
.jstree-default .jstree-clicked {
|
||||
background: rgb(var(--accent-color));
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.cardImageIcon {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dialog .inputLabelFocused,
|
||||
.selectLabelFocused,
|
||||
.textareaLabelFocused {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
/* JELLYFIN */
|
||||
|
||||
@media (hover: hover) and (pointer: fine) {
|
||||
.paper-icon-button-light:hover:not(:disabled) {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
background-color: var(--theme-icon-focus-background);
|
||||
}
|
||||
}
|
||||
|
||||
.paper-icon-button-light:active:not(:disabled) {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
background-color: var(--theme-icon-focus-background);
|
||||
}
|
||||
|
||||
.paper-icon-button-light.show-focus:focus {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.button-submit {
|
||||
background: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.button-submit:focus {
|
||||
background: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.inputLabelFocused,
|
||||
.selectLabelFocused,
|
||||
.textareaLabelFocused {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.itemSelectionPanel {
|
||||
border: 1px solid rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.selectionCommandsPanel {
|
||||
background: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.upNextDialog-countdownText {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.alphaPickerButton-tv:focus {
|
||||
background-color: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.progressring-spiner {
|
||||
border-color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.button-flat:hover {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.button-link {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.emby-input:focus,
|
||||
.emby-textarea:focus {
|
||||
border-color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.emby-select-withcolor:focus {
|
||||
border-color: rgb(var(--theme-accent-text-color)) !important;
|
||||
}
|
||||
|
||||
.emby-select-tv-withcolor:focus {
|
||||
background-color: rgb(var(--theme-accent-text-color)) !important;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+.checkboxOutline {
|
||||
border-color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.countIndicator,
|
||||
.fullSyncIndicator,
|
||||
.playedIndicator {
|
||||
background: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.navMenuOption-selected {
|
||||
background: rgb(var(--theme-accent-text-color)) !important;
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.emby-button.show-focus:focus {
|
||||
background: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.emby-tab-button.show-focus:focus {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.emby-tab-button:hover {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.guide-channelHeaderCell:focus,
|
||||
.programCell:focus {
|
||||
background-color: rgb(var(--theme-accent-text-color)) !important;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.guide-date-tab-button.emby-tab-button-active,
|
||||
.guide-date-tab-button:focus {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.guide-date-tab-button.show-focus:focus {
|
||||
background-color: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.buttonActive {
|
||||
color: rgb(var(--theme-accent-text-color)) !important;
|
||||
}
|
||||
|
||||
.card:focus .cardBox.visualCardBox,
|
||||
.card:focus .cardBox:not(.visualCardBox) .cardScalable {
|
||||
border-color: rgb(var(--theme-accent-text-color)) !important;
|
||||
}
|
||||
|
||||
.metadataSidebarIcon {
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
|
||||
.emby-button.detailFloatingButton {
|
||||
background-color: rgb(var(--theme-accent-text-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.layout-tv .emby-button.detailFloatingButton:focus {
|
||||
background-color: #f2f2f2;
|
||||
color: rgb(var(--theme-accent-text-color));
|
||||
}
|
||||
253
CSS/themes/kitana/kitana-base.css
Normal file
253
CSS/themes/kitana/kitana-base.css
Normal file
@ -0,0 +1,253 @@
|
||||
/* 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 {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
a.ml-2,
|
||||
a.mx-2 {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
#content:before {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
body,
|
||||
.navbar-dark .navbar-text {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* ACCENTS */
|
||||
.badge-dark {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(rgb(var(--accent-color)));
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
#nav .bg-dark {
|
||||
background: hsla(0, 0%, 0%, .25) !important;
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link:hover,
|
||||
.navbar-dark .navbar-nav .nav-link:focus {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#navbarSupportedContent ul li {
|
||||
background-color: transparent !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
.dropdown-menu {
|
||||
color: #fff;
|
||||
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: 1px solid transparent;
|
||||
}
|
||||
|
||||
.dropdown-item.active,
|
||||
.dropdown-item:active,
|
||||
.dropdown:active:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgb(0 0 0 / 25%) !important;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-item:hover,
|
||||
.dropdown-item:focus {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
|
||||
/* CARDS */
|
||||
.card {
|
||||
background: rgb(255 255 255 / 8%) !important;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
color: var(--text-hover);
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .125) !important;
|
||||
}
|
||||
|
||||
ul li {
|
||||
background-color: rgb(255 255 255 / 8%) !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
ul li:hover {
|
||||
background-color: rgb(255 255 255 / 16%) !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
.plugin_content .nav-tabs .nav-link.active,
|
||||
.nav-tabs .nav-item.show .nav-link {
|
||||
color: var(--text-hover) !important;
|
||||
background-color: rgb(0 0 0 / 25%) !important;
|
||||
border-color: #4440 #4440 transparent;
|
||||
}
|
||||
|
||||
.plugin_content .nav-tabs {
|
||||
border-bottom: 1px solid rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
.alert-secondary {
|
||||
background-color: rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn {
|
||||
border-color: var(--button-color);
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn:focus,
|
||||
.btn:active,
|
||||
.btn-primary:not(:disabled):not(.disabled):active,
|
||||
.btn-primary:not(:disabled):not(.disabled).active,
|
||||
.show>.btn-primary.dropdown-toggle {
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.badge-primary {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.badge-secondary {
|
||||
color: var(--button-text);
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control {
|
||||
color: var(--text) !important;
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
border: 1px solid transparent !important;
|
||||
box-shadow: none !important;
|
||||
transition: background-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
background-color: rgb(0 0 0 / 50%) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.custom-control-input:checked~.custom-control-label::before {
|
||||
color: var(--label-text-color);
|
||||
border-color: rgb(var(--accent-color));
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-checkbox .custom-control-input:checked~.custom-control-label::after {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.custom-control-input:focus~.custom-control-label::before {
|
||||
box-shadow: 0 0 0 .2rem rgba(55, 90, 127, 0.25)
|
||||
}
|
||||
|
||||
.custom-control-input:focus:not(:checked)~.custom-control-label::before {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-control-input:not(:disabled):active~.custom-control-label::before {
|
||||
color: #fff;
|
||||
background-color: #97b3d2;
|
||||
border-color: #97b3d2
|
||||
}
|
||||
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
::placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
489
CSS/themes/lazylibrarian/lazylibrarian-base.css
Normal file
489
CSS/themes/lazylibrarian/lazylibrarian-base.css
Normal file
@ -0,0 +1,489 @@
|
||||
/* 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 */
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--text);
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
p {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
label,
|
||||
legend {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
legend,
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid rgb(var(--accent-color), .45) !important;
|
||||
}
|
||||
|
||||
a,
|
||||
.btn-link {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.btn-link:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
input::-webkit-input-placeholder {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
input:focus::-webkit-input-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Placeholders */
|
||||
/* Firefox < 19 */
|
||||
input:-moz-placeholder {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
input:focus:-moz-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Firefox > 19 */
|
||||
input::-moz-placeholder {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
input:focus::-moz-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Internet Explorer 10 */
|
||||
input:-ms-input-placeholder {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
input:focus:-ms-input-placeholder {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* SCROLLBAR */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.navbar {
|
||||
border: 1px solid transparent;
|
||||
text-shadow: 1px 1px 1px rgb(0, 0, 0);
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.navbar-inverse {
|
||||
background-image: none;
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-brand {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.navbar-default .navbar-brand:hover,
|
||||
.navbar-default .navbar-brand:focus {
|
||||
color: var(--accent-color-hover);
|
||||
background-color: none;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a:hover,
|
||||
.navbar-default .navbar-nav>li>a:focus {
|
||||
color: var(--text-hover);
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
.btn-primary,
|
||||
.btn-default {
|
||||
color: var(--button-text) !important;
|
||||
background-color: var(--button-color) !important;
|
||||
background: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
background-image: none !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-default:hover,
|
||||
.btn-primary:active,
|
||||
.btn-primary.active,
|
||||
.open>.dropdown-toggle.btn-primary {
|
||||
background-image: none;
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-primary:active:hover,
|
||||
.btn-primary.active:hover,
|
||||
.open>-toggle.btn-primary:hover,
|
||||
.btn-primary:active:focus,
|
||||
.btn-primary.active:focus,
|
||||
.open>.dropdown-toggle.btn-primary:focus,
|
||||
.btn-primary:active.focus,
|
||||
.btn-primary.active.focus,
|
||||
.open>.dropdown-toggle.btn-primary.focus {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-primary.active.focus,
|
||||
.btn-primary.active:focus,
|
||||
.btn-primary.active:hover,
|
||||
.btn-primary:active.focus,
|
||||
.btn-primary:active:focus,
|
||||
.btn-primary:active:hover,
|
||||
.open>.dropdown-toggle.btn-primary.focus,
|
||||
.open>.dropdown-toggle.btn-primary:focus,
|
||||
.open>.dropdown-toggle.btn-primary:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-primary:active:hover,
|
||||
.btn-primary.active:hover,
|
||||
.open>.dropdown-toggle.btn-primary:hover,
|
||||
.btn-primary:active:focus,
|
||||
.btn-primary.active:focus,
|
||||
.open>.dropdown-toggle.btn-primary:focus,
|
||||
.btn-primary:active.focus,
|
||||
.btn-primary.active.focus,
|
||||
.open>.dropdown-toggle.btn-primary.focus {
|
||||
outline: none;
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-link:hover,
|
||||
.btn-link:focus,
|
||||
button.close {
|
||||
outline: none
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
background-image: none;
|
||||
color: var(--button-text-hover);
|
||||
background-color: #f89406;
|
||||
border-color: #f89406;
|
||||
}
|
||||
|
||||
.btn-warning:hover {
|
||||
background-image: none;
|
||||
color: var(--button-text-hover);
|
||||
background-color: #c67605;
|
||||
border-color: #bc7005;
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn:focus,
|
||||
.btn.focus {
|
||||
color: var(--button-text-hover);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.pagination>li.disabled>a,
|
||||
.pagination>li.disabled>a:hover,
|
||||
.pagination>li.disabled>span,
|
||||
.pagination>li.disabled>span:hover {
|
||||
background-color: var(--button-color);
|
||||
color: var(--text-muted);
|
||||
background-image: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.pagination>.disabled>span,
|
||||
.pagination>.disabled>span:hover,
|
||||
.pagination>.disabled>span:focus,
|
||||
.pagination>.disabled>a,
|
||||
.pagination>.disabled>a:hover,
|
||||
.pagination>.disabled>a:focus {
|
||||
color: var(--text-muted);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.pagination>.active>a,
|
||||
.pagination>.active>span,
|
||||
.pagination>.active>a:hover,
|
||||
.pagination>.active>span:hover,
|
||||
.pagination>.active>a:focus,
|
||||
.pagination>.active>span:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-image: none;
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.pagination>li.active>a,
|
||||
.pagination>li.active>span {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border: 1px solid var(--button-color);
|
||||
|
||||
}
|
||||
|
||||
.pagination>li>a:hover,
|
||||
.pagination>li>span:hover,
|
||||
.pagination>li>a:focus,
|
||||
.pagination>li>span:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-image: none;
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* FORM CONTYROL */
|
||||
|
||||
.form-control:focus {
|
||||
border-color: transparent;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color: var(--text);
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
select:focus,
|
||||
select:active,
|
||||
select.form-control:focus,
|
||||
select.form-control:active,
|
||||
#auth_type:focus {
|
||||
background: #1b1b1b !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.form-control:active:not(select.form-control),
|
||||
.form-control:focus:not(select.form-control),
|
||||
.configtable .input-group .form-control:active,
|
||||
.configtable .input-group .form-control:focus {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
|
||||
/* TABLE */
|
||||
|
||||
table {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
thead {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table-striped>tbody>tr:nth-of-type(odd) {
|
||||
background-color: rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.table-hover>tbody>tr:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
.table-bordered {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.table-bordered>thead>tr>th,
|
||||
.table-bordered>tbody>tr>th,
|
||||
.table-bordered>tfoot>tr>th,
|
||||
.table-bordered>thead>tr>td,
|
||||
.table-bordered>tbody>tr>td,
|
||||
.table-bordered>tfoot>tr>td {
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
/* BOOKWALL */
|
||||
|
||||
.table-responsive>.table {
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
|
||||
.nav-tabs>li.active>a,
|
||||
.nav-tabs>li.active>a:hover,
|
||||
.nav-tabs>li.active>a:focus {
|
||||
color: rgb(var(--accent-color));
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
border: 1px solid TRANSPARENT;
|
||||
border-bottom-color: transparent;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.45);
|
||||
}
|
||||
|
||||
.nav-tabs>li>a:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.nav>li>a:hover,
|
||||
.nav>li>a:focus {
|
||||
text-decoration: none;
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
border: none;
|
||||
border-color: transparent;
|
||||
background-image: none;
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
legend {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .45);
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
|
||||
.modal-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: 1px solid transparent;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
pre {
|
||||
color: var(--text);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
119
CSS/themes/librespeed/librespeed-base.css
Normal file
119
CSS/themes/librespeed/librespeed-base.css
Normal file
@ -0,0 +1,119 @@
|
||||
/* 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 */
|
||||
|
||||
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) !important;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.meterText:empty:before {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
#dlText {
|
||||
color: #F44336;
|
||||
}
|
||||
|
||||
#ulText {
|
||||
color: #4CAF50;
|
||||
}
|
||||
|
||||
#pingText,
|
||||
#jitText {
|
||||
color: #2cabe3;
|
||||
}
|
||||
|
||||
#startStopBtn {
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
border: 0.15em solid var(--button-color);
|
||||
}
|
||||
|
||||
#startStopBtn:hover {
|
||||
border: 0.15em solid var(--button-color-hover);
|
||||
background: var(--button-color-hover);
|
||||
}
|
||||
|
||||
#startStopBtn.running {
|
||||
background: #FF3030 !important;
|
||||
border-color: #FF6060;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
#startStopBtn.running:hover {
|
||||
background: #FF3030;
|
||||
border-color: #FF6060;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
a,
|
||||
a:-webkit-any-link {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:-webkit-any-link:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
#ip,
|
||||
.unit {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#privacyPolicy {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
input {
|
||||
font-family: "Roboto", sans-serif;
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
-webkit-rtl-ordering: logical;
|
||||
Font-size: 16px;
|
||||
padding: 10px;
|
||||
border: none;
|
||||
padding-left: 10px;
|
||||
max-width: -webkit-fill-available;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 5px !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.testName {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
1140
CSS/themes/lidarr/lidarr-base.css
Normal file
1140
CSS/themes/lidarr/lidarr-base.css
Normal file
File diff suppressed because it is too large
Load Diff
0
CSS/themes/logarr/.deprecated
Normal file
0
CSS/themes/logarr/.deprecated
Normal file
581
CSS/themes/logarr/logarr-base.css
Normal file
581
CSS/themes/logarr/logarr-base.css
Normal file
@ -0,0 +1,581 @@
|
||||
/* 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 {
|
||||
font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
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: #FFFFFF !important;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
.expand::-webkit-scrollbar-track {
|
||||
background-color: transparent !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.expand::-webkit-scrollbar {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.expand::-webkit-scrollbar-thumb {
|
||||
background-color: hsla(0, 0%, 100%, .2) !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.expand::-webkit-scrollbar-thumb:hover {
|
||||
background-color: hsla(0, 0%, 100%, .5) !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-track {
|
||||
background-color: transparent !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-thumb {
|
||||
background-color: hsla(0, 0%, 100%, .2) !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-thumb:hover {
|
||||
background-color: hsla(0, 0%, 100%, .5) !important;
|
||||
}
|
||||
|
||||
.flex-child {
|
||||
border-radius: 0px;
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
#includedContent {
|
||||
background-color: transparent;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
body {
|
||||
opacity: 1;
|
||||
transition: 1s opacity;
|
||||
background-color: #00000000;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family: 'Roboto:400', sans-serif !important;
|
||||
color: #FFFFFF;
|
||||
padding: 10px 10px 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-weight: 600 !important;
|
||||
}
|
||||
|
||||
body.fade-out {
|
||||
opacity: 0;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.left,
|
||||
.right,
|
||||
.category-filter-item,
|
||||
.nav-item,
|
||||
.filesize,
|
||||
.path {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
#username:hover,
|
||||
#password:hover {
|
||||
text-shadow: 0 0 1rem transparent;
|
||||
}
|
||||
|
||||
#categoryFilter,
|
||||
#auto-update {
|
||||
color: white !important;
|
||||
background-color: transparent !important;
|
||||
box-shadow: none;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
#markform {
|
||||
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;
|
||||
|
||||
}
|
||||
|
||||
.slide {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.expandtoggle {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.expandtoggle:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
.expandtoggle:checked~.expandtoggle::before {
|
||||
content: "";
|
||||
background: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/logarr/increase.png) no-repeat;
|
||||
background-size: 2em;
|
||||
display: inline-block;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
cursor: row-resize;
|
||||
}
|
||||
|
||||
.expandtoggle::before {
|
||||
background: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/logarr/decrease.png) no-repeat;
|
||||
background-size: 2em;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
-webkit-transition: .5s;
|
||||
-moz-transition: .5s;
|
||||
transition: .5s;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.expand {
|
||||
height: 43rem;
|
||||
width: auto;
|
||||
overflow: auto;
|
||||
transition: height 0.5s;
|
||||
color: rgb(255, 255, 255);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
word-wrap: break-word;
|
||||
padding: 0 10px 0 10px;
|
||||
}
|
||||
|
||||
.header-brand,
|
||||
.logheader {
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
/* Text Color */
|
||||
.alpaca-control-label,
|
||||
.alpaca-control.radio {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.alpaca-form-buttons-container {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.Rtable-cell {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
#colorkey {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.settingstitle {
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
#reginfo {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
#infodata {
|
||||
background-color: transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.input_icon {
|
||||
color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.input_icon:hover {
|
||||
color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.input:hover,
|
||||
input.form-control:hover,
|
||||
select.form-control:hover {
|
||||
border: .2rem solid transparent;
|
||||
}
|
||||
|
||||
.input:focus,
|
||||
input.form-control:focus,
|
||||
select.form-control:focus {
|
||||
border: .2rem solid transparent;
|
||||
}
|
||||
|
||||
input:invalid {
|
||||
border: .2rem solid transparent;
|
||||
}
|
||||
|
||||
input:valid {
|
||||
border: .2rem solid transparent;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
#sidebar-wrapper {
|
||||
box-shadow: none !important;
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:hover:before {
|
||||
-webkit-transition: none !important;
|
||||
transition: none !important;
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
transition: none !important;
|
||||
-webkit-transition: none !important;
|
||||
}
|
||||
|
||||
.sidebar-nav li:first-child a {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(2):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(3):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(4):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(5):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(6):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(7):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(8):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(9):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
#modalloading {
|
||||
background: var(--main-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;
|
||||
color: white !important;
|
||||
border: 1px solid transparent !important;
|
||||
box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important;
|
||||
}
|
||||
|
||||
.modaltextloading,
|
||||
.modalloadingspinner {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 100% !important;
|
||||
padding-right: 2rem !important;
|
||||
}
|
||||
|
||||
#stats {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
padding-left: .0rem !important;
|
||||
padding-right: 1.11rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#hd {
|
||||
padding-left: 0.8rem !important;
|
||||
}
|
||||
|
||||
.double-val-label>span.success {
|
||||
background-color: #28a745 !important;
|
||||
}
|
||||
|
||||
.servicetile:hover,
|
||||
.servicetile:focus {
|
||||
text-shadow: 0 0 20px #000;
|
||||
}
|
||||
|
||||
#servicetitle:hover,
|
||||
#servicetitle:focus {
|
||||
text-shadow: 0 0 20px #000;
|
||||
}
|
||||
|
||||
#servicetitle {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.btnoffline,
|
||||
.btnunknown,
|
||||
.btnonline {
|
||||
box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
|
||||
-webkit-box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
|
||||
}
|
||||
|
||||
.btnonline {
|
||||
background-color: #28a745 !important;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: var(--button-color) !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.btn-primary:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-group>.btn-group:not(:first-child)>.btn,
|
||||
.btn-group>.btn:not(:first-child) {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.btn-group>.btn:first-child {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
#time {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#slidertable {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#textslider {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.dtg {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.datemin {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
#center {
|
||||
background-color: rgba(0, 0, 0, .0) !important;
|
||||
box-shadow: 0px 0px 0px 0px #ffffff00, 0px 0px 0px 0px #ffffff00, 10px 0px 10px 0px #ffffff00, -10px 0px 10px 2px #ffffff00 !important;
|
||||
}
|
||||
|
||||
/*Service tile*/
|
||||
.col-lg-4 {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
margin: 1rem .1rem 1.5rem 1rem !important;
|
||||
width: 9rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.col-lg-4:hover {
|
||||
background-color: hsla(0, 0%, 100%, .08) !important;
|
||||
margin: 1rem .1rem 1.5rem 1rem !important;
|
||||
width: 9rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.servicetile,
|
||||
.servicetile:hover,
|
||||
.servicetile:focus {
|
||||
color: #ffffff;
|
||||
text-shadow: none !important;
|
||||
text-decoration: none !important;
|
||||
outline: 0;
|
||||
font-weight: inherit !important;
|
||||
-webkit-transition: none !important;
|
||||
-moz-transition: none !important;
|
||||
-ms-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
.servicetile {
|
||||
color: #ffffff;
|
||||
text-shadow: none !important;
|
||||
text-decoration: none !important;
|
||||
outline: 0;
|
||||
font-weight: inherit !important;
|
||||
-webkit-transition: none !important;
|
||||
-moz-transition: none !important;
|
||||
-ms-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
#servicetitle:hover,
|
||||
#servicetitle:focus {
|
||||
text-shadow: none !important;
|
||||
font-weight: inherit !important;
|
||||
}
|
||||
|
||||
#clock {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.date {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
#summary {
|
||||
background-color: #e84242 !important;
|
||||
border-radius: 23px 22px 22px 23px/23px 23px 22px 22px;
|
||||
box-shadow: 0px 2px 5px rgb(15, 15, 15) !important;
|
||||
}
|
||||
|
||||
.pace,
|
||||
.pace-progress {
|
||||
background: rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.pace,
|
||||
.pace-progress-inner {
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, .15), 0 0 5px rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.pace .pace-activity {
|
||||
border-top-color: #FFF !important;
|
||||
border-left-color: #FFF !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.footer:hover {
|
||||
text-shadow: 0 0 15px transparent !important;
|
||||
}
|
||||
|
||||
#footer {
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
text-shadow: 0 0 15px #000000 !important;
|
||||
}
|
||||
|
||||
/* ButtonShadow */
|
||||
.btnoffline,
|
||||
.btnunknown,
|
||||
.btnonline {
|
||||
box-shadow: none !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
}
|
||||
|
||||
.logrollmodal {
|
||||
background: var(--modal-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;
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
|
||||
.modalimgpath,
|
||||
.modaltext,
|
||||
#uploadbutton {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.file-upload {
|
||||
background-color: var(--button-color) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.file-upload:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 775px) {
|
||||
#slidertable {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#time {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
#dateRight {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
0
CSS/themes/monitorr/.deprecated
Normal file
0
CSS/themes/monitorr/.deprecated
Normal file
433
CSS/themes/monitorr/monitorr-base.css
Normal file
433
CSS/themes/monitorr/monitorr-base.css
Normal file
@ -0,0 +1,433 @@
|
||||
/* 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 */
|
||||
|
||||
|
||||
#footer:after {
|
||||
color: white;
|
||||
content: "theme.park v2.0";
|
||||
}
|
||||
|
||||
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: #FFFFFF !important;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
|
||||
body::-webkit-scrollbar-track {
|
||||
background-color: transparent !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-thumb {
|
||||
background-color: hsla(0, 0%, 100%, .2) !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
body::-webkit-scrollbar-thumb:hover {
|
||||
background-color: hsla(0, 0%, 100%, .5) !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#myModal3::-webkit-scrollbar-track {
|
||||
background-color: transparent !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
#myModal3::-webkit-scrollbar {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
#myModal3::-webkit-scrollbar-thumb {
|
||||
background-color: hsla(0, 0%, 100%, .2) !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
#myModal3::-webkit-scrollbar-thumb:hover {
|
||||
background-color: hsla(0, 0%, 100%, .5) !important;
|
||||
}
|
||||
|
||||
#includedContent {
|
||||
background-color: transparent;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#username:hover,
|
||||
#password:hover {
|
||||
text-shadow: 0 0 1rem transparent;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
/* Text Color */
|
||||
.alpaca-control-label,
|
||||
.alpaca-control.radio {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.alpaca-form-buttons-container {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.Rtable-cell {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
#colorkey {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.settingstitle {
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
#reginfo {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
#infodata {
|
||||
background-color: transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.input_icon {
|
||||
color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.input_icon:hover {
|
||||
color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
#sidebar-wrapper {
|
||||
box-shadow: none !important;
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:hover:before {
|
||||
-webkit-transition: none !important;
|
||||
transition: none !important;
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
transition: none !important;
|
||||
-webkit-transition: none !important;
|
||||
}
|
||||
|
||||
.sidebar-nav li:first-child a {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(2):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(3):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(4):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(5):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(6):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(7):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(8):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.sidebar-nav li:nth-child(9):before {
|
||||
background-color: rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
#modalloading {
|
||||
background: var(--main-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;
|
||||
color: white !important;
|
||||
border: 1px solid transparent !important;
|
||||
box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important;
|
||||
}
|
||||
|
||||
.modaltextloading,
|
||||
.modalloadingspinner {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 100% !important;
|
||||
padding-right: 2rem !important;
|
||||
}
|
||||
|
||||
#stats {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
padding-left: .0rem !important;
|
||||
padding-right: 1.11rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#hd {
|
||||
padding-left: 0.8rem !important;
|
||||
}
|
||||
|
||||
.double-val-label>span.success {
|
||||
background-color: #28a745 !important;
|
||||
}
|
||||
|
||||
.servicetile:hover,
|
||||
.servicetile:focus {
|
||||
text-shadow: 0 0 20px #000;
|
||||
}
|
||||
|
||||
#servicetitle:hover,
|
||||
#servicetitle:focus {
|
||||
text-shadow: 0 0 20px #000;
|
||||
}
|
||||
|
||||
#servicetitle {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.btnoffline,
|
||||
.btnunknown,
|
||||
.btnonline {
|
||||
box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
|
||||
-webkit-box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
|
||||
}
|
||||
|
||||
.btnonline {
|
||||
background-color: #28a745 !important;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.btn-primary:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-group>.btn-group:not(:first-child)>.btn,
|
||||
.btn-group>.btn:not(:first-child) {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.btn-group>.btn:first-child {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
#time {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#slidertable {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#textslider {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.dtg {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.datemin {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
#center {
|
||||
background-color: rgba(0, 0, 0, .0) !important;
|
||||
box-shadow: 0px 0px 0px 0px #ffffff00, 0px 0px 0px 0px #ffffff00, 10px 0px 10px 0px #ffffff00, -10px 0px 10px 2px #ffffff00 !important;
|
||||
}
|
||||
|
||||
/*Service tile*/
|
||||
.col-lg-4 {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
margin: 1rem .1rem 1.5rem 1rem !important;
|
||||
width: 9rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.col-lg-4:hover {
|
||||
background-color: hsla(0, 0%, 100%, .08) !important;
|
||||
margin: 1rem .1rem 1.5rem 1rem !important;
|
||||
width: 9rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.servicetile,
|
||||
.servicetile:hover,
|
||||
.servicetile:focus {
|
||||
color: #ffffff;
|
||||
text-shadow: none !important;
|
||||
text-decoration: none !important;
|
||||
outline: 0;
|
||||
font-weight: inherit !important;
|
||||
-webkit-transition: none !important;
|
||||
-moz-transition: none !important;
|
||||
-ms-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
.servicetile {
|
||||
color: #ffffff;
|
||||
text-shadow: none !important;
|
||||
text-decoration: none !important;
|
||||
outline: 0;
|
||||
font-weight: inherit !important;
|
||||
-webkit-transition: none !important;
|
||||
-moz-transition: none !important;
|
||||
-ms-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
#servicetitle:hover,
|
||||
#servicetitle:focus {
|
||||
text-shadow: none !important;
|
||||
font-weight: inherit !important;
|
||||
}
|
||||
|
||||
#clock {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.date {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
#summary {
|
||||
background-color: #e84242 !important;
|
||||
border-radius: 23px 22px 22px 23px/23px 23px 22px 22px;
|
||||
box-shadow: 0px 2px 5px rgb(15, 15, 15) !important;
|
||||
}
|
||||
|
||||
.pace,
|
||||
.pace-progress {
|
||||
background: rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.pace,
|
||||
.pace-progress-inner {
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, .15), 0 0 5px rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.pace .pace-activity {
|
||||
border-top-color: #FFF !important;
|
||||
border-left-color: #FFF !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.footer:hover {
|
||||
text-shadow: 0 0 15px transparent !important;
|
||||
}
|
||||
|
||||
#footer {
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
text-shadow: 0 0 15px #000000 !important;
|
||||
}
|
||||
|
||||
/* ButtonShadow */
|
||||
.btnoffline,
|
||||
.btnunknown,
|
||||
.btnonline {
|
||||
box-shadow: none !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
}
|
||||
|
||||
#myModal3 {
|
||||
background: var(--modal-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;
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
|
||||
.modalimgpath,
|
||||
.modaltext,
|
||||
#uploadbutton {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.file-upload {
|
||||
background-color: var(--button-color) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.file-upload:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 775px) {
|
||||
#slidertable {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#time {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
210
CSS/themes/monitorr/organizr-dashboard.css
Normal file
210
CSS/themes/monitorr/organizr-dashboard.css
Normal file
@ -0,0 +1,210 @@
|
||||
/* 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 {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 100% !important;
|
||||
padding-right: 2rem !important;
|
||||
}
|
||||
|
||||
#stats {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
padding-left: .0rem !important;
|
||||
padding-right: 1.11rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#hd {
|
||||
padding-left: 0.8rem !important;
|
||||
}
|
||||
|
||||
.double-val-label>span.success {
|
||||
background-color: #28a745 !important;
|
||||
}
|
||||
|
||||
.servicetile:hover,
|
||||
.servicetile:focus {
|
||||
text-shadow: 0 0 20px #000;
|
||||
}
|
||||
|
||||
#servicetitle:hover,
|
||||
#servicetitle:focus {
|
||||
text-shadow: 0 0 20px #000;
|
||||
}
|
||||
|
||||
#servicetitle {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.btnoffline,
|
||||
.btnunknown,
|
||||
.btnonline {
|
||||
box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
|
||||
-webkit-box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
|
||||
}
|
||||
|
||||
.btnonline {
|
||||
background-color: #28a745 !important;
|
||||
}
|
||||
|
||||
#time {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#slidertable {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#textslider {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.dtg {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.datemin {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
#center {
|
||||
background-color: rgba(0, 0, 0, .0) !important;
|
||||
box-shadow: 0px 0px 0px 0px #ffffff00, 0px 0px 0px 0px #ffffff00, 10px 0px 10px 0px #ffffff00, -10px 0px 10px 2px #ffffff00 !important;
|
||||
}
|
||||
|
||||
/*Service tile*/
|
||||
.col-lg-4 {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
margin: 1rem .1rem 1.5rem 1rem !important;
|
||||
width: 9rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.col-lg-4:hover {
|
||||
background-color: hsla(0, 0%, 100%, .08) !important;
|
||||
margin: 1rem .1rem 1.5rem 1rem !important;
|
||||
width: 9rem !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.servicetile,
|
||||
.servicetile:hover,
|
||||
.servicetile:focus {
|
||||
color: #ffffff;
|
||||
text-shadow: none !important;
|
||||
text-decoration: none !important;
|
||||
outline: 0;
|
||||
font-weight: inherit !important;
|
||||
-webkit-transition: none !important;
|
||||
-moz-transition: none !important;
|
||||
-ms-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
.servicetile {
|
||||
color: #ffffff;
|
||||
text-shadow: none !important;
|
||||
text-decoration: none !important;
|
||||
outline: 0;
|
||||
font-weight: inherit !important;
|
||||
-webkit-transition: none !important;
|
||||
-moz-transition: none !important;
|
||||
-ms-transition: none !important;
|
||||
-o-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
#servicetitle:hover,
|
||||
#servicetitle:focus {
|
||||
text-shadow: none !important;
|
||||
font-weight: inherit !important;
|
||||
}
|
||||
|
||||
#clock {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.date {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
#summary {
|
||||
background-color: #e84242 !important;
|
||||
border-radius: 23px 22px 22px 23px/23px 23px 22px 22px;
|
||||
box-shadow: 0px 2px 5px rgb(15, 15, 15) !important;
|
||||
}
|
||||
|
||||
.pace,
|
||||
.pace-progress {
|
||||
background: rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.pace,
|
||||
.pace-progress-inner {
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, .15), 0 0 5px rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
.footer:hover {
|
||||
text-shadow: 0 0 15px transparent !important;
|
||||
}
|
||||
|
||||
#footer {
|
||||
color: transparent !important;
|
||||
}
|
||||
|
||||
.alpaca-control-label,
|
||||
.alpaca-control.radio {
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
text-shadow: 0 0 15px #000000 !important;
|
||||
}
|
||||
|
||||
.Rtable-cell {
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
#colorkey {
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
/* ButtonShadow */
|
||||
.btnoffline,
|
||||
.btnunknown,
|
||||
.btnonline {
|
||||
box-shadow: none !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 775px) {
|
||||
#slidertable {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#time {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
147
CSS/themes/moviematch/moviematch-base.css
Normal file
147
CSS/themes/moviematch/moviematch-base.css
Normal file
@ -0,0 +1,147 @@
|
||||
/* 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 */
|
||||
|
||||
* {
|
||||
outline: none;
|
||||
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* TEXT COLOR */
|
||||
.matches-title,
|
||||
.matches-list:empty::before,
|
||||
.card-stack:empty::after,
|
||||
footer,
|
||||
.Field_Label {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* ACCENTS */
|
||||
.matches-section hr {
|
||||
border: 0.5px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.matches-section hr::before,
|
||||
.matches-title .matches-count {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.Logo {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.login-form input,
|
||||
input,
|
||||
.TextInput {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
border: 1px solid transparent;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.login-form input:focus,
|
||||
input:focus,
|
||||
.TextInput:focus {
|
||||
background: #fff;
|
||||
border: 1px solid transparent;
|
||||
color: black;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.Select_Element {
|
||||
border: 2px solid var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.login-form .room-code-container .generate-button,
|
||||
.login-form .submit-button,
|
||||
.ButtonPrimary,
|
||||
.AddRemoveList_Add,
|
||||
.SegmentedControlsListItem {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
border: 1px solid var(--button-color);
|
||||
}
|
||||
|
||||
.login-form .room-code-container .generate-button:hover,
|
||||
.login-form .submit-button:hover,
|
||||
.ButtonPrimary:hover,
|
||||
.ButtonPrimary:active .ButtonSecondary:hover,
|
||||
.ButtonSecondary:active,
|
||||
.ButtonTertiary:hover,
|
||||
.ButtonTertiary:active,
|
||||
.AddRemoveList_Add:hover,
|
||||
.AddRemoveList_Add:active,
|
||||
.SegmentedControlsListItem:hover,
|
||||
.SegmentedControlsListItem:active {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
@media (hover: hover) {
|
||||
.ButtonSecondary:hover {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.ButtonSecondary {
|
||||
border: 2px solid var(--button-color);
|
||||
color: var(--button-color);
|
||||
}
|
||||
|
||||
.ButtonTertiary {
|
||||
color: var(--button-color);
|
||||
transition: background-color var(--button-color-hover) ease-in-out;
|
||||
}
|
||||
|
||||
.SegmentedControlOption {
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.card {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.Card_MoreInfoButton:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.RoomInfoBar {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
/* MENUS POPOVER */
|
||||
.PopoverMenuButton:hover {
|
||||
background: rgb(255 255 255 / 15%) !important;
|
||||
color: var(--mm-white);
|
||||
}
|
||||
3355
CSS/themes/mylar3/mylar3-base.css
Normal file
3355
CSS/themes/mylar3/mylar3-base.css
Normal file
File diff suppressed because one or more lines are too long
484
CSS/themes/netdata/netdata-base.css
Normal file
484
CSS/themes/netdata/netdata-base.css
Normal file
@ -0,0 +1,484 @@
|
||||
/* 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,
|
||||
[class*="styled__SocialMediaContainer-"] {
|
||||
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);
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
label:not(.toggle-on.btn, .toggle-off.btn),
|
||||
legend {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.dashboard-context-info {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
a,
|
||||
.dashboard-context-info a {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.dashboard-context-info a:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.loadOverlay {
|
||||
color: var(--text) !important;
|
||||
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;
|
||||
}
|
||||
|
||||
/* Navbar */
|
||||
.navbar-default {
|
||||
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;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a:hover,
|
||||
.navbar-default .navbar-nav>li>a:focus {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>.open>a,
|
||||
.navbar-default .navbar-nav>.open>a:hover,
|
||||
.navbar-default .navbar-nav>.open>a:focus {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.navbar-default,
|
||||
.navbar-inverse {
|
||||
border: 0px solid rgba(0, 0, 0, 0.6) !important;
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3) !important;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-brand:hover,
|
||||
.navbar-default .navbar-brand:focus {
|
||||
color: #ffffff !important;
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a,
|
||||
.navbar-inverse .navbar-nav>li>a {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0) !important;
|
||||
border-left: 1px solid rgba(0, 0, 0, 0) !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.nav-tabs>li.active>a,
|
||||
.nav-tabs>li.active>a:hover,
|
||||
.nav-tabs>li.active>a:focus {
|
||||
background-color: rgba(0, 0, 0, 0.15) !important;
|
||||
border: 1px solid #00000000 !important;
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.nav>li>a:hover,
|
||||
.nav>li>a:focus {
|
||||
text-decoration: none;
|
||||
background-color: #3e444c;
|
||||
}
|
||||
|
||||
.nav>li>a:hover,
|
||||
.nav>li>a:focus {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
.nav-tabs>li>a:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: 1px 1px 1px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
#my-netdata-dropdown-content .agent-item:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.sign-in-btn {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.dropdown-menu,
|
||||
[class*="__Dropdown-"],
|
||||
[class*="documentation__Container-sc-"],
|
||||
[class*="styled__PickerBox-"] {
|
||||
background: var(--drop-down-menu-bg) !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;
|
||||
border: 0px !important;
|
||||
}
|
||||
|
||||
[class*="styled__ShortPickElement-"] {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
[class*="styled__ShortPickElement-"]:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.DateInput_input__focused {
|
||||
border: 1px solid rgb(var(--accent-color));
|
||||
|
||||
}
|
||||
|
||||
.CalendarDay__selected,
|
||||
.CalendarDay__selected:active,
|
||||
.CalendarDay__selected:hover,
|
||||
.CalendarDay__selected_span:active,
|
||||
.CalendarDay__selected_span:hover {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.CalendarDay__default:hover {
|
||||
background: var(--accent-color-hover);
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
[class*="item__PanelRowContainer-"]:hover {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
|
||||
|
||||
.dropdown-menu>li>a:hover,
|
||||
.dropdown-menu>li>a:focus {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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;
|
||||
border-bottom: 1px solid rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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;
|
||||
border-top: 1px solid rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.panel {
|
||||
background: rgba(0, 0, 0, 0.45) !important;
|
||||
}
|
||||
|
||||
.panel-default>.panel-heading {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
table {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.table-hover>tbody>tr:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
.table>thead>tr>th {
|
||||
border-bottom: 2px solid rgba(255, 255, 255, 0.3) !important;
|
||||
}
|
||||
|
||||
#my-netdata-dropdown-content hr {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.table>thead>tr>th,
|
||||
.table>tbody>tr>th,
|
||||
.table>tfoot>tr>th,
|
||||
.table>thead>tr>td,
|
||||
.table>tbody>tr>td,
|
||||
.table>tfoot>tr>td {
|
||||
background: var(--modal-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;
|
||||
border-top: 1px solid #00000000 !important;
|
||||
}
|
||||
|
||||
.multi-column-dropdown li a:hover {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.close,
|
||||
.close:hover,
|
||||
.close:focus {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
/* System Overview */
|
||||
.dashboard-sidebar .nav>.active>a,
|
||||
.dashboard-sidebar .nav>.active:hover>a,
|
||||
.dashboard-sidebar .nav>.active:focus>a {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
border-left: 2px solid rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
[class*="sidebar__Wrapper-"] {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
[class*="sidebar__Wrapper-"] [class*="flex-sc-"]:not([class*="collapsible__Animated-"]) {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
[class*="collapsible__Animated-"] {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
|
||||
[class*="header__Wrapper-"] {
|
||||
background: var(--main-bg-color);
|
||||
}
|
||||
|
||||
[class*="styled__StyledButton-"] .button-icon {
|
||||
fill: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
[class*="styled__StyledButton-"]:hover .button-icon {
|
||||
fill: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
/*code*/
|
||||
code {
|
||||
color: var(--label-text-color) !important;
|
||||
background-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* System Overview metrics */
|
||||
.gaugeChartTitle,
|
||||
.gaugeChartUnits,
|
||||
.gaugeChartMax,
|
||||
.gaugeChartMin,
|
||||
.gaugeChartLabel,
|
||||
.easyPieChartTitle,
|
||||
.easyPieChartLabel,
|
||||
.easyPieChartUnits {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.netdata-legend-value,
|
||||
.netdata-legend-toolbox,
|
||||
.netdata-legend-toolbox-button,
|
||||
.dygraph-axis-label {
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.netdata-legend-resize-handler {
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.netdata-legend-name-table-line {
|
||||
border-bottom-width: 0px !important;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
.dashboard-sidebar .nav>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dashboard-sidebar .nav>li>a:focus,
|
||||
.dashboard-sidebar .nav>li>a:hover {
|
||||
padding-left: 19px;
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
border-left: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
small,
|
||||
.small {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.action-button {
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
|
||||
.pagination>li>a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08) !important;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-default:not([class*="toggle"]) {
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
a[class*="styled__StyledButton-"],
|
||||
[data-testid*="date-picker::click-apply::global-view-"] {
|
||||
background-color: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
a[class*="styled__StyledButton-"]:hover,
|
||||
a[class*="styled__StyledButton-"]:active,
|
||||
[data-testid*="date-picker::click-apply::global-view-"]:hover,
|
||||
[data-testid*="date-picker::click-apply::global-view-"]:active {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-default:hover:not([class*="toggle"]) {
|
||||
background-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-default:active:not(.open>.dropdown-toggle.btn-default):not([class*="toggle"]),
|
||||
.btn-default.active:not(.open>.dropdown-toggle.btn-default):not([class*="toggle"]) {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
/* NAV */
|
||||
[class^="with-panel"] {
|
||||
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;
|
||||
}
|
||||
|
||||
[class*="styled__ListContainer"],
|
||||
[class*="container__Container-"] div,
|
||||
[class*="styled__PanelContainer"],
|
||||
[class*="styled__StyledHeader"] {
|
||||
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;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
|
||||
[class^="styled__BottomPanel"] {
|
||||
background: #0000;
|
||||
}
|
||||
|
||||
[class^=".styled__StyledSpaceBarPlus"] {
|
||||
background: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
20
CSS/themes/netdata/organizr-dashboard.css
Normal file
20
CSS/themes/netdata/organizr-dashboard.css
Normal file
@ -0,0 +1,20 @@
|
||||
|
||||
/* 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 */
|
||||
|
||||
|
||||
/* NETDATA ORGANIZR DASHBOARD THEME */
|
||||
@import url(https://theme-park.dev/CSS/themes/netdata/netdata-base.css);
|
||||
@import url(https://theme-park.dev/CSS/variables/organizr-dark.css);
|
||||
:root {
|
||||
--main-bg-color: transparent;
|
||||
}
|
||||
664
CSS/themes/nzbget/nzbget-base.css
Normal file
664
CSS/themes/nzbget/nzbget-base.css
Normal file
@ -0,0 +1,664 @@
|
||||
/* 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 {
|
||||
background: var(--main-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;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
/* scroller */
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #0c1218;
|
||||
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 9px 15px;
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
background: var(--modal-footer-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;
|
||||
}
|
||||
|
||||
.modal {
|
||||
background: var(--modal-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) !important;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background-color: var(--modal-footer-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-top: 1px solid rgb(var(--accent-color));
|
||||
-webkit-box-shadow: inset 0 1px 0 transparent;
|
||||
-moz-box-shadow: inset 0 1px 0 transparent;
|
||||
box-shadow: inset 0 1px 0 transparent;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
.table a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.table a:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.table-striped tbody tr:nth-child(odd) {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.table-striped tbody tr:nth-child(odd) td,
|
||||
.table-striped tbody tr:nth-child(odd) th {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.table-striped tbody tr:nth-child(even) {
|
||||
background-color: rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.table tbody tr:hover,
|
||||
.table tbody tr:hover td,
|
||||
.table tbody tr:hover a {
|
||||
color: var(--text-hover);
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.table-striped tbody tr.checked:nth-child(2n+1) td,
|
||||
.checked .progress {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
tr.checked,
|
||||
tr.checked td,
|
||||
tr.checked:nth-child(odd) .progress {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.table tbody tr.checked:hover,
|
||||
.table tbody tr.checked:hover td {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.table tbody tr.checked:hover,
|
||||
.table tbody tr.checked:hover td {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.table.check-simple tbody tr.checked:hover,
|
||||
.table.check-simple tbody tr.checked:hover td {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.table th,
|
||||
.table td {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.table-bordered {
|
||||
border-left: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.pagination a {
|
||||
border: none;
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.pagination a:hover,
|
||||
.pagination .active a {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.pagination .active a {
|
||||
color: rgb(rgb(var(--accent-color)));
|
||||
}
|
||||
|
||||
/* PROGRESS BAR */
|
||||
.progress {
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.progress-warning.progress-striped .bar {
|
||||
background-color: #cc7b19;
|
||||
}
|
||||
|
||||
.progress-success.progress-striped .bar {
|
||||
background-color: #51a351;
|
||||
}
|
||||
|
||||
.bar-text-left,
|
||||
.bar-text-right {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.navbar-fixed-top .navbar-inner {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.navbar-inner {
|
||||
background-image: none;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.navbar-container {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.navbar .nav>li>a:hover {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.navbar .nav .active>a {
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.navbar .nav .active>a:hover {
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
color: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
div.check:hover {
|
||||
border: 1px solid var(--accent-color-hover);
|
||||
}
|
||||
|
||||
#DownloadsTable>tbody>tr.checked td .check {
|
||||
border: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class^="icon-"],
|
||||
[class*=" icon-"],
|
||||
[class^="img-"],
|
||||
[class*=" img-"] {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/nzbget/icons.png);
|
||||
}
|
||||
|
||||
.navbar-search .search-query {
|
||||
color: var(--text);
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.navbar-search .search-query:focus,
|
||||
.navbar-search .search-query.focused {
|
||||
color: var(--text-hover) !important;
|
||||
text-shadow: none;
|
||||
background-color: rgba(0, 0, 0, 0.45) !important;
|
||||
}
|
||||
|
||||
.focused .search-caret-button .caret {
|
||||
margin-left: 5px;
|
||||
border-top-color: rgb(255, 255, 255);
|
||||
border-bottom-color: rgb(255, 255, 255);
|
||||
}
|
||||
|
||||
.search-caret-button {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.menu-header {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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);
|
||||
}
|
||||
|
||||
.dropdown-menu a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-menu li>a:hover,
|
||||
.dropdown-menu .active>a,
|
||||
.dropdown-menu .active>a:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: hsla(0, 0%, 100%, .05);
|
||||
}
|
||||
|
||||
.dropdown-menu .divider {
|
||||
height: 0px;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
#ConfigContent .config-header {
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#StatDialog_Custom a,
|
||||
#AddDialog_Files a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
#StatDialog_Custom a:hover,
|
||||
#AddDialog_Files a:hover {
|
||||
color: var(--link-color-hover);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn-primary,
|
||||
.btn-primary:hover,
|
||||
.btn-warning,
|
||||
.btn-warning:hover,
|
||||
.btn-danger,
|
||||
.btn-danger:hover,
|
||||
.btn-success,
|
||||
.btn-success:hover,
|
||||
.btn-info,
|
||||
.btn-info:hover,
|
||||
.btn-inverse,
|
||||
.btn-inverse:hover {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.btn-group>.dropdown-toggle {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.config-header .btn {
|
||||
background: #FFF;
|
||||
color: #adb1b1;
|
||||
text-shadow: unset;
|
||||
}
|
||||
|
||||
#ConfigData>div>button.btn {
|
||||
background: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
font-weight: bold;
|
||||
text-shadow: unset;
|
||||
}
|
||||
|
||||
#ConfigData>div>button.btn:hover {
|
||||
background: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
font-weight: bold;
|
||||
text-shadow: unset;
|
||||
}
|
||||
|
||||
#ConfigData>div>div>table>tbody>tr>td>.btn {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
text-shadow: unset;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#Config_Save:hover {
|
||||
background-color: rgb(81, 163, 81);
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
#Config_Save {
|
||||
background: rgba(81, 163, 81, 0.8);
|
||||
color: #FFF;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
#ConfigData>div>div>button.btn.btn-danger {
|
||||
background: #ad292c;
|
||||
text-shadow: unset;
|
||||
}
|
||||
|
||||
#ConfigData>div>div>button.btn.btn-danger:hover {
|
||||
background: #d33a3e;
|
||||
text-shadow: unset;
|
||||
}
|
||||
|
||||
#ConfigData>div:nth-child(3)>div>button,
|
||||
#ConfigData>div:nth-child(4)>div>button,
|
||||
#ConfigData>div:nth-child(5)>div>button {
|
||||
text-shadow: unset;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: white;
|
||||
}
|
||||
|
||||
#ConfigData>div:nth-child(3)>div>button:hover,
|
||||
#ConfigData>div:nth-child(4)>div>button:hover,
|
||||
#ConfigData>div:nth-child(5)>div>button:hover {
|
||||
text-shadow: unset;
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
color: white;
|
||||
}
|
||||
|
||||
#ConfigData input.btn.btn-primary {
|
||||
background: var(--button-color-hover) !important;
|
||||
text-shadow: unset;
|
||||
color: var(--button-text-hover) !important;
|
||||
border: 1px solid var(--button-color-hover);
|
||||
}
|
||||
|
||||
#ConfigData input.btn {
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
text-shadow: unset;
|
||||
color: #a8a8a8;
|
||||
}
|
||||
|
||||
#Config_ViewButton {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
#Config_ViewButton:hover {
|
||||
background: hsla(0, 0%, 100%, .08);
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
#DownloadsEditDialog input.btn.btn-primary {
|
||||
background: var(--button-color) !important;
|
||||
text-shadow: unset;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#HistoryEdit_ParamData input.btn.btn-primary {
|
||||
background: var(--button-color) !important;
|
||||
text-shadow: unset;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn {
|
||||
color: var(--button-text);
|
||||
text-shadow: none;
|
||||
background-color: var(--button-color);
|
||||
background-image: none;
|
||||
/* border-color: transparent;
|
||||
border-bottom-color: transparent; */
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
|
||||
}
|
||||
|
||||
.config-header .btn {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.btn-group.open .btn.dropdown-toggle {
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
#ConfigData>div>div>table>tbody>tr>td>.btn {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
text-shadow: unset;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#ConfigData>div>div>table>tbody>tr>td>.btn:hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
.uneditable-input {
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
color: var(--text) !important;
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
input:focus:not(.btn),
|
||||
textarea:focus,
|
||||
.uneditable-input:focus {
|
||||
background: rgba(255, 255, 255, 0.10) !important;
|
||||
color: var(--text-hover) !important;
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
select {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid #00000000;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1b1b1b !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
input[type="file"]:focus,
|
||||
input[type="radio"]:focus,
|
||||
input[type="checkbox"]:focus,
|
||||
select:focus {
|
||||
outline: thin dotted #333;
|
||||
outline: none;
|
||||
outline-offset: -2px;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
input:focus,
|
||||
textarea:focus {
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
font-weight: bold;
|
||||
border-radius: unset;
|
||||
border-bottom-left-radius: 0px;
|
||||
border-bottom-right-radius: 0px;
|
||||
border: 0px;
|
||||
background-color: hsla(0, 0%, 100%, .05);
|
||||
text-shadow: unset;
|
||||
color: var(--text-hover);
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.alert-inverse {
|
||||
background-color: #414141;
|
||||
background-image: 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;
|
||||
border-color: transparent;
|
||||
opacity: 1;
|
||||
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
|
||||
label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.badge-active,
|
||||
#MessagesTabBadge {
|
||||
background-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
-webkit-box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
|
||||
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
|
||||
}
|
||||
|
||||
.label:not(.label-success, .label-warning, .label-important, .label-info, .label-inverse),
|
||||
.badge:not(.badge-success, .badge-warning, .badge-important, .badge-info, .badge-inverse) {
|
||||
font-size: 10.998px;
|
||||
font-weight: bold;
|
||||
line-height: 14px;
|
||||
color: #ffffff;
|
||||
text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
|
||||
white-space: nowrap;
|
||||
vertical-align: baseline;
|
||||
background-color: rgb(255 255 255 / 25%);
|
||||
}
|
||||
|
||||
#ConfigNav {
|
||||
border: 1px solid rgba(0, 0, 0, .25);
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
#ConfigNav.nav-list a {
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.nav-list>li>a,
|
||||
.nav-list .nav-header {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.nav-list>.active>a,
|
||||
.nav-list>.active>a:hover {
|
||||
color: #ffffff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
|
||||
background-color: #0088cc;
|
||||
}
|
||||
|
||||
.nav-list>.active>a,
|
||||
.nav-list>.active>a:hover {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.nav>li>a:hover {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.nav-list .divider {
|
||||
background-color: rgb(var(--accent-color));
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
span.help-option-title {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.help-block,
|
||||
.help-inline {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.confirm-help-block {
|
||||
color: #eee;
|
||||
font-size: 13px;
|
||||
line-height: 16px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.input-prepend .add-on,
|
||||
.input-append .add-on {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
background-image: 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;
|
||||
background-color: transparent;
|
||||
color: #FFFFFF !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.config-settitle {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.caret {
|
||||
border-top: 4px solid #ffffff;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 18px 0;
|
||||
border: 0;
|
||||
border-top: 1px solid gb(var(--accent-color));
|
||||
border-bottom: 1px solid gb(var(--accent-color));
|
||||
}
|
||||
583
CSS/themes/nzbhydra2/nzbhydra2-base.css
Normal file
583
CSS/themes/nzbhydra2/nzbhydra2-base.css
Normal file
@ -0,0 +1,583 @@
|
||||
/* 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(https://theme-park.dev/CSS/defaults/placeholders.css);
|
||||
|
||||
body,
|
||||
html {
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
font-family: Open Sans Semibold, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.navbar-default {
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>.active>a,
|
||||
.navbar-default .navbar-nav>.active>a:focus,
|
||||
.navbar-default .navbar-nav>.active>a:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a:focus,
|
||||
.navbar-default .navbar-nav>li>a:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.growl-container>.alert-info.icon {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.alert-info {
|
||||
background: rgb(var(--accent-color));
|
||||
border-color: transparent;
|
||||
color: var(--label-text-color);
|
||||
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.alert-info a:hover {
|
||||
color: var(--link-color);
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
/* Config */
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.nav-tabs>li.active>a,
|
||||
.nav-tabs>li.active>a:focus,
|
||||
.nav-tabs>li.active>a:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid #1a1f2000;
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs>li>a:hover {
|
||||
border-color: transparent;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.nav>li>a:focus,
|
||||
.nav>li>a:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.nav-tabs>li>a {
|
||||
margin-right: 2px;
|
||||
line-height: 1.42857143;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px 4px 0 0;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.formly>.formly-field-group {
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
legend,
|
||||
label {
|
||||
color: var(--text-hover);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-primary {
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary.active,
|
||||
.btn-primary.focus,
|
||||
.btn-primary:active,
|
||||
.btn-primary:focus,
|
||||
.btn-primary:hover,
|
||||
.open>.dropdown-toggle.btn-primary {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary.active.focus,
|
||||
.btn-primary.active:focus,
|
||||
.btn-primary.active:hover,
|
||||
.btn-primary:active.focus,
|
||||
.btn-primary:active:focus,
|
||||
.btn-primary:active:hover,
|
||||
.open>.dropdown-toggle.btn-primary.focus,
|
||||
.open>.dropdown-toggle.btn-primary:focus,
|
||||
.open>.dropdown-toggle.btn-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-info.active,
|
||||
.btn-info.focus,
|
||||
.btn-info:active,
|
||||
.btn-info:focus,
|
||||
.btn-info:hover,
|
||||
.open>.dropdown-toggle.btn-info {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-info.active.focus,
|
||||
.btn-info.active:focus,
|
||||
.btn-info.active:hover,
|
||||
.btn-info:active.focus,
|
||||
.btn-info:active:focus,
|
||||
.btn-info:active:hover,
|
||||
.open>.dropdown-toggle.btn-info.focus,
|
||||
.open>.dropdown-toggle.btn-info:focus,
|
||||
.open>.dropdown-toggle.btn-info:hover {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-default:not(.uib-day button, .uib-month button, .uib-year button) {
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.btn-default.active,
|
||||
.btn-default.focus,
|
||||
.btn-default:active,
|
||||
.btn-default:focus,
|
||||
.btn-default:hover,
|
||||
.open>.dropdown-toggle.btn-default {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-default.active.focus,
|
||||
.btn-default.active:focus,
|
||||
.btn-default.active:hover,
|
||||
.btn-default:active.focus,
|
||||
.btn-default:active:focus,
|
||||
.btn-default:active:hover,
|
||||
.open>.dropdown-toggle.btn-default.focus,
|
||||
.open>.dropdown-toggle.btn-default:focus,
|
||||
.open>.dropdown-toggle.btn-default:hover {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.config-button {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.btn-success.active.focus,
|
||||
.btn-success.active:focus,
|
||||
.btn-success.active:hover,
|
||||
.btn-success:active.focus,
|
||||
.btn-success:active:focus,
|
||||
.btn-success:active:hover,
|
||||
.open>.dropdown-toggle.btn-success.focus,
|
||||
.open>.dropdown-toggle.btn-success:focus,
|
||||
.open>.dropdown-toggle.btn-success:hover {
|
||||
outline: none !important;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-danger.active.focus,
|
||||
.btn-danger.active:focus,
|
||||
.btn-danger.active:hover,
|
||||
.btn-danger:active.focus,
|
||||
.btn-danger:active:focus,
|
||||
.btn-danger:active:hover,
|
||||
.open>.dropdown-toggle.btn-danger.focus,
|
||||
.open>.dropdown-toggle.btn-danger:focus,
|
||||
.open>.dropdown-toggle.btn-danger:hover {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.btn-warning.active.focus,
|
||||
.btn-warning.active:focus,
|
||||
.btn-warning.active:hover,
|
||||
.btn-warning:active.focus,
|
||||
.btn-warning:active:focus,
|
||||
.btn-warning:active:hover,
|
||||
.open>.dropdown-toggle.btn-warning.focus,
|
||||
.open>.dropdown-toggle.btn-warning:focus,
|
||||
.open>.dropdown-toggle.btn-warning:hover {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a:focus,
|
||||
.dropdown-menu>li>a:hover {
|
||||
text-decoration: none;
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.history-title {
|
||||
font-style: italic;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.bootstrap-switch {
|
||||
border: 1px solid rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default {
|
||||
color: var(--text-muted);
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.input-group-btn:last-child>.btn,
|
||||
.input-group-btn:last-child>.btn-group {
|
||||
margin-left: -1px;
|
||||
background: #f0f8ff00;
|
||||
}
|
||||
|
||||
.input-group-btn2 {
|
||||
border: 1px solid var(--button-color);
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.input-group-btn1 {
|
||||
border: 1px solid var(--button-color);
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
color: var(--button-text);
|
||||
border: 1px solid var(--button-color);
|
||||
background: var(--button-color);
|
||||
|
||||
}
|
||||
|
||||
/* Form Control */
|
||||
|
||||
.form-control {
|
||||
border: 1px solid transparent;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: rgba(255, 255, 255, 0);
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
outline: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
select.form-control:focus {
|
||||
background: #1b1b1b;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
/* .input-group-addon {
|
||||
outline: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid transparent;
|
||||
|
||||
} */
|
||||
|
||||
/* Categories */
|
||||
.panel {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.repeatsection {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
box-shadow: 0 0 4px 1px transparent;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
.modal-body {
|
||||
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;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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-bottom: 1px solid rgb(var(--accent-color));
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
border: 1px solid transparent;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.well {
|
||||
background-color: hsla(0, 0%, 0%, 0.45);
|
||||
border: 1px solid #00000000;
|
||||
}
|
||||
|
||||
/* Updates */
|
||||
.alert-warning {
|
||||
background: rgba(255, 255, 255, 0.25);
|
||||
border-color: transparent;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.panel-default>.panel-heading {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.panel-default>.panel-heading {
|
||||
color: var(--text);
|
||||
border-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.list-group-item {
|
||||
background-color: rgba(0, 0, 0, 0.08);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
/* Table */
|
||||
table {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.table>thead>tr>th {
|
||||
vertical-align: bottom;
|
||||
border-bottom: 2px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.table>tbody>tr>td,
|
||||
.table>tbody>tr>th,
|
||||
.table>tfoot>tr>td,
|
||||
.table>tfoot>tr>th,
|
||||
.table>thead>tr>td,
|
||||
.table>thead>tr>th {
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.table-hover>tbody>tr:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.search-result-tbody {
|
||||
color: white;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* FORM LOGIN */
|
||||
body>div>div.center-form.panel.col-md-8>div>form>button {
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
|
||||
}
|
||||
|
||||
body>div>div.center-form.panel.col-md-8>div>form>button:hover,
|
||||
body>div>div.center-form.panel.col-md-8>div>form>button:focus,
|
||||
body>div>div.center-form.panel.col-md-8>div>form>button:active {
|
||||
color: var(--button-text-hover);
|
||||
background: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
|
||||
}
|
||||
|
||||
/* SEARCH */
|
||||
.search-results-table {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.filter-button.btn-default:focus,
|
||||
.filter-button.btn-default:focus.active {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.indexer-statuses-accordion {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Pagination */
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
text-decoration: none;
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
|
||||
}
|
||||
|
||||
.pagination>li>a:focus,
|
||||
.pagination>li>a:hover,
|
||||
.pagination>li>span:focus,
|
||||
.pagination>li>span:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.pagination>.active>a,
|
||||
.pagination>.active>a:focus,
|
||||
.pagination>.active>a:hover,
|
||||
.pagination>.active>span,
|
||||
.pagination>.active>span:focus,
|
||||
.pagination>.active>span:hover {
|
||||
z-index: 2;
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
cursor: default
|
||||
}
|
||||
|
||||
.pagination>.disabled>a,
|
||||
.pagination>.disabled>a:focus,
|
||||
.pagination>.disabled>a:hover,
|
||||
.pagination>.disabled>span,
|
||||
.pagination>.disabled>span:focus,
|
||||
.pagination>.disabled>span:hover {
|
||||
color: var(--text-muted);
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
border-color: rgba(255, 255, 255, .1);
|
||||
cursor: not-allowed
|
||||
}
|
||||
|
||||
/*pre*/
|
||||
pre {
|
||||
color: var(--text);
|
||||
background: var(--modal-bg-color);
|
||||
border: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
chart>nvd3>svg>text {
|
||||
fill: var(--text-muted);
|
||||
}
|
||||
|
||||
.caption,
|
||||
caption {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.default-chip {
|
||||
border: 1px solid rgb(var(--accent-color));
|
||||
border-radius: 5px;
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
padding: 0 2px 0 2px;
|
||||
}
|
||||
|
||||
chip-tmpl:focus .default-chip {
|
||||
border: 2px solid var(--accent-color-hover);
|
||||
background: var(--accent-color-hover);
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
706
CSS/themes/ombi/ombi-base.css
Normal file
706
CSS/themes/ombi/ombi-base.css
Normal file
@ -0,0 +1,706 @@
|
||||
/* 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 */
|
||||
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
html,
|
||||
body,
|
||||
.wizard-background,
|
||||
.content-container,
|
||||
.mat-sidenav-container {
|
||||
color: var(--text) !important;
|
||||
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;
|
||||
}
|
||||
|
||||
.content-container .top-bar-container {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
legend {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.forgot-password:active,
|
||||
.forgot-password:focus,
|
||||
.forgot-password:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
/* SCROLLBAR */
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 3px;
|
||||
background: rgb(255 255 255 / 30%);
|
||||
}
|
||||
|
||||
/* TOP NAV */
|
||||
.top-search-bar .mat-form-field-flex {
|
||||
border: 1px solid rgba(255, 255, 255, 0.10);
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
/* Drop down menu */
|
||||
.mat-menu-panel,
|
||||
#requestsToDisplayDropdown-panel {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) {
|
||||
background: hsl(0deg 0% 0% / 25%);
|
||||
}
|
||||
|
||||
/* SIDE NAV */
|
||||
|
||||
@media only screen and (min-width: 1025px){
|
||||
#main-container\ dark > mat-sidenav-container > mat-sidenav-content {
|
||||
margin-left: 256px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* OMBI TEXT */
|
||||
.sidenav-container .sidenav .application-name {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.sidenav-container .sidenav {
|
||||
background: hsla(0, 0%, 0%, 0.438) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav {
|
||||
background: var(--modal-bg-color) !important;
|
||||
color: #fff;
|
||||
font-family: Montserrat, sans-serif;
|
||||
width: 16rem;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav .menu-spacing {
|
||||
margin-bottom: 5%;
|
||||
/* padding-left: .5rem;
|
||||
padding-right: .5rem; */
|
||||
}
|
||||
|
||||
.mat-drawer-backdrop.mat-drawer-shown {
|
||||
background-color: hsl(0deg 0% 0% / 50%);
|
||||
backdrop-filter: blur(10px) !important;
|
||||
-webkit-backdrop-filter: blur(10px) !important;
|
||||
}
|
||||
|
||||
.mat-list-base {
|
||||
padding-top: 8px;
|
||||
display: block;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
padding-left: .5rem;
|
||||
padding-right: .5rem;
|
||||
}
|
||||
|
||||
.sidenav-container[_ngcontent-icv-c127] .sidenav[_ngcontent-icv-c127] .active-list-item[_ngcontent-icv-c127] {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav .active-list-item,
|
||||
.sidenav-container .sidenav .active-list-item:hover {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
background: rgb(255 255 255 / 15%) !important;
|
||||
border-radius: .375rem !important;
|
||||
padding: 10px 20px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
[id*="nav-"] {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav .mat-list-item {
|
||||
font-family: Roboto, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
padding: 10px 0 0 0;
|
||||
height: auto;
|
||||
margin-bottom: .5rem;
|
||||
width: 15rem !important;
|
||||
padding-left: .5rem !important;
|
||||
padding-right: .5rem !important;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav .mat-drawer-inner-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav .mat-list-base .mat-list-item .mat-list-item-content,
|
||||
.sidenav-container .sidenav.mat-list-base .mat-list-option .mat-list-item-content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav .mat-list-base .mat-list-item .mat-list-item-ripple,
|
||||
.sidenav-container .sidenav.mat-list-base .mat-list-option .mat-list-item-ripple {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.sidenav-container .sidenav.mat-action-list .mat-list-item:focus,
|
||||
.sidenav-container .sidenav.mat-list-option:focus,
|
||||
.sidenav-container .sidenav .mat-nav-list .mat-list-item:focus,
|
||||
.sidenav-container .sidenav.mat-action-list .mat-list-item:focus:hover,
|
||||
.sidenav-container .sidenav.mat-list-option:focus:hover,
|
||||
.sidenav-container .sidenav .mat-nav-list .mat-list-item:focus:hover {
|
||||
background: hsla(0, 0%, 100%, .04);
|
||||
border-radius: .375rem !important;
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
|
||||
.sidenav-container .sidenav .mat-action-list .mat-list-item:hover:not(.active-list-item),
|
||||
.mat-list-option:hover:not(.active-list-item),
|
||||
.sidenav-container .sidenav .mat-nav-list .mat-list-item:hover:not(.active-list-item) {
|
||||
background: hsla(0, 0%, 100%, .04);
|
||||
border-radius: .375rem !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.active-advanced.fa-filter{
|
||||
color: rgb(var(--accent-color));
|
||||
background:none;
|
||||
}
|
||||
|
||||
/* DISCOVER PAGE */
|
||||
.discover-filter-buttons-group {
|
||||
background: rgb(255 255 255 / 8%) !important;
|
||||
border: 1px solid rgb(255 255 255 / 10%) !important;
|
||||
border-radius: 30px;
|
||||
color: #fff;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.discover-filter-buttons-group .button-active {
|
||||
background: rgba(0, 0, 0, 0.45) !important;
|
||||
}
|
||||
|
||||
#search-filter{
|
||||
color:var(--text);
|
||||
}
|
||||
|
||||
.small-middle-container [div*="_ngcontent-"] {
|
||||
margin: auto;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.small-middle-container.ng-star-inserted {
|
||||
width: 85% !important;
|
||||
margin: 10px auto auto !important;
|
||||
}
|
||||
|
||||
.small-middle-container[div*="_ngcontent-"] {
|
||||
width: 95% !important;
|
||||
margin: 10px auto auto !important;
|
||||
}
|
||||
|
||||
/* @media (min-width: 768px) {
|
||||
.content-container {
|
||||
margin-left: 255px !important;
|
||||
}
|
||||
|
||||
.content-container .section {
|
||||
margin: 6px !important;
|
||||
}
|
||||
} */
|
||||
|
||||
/* MOBILE */
|
||||
@media (min-width: 768px) {
|
||||
.sidenav-container .sidenav {
|
||||
background: hsla(0, 0%, 0%, 0.438) !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.p-carousel-item {
|
||||
min-height: 230px !important;
|
||||
max-width: 11.7rem !important
|
||||
}
|
||||
|
||||
.p-carousel .p-carousel-content .p-carousel-next,
|
||||
.p-carousel .p-carousel-content .p-carousel-prev {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.right {
|
||||
text-align: right !important;
|
||||
margin-top: -61px;
|
||||
}
|
||||
}
|
||||
|
||||
.p-carousel-item {
|
||||
min-height: 290px;
|
||||
max-height: 290px;
|
||||
max-width: 12rem;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.section h2 {
|
||||
margin-left: 5px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.section h2 {
|
||||
margin-left: 63px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.ombi-card {
|
||||
padding: 0px !important;
|
||||
margin: 5px !important;
|
||||
}
|
||||
|
||||
#cardImage,
|
||||
.ombi-card {
|
||||
border-radius: .75rem !important;
|
||||
}
|
||||
|
||||
#cardImage {
|
||||
min-height: 225px;
|
||||
}
|
||||
|
||||
.p-carousel-indicators,
|
||||
.p-carousel-items-container {
|
||||
display: flex;
|
||||
padding-bottom: 5px;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.c .card-top-info {
|
||||
top: -1px !important;
|
||||
position: absolute;
|
||||
border-radius: .75rem .75rem 0 0 !important;
|
||||
background-color: rgba(0, 0, 0, 0.7) !important;
|
||||
backdrop-filter: blur(10px) !important;
|
||||
-webkit-backdrop-filter: blur(10px) !important;
|
||||
transition: 0s -webkit-filter linear;
|
||||
}
|
||||
|
||||
.ombi-card .button-request-container .button-request {
|
||||
/* padding-left: .5rem !important;
|
||||
padding-right: .5rem !important; */
|
||||
}
|
||||
|
||||
#info-wrapper .mat-card,
|
||||
.mat-expansion-panel {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
#info-wrapper .mat-card.mat-card-flat:not([class*=mat-elevation-z]) {
|
||||
box-shadow: 0 0 0 0 rgb(0 0 0 / 20%), 0 0 0 0 rgb(0 0 0 / 14%), 0 0 0 0 rgb(0 0 0 / 12%);
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#info-wrapper .mat-card .label,
|
||||
#info-wrapper .mat-card .mat-card-header {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#info-wrapper .mat-card,
|
||||
#info-wrapper .mat-card-content {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.btn-ombi {
|
||||
background-color: rgba(0, 0, 0, 0.85) !important;
|
||||
/* backdrop-filter: blur(10px) !important;
|
||||
-webkit-backdrop-filter: blur(10px) !important; */
|
||||
border-radius: .375rem !important;
|
||||
padding: 0 .375rem !important;
|
||||
}
|
||||
|
||||
.btn-ombi.mat-raised-button {
|
||||
line-height: 29.4px !important;
|
||||
}
|
||||
|
||||
.btn-ombi:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
|
||||
}
|
||||
|
||||
.c .button-request-container {
|
||||
padding: 0 .375rem !important;
|
||||
/* padding: .375rem !important; */
|
||||
}
|
||||
|
||||
.ombi-card .button-request-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin: -40px 0 0 !important;
|
||||
opacity: 0;
|
||||
transition: .3s ease;
|
||||
}
|
||||
|
||||
.p-carousel-item,
|
||||
.ombi-card {
|
||||
transition: .3s ease-in-out;
|
||||
}
|
||||
|
||||
.ombi-card #cardImage:hover {
|
||||
/* transform: scale(1.02) !important; */
|
||||
}
|
||||
|
||||
/* Search results */
|
||||
@media (min-width: 768px) {
|
||||
#searchResults .ombi-card {
|
||||
margin-bottom: 15px !important;
|
||||
margin-left: 0px !important;
|
||||
height: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
#searchResults {
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
|
||||
/* Wizard */
|
||||
.wizard-background .mat-stepper-horizontal,
|
||||
.mat-stepper-vertical,
|
||||
.mat-tooltip {
|
||||
background: rgb(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
small.important {
|
||||
color: red;
|
||||
background: rgba(0, 0, 0, .25);
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.mat-step-header .mat-step-label,
|
||||
.mat-step-header .mat-step-optional {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
/* Accents */
|
||||
.mat-step-header .mat-step-icon {
|
||||
background-color: rgb(var(--accent-color)) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.mat-tab-group.mat-primary .mat-ink-bar,
|
||||
.mat-tab-nav-bar.mat-primary .mat-ink-bar {
|
||||
background-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* slide toggle */
|
||||
.mat-slide-toggle.mat-checked .mat-slide-toggle-bar {
|
||||
background-color: rgba(var(--accent-color), .54) !important;
|
||||
}
|
||||
|
||||
.mat-slide-toggle.mat-checked .mat-slide-toggle-thumb {
|
||||
background-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.mat-fab.mat-accent,
|
||||
.mat-flat-button.mat-accent,
|
||||
.mat-mini-fab.mat-accent,
|
||||
.mat-raised-button.mat-accent,
|
||||
.buttons .mat-raised-button {
|
||||
color: var(--button-text) !important;
|
||||
background-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.mat-raised-button:not([class*=mat-elevation-z]):not(.mat-raised-button.mat-warn):not(.viewon-btn.plex) {
|
||||
box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.mat-raised-button:not([class*=mat-elevation-z]):not(.mat-raised-button.mat-warn):not(.viewon-btn.plex):hover {
|
||||
box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
|
||||
background: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-persistent-ripple, .mat-radio-button.mat-accent .mat-radio-inner-circle, .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), .mat-radio-button.mat-accent:active .mat-radio-persistent-ripple {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Plex buttons */
|
||||
.viewon-btn.plex,
|
||||
.viewon-btn.emby,
|
||||
.viewon-btn.jellyfin {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* login button */
|
||||
button#sign-in {
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.mat-fab.mat-primary,
|
||||
.mat-flat-button.mat-primary,
|
||||
.mat-mini-fab.mat-primary,
|
||||
.mat-raised-button.mat-primary {
|
||||
box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
|
||||
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;
|
||||
}
|
||||
|
||||
button.admin-cog {
|
||||
color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.grow:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
::ng-deep .dark .mat-form-field.mat-focused .mat-form-field-label,
|
||||
::ng-deep .mat-form-field.mat-focused .mat-form-field-label {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.mat-form-field.mat-focused .mat-form-field-label.mat-accent,
|
||||
.mat-focused .mat-form-field-required-marker,
|
||||
.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-accent .mat-form-field-infix:after,
|
||||
.mat-form-field.mat-focused.mat-accent .mat-select-arrow,
|
||||
.mat-toolbar .mat-focused .mat-form-field-ripple,
|
||||
.mat-toolbar .mat-form-field-ripple,
|
||||
.mat-toolbar .mat-form-field-underline,
|
||||
.mat-toolbar .mat-focused .mat-form-field-label,
|
||||
.mat-toolbar .mat-form-field-label,
|
||||
.mat-toolbar .mat-form-field.mat-focused .mat-select-arrow,
|
||||
.mat-toolbar .mat-select-arrow,
|
||||
.mat-toolbar .mat-select-value,
|
||||
.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick,
|
||||
.mat-form-field.mat-focused .mat-form-field-label,
|
||||
.mat-form-field.mat-focused .mat-form-field-ripple {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.mat-checkbox-checked.mat-accent .mat-checkbox-background,
|
||||
.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: rgb(var(--accent-color));
|
||||
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color) / 25%);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.p-autocomplete .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
|
||||
box-shadow: inset 0 0 0 1px rgb(var(--accent-color)), inset 0 0 0 1px rgb(var(--accent-color)), inset 0 0 0 1px rgb(var(--accent-color)), inset 0 0 0 1px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.p-autocomplete .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Check box*/
|
||||
.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element,
|
||||
.mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {
|
||||
background: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
|
||||
/* popups */
|
||||
.mat-snack-bar-container {
|
||||
color: var(--text);
|
||||
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;
|
||||
box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12)
|
||||
}
|
||||
|
||||
/* Login page */
|
||||
.login-card H1.login_logo {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
|
||||
.mat-table-sticky,
|
||||
.mat-table tbody,
|
||||
.mat-table tfoot,
|
||||
.mat-table thead,
|
||||
[mat-footer-row],
|
||||
[mat-header-row],
|
||||
[mat-row],
|
||||
mat-footer-row,
|
||||
mat-header-row,
|
||||
mat-row {
|
||||
background: rgb(255 255 255 / 0%);
|
||||
}
|
||||
|
||||
.mat-paginator,
|
||||
.mat-table {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
tr.mat-header-row {
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
.table thead th {
|
||||
vertical-align: bottom;
|
||||
border-bottom: 2px solid rgb(255 255 255 / 25%);
|
||||
border-top: 1px solid rgb(255 255 255 / 25%);
|
||||
}
|
||||
|
||||
/* Details page */
|
||||
|
||||
#info-wrapper .p-carousel-item {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
#viewCollectionBtn {
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button {
|
||||
background: rgb(var(--accent-color));
|
||||
color: #121212;
|
||||
}
|
||||
|
||||
#info-wrapper .mat-chip.mat-standard-chip.mat-chip-selected.mat-primary {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.full-screenshot.enabled.overlay {
|
||||
background-image: linear-gradient(180deg, transparent, 50%, rgb(var(--accent-color), 0.1));
|
||||
}
|
||||
|
||||
.social-icons-container {
|
||||
background-color: hsl(0deg 0% 0% / 85%) !important;
|
||||
backdrop-filter: blur(10px) !important;
|
||||
-webkit-backdrop-filter: blur(10px) !important;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.mat-autocomplete-panel,
|
||||
.mat-dialog-container {
|
||||
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;
|
||||
}
|
||||
|
||||
.mat-bottom-sheet-container {
|
||||
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;
|
||||
}
|
||||
|
||||
/* OTHER */
|
||||
.mat-tooltip {
|
||||
background: var(--drop-down-menu-bg) !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;
|
||||
}
|
||||
|
||||
.mat-progress-spinner.mat-accent circle,
|
||||
.mat-spinner.mat-accent circle {
|
||||
stroke: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* ADVANCED SEARCH MODAL */
|
||||
.alert-info {
|
||||
background: rgba(255, 255, 255, .25) !important;
|
||||
border-color: rgba(255, 255, 255, .1) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
2513
CSS/themes/organizr/organizr-base.css
Normal file
2513
CSS/themes/organizr/organizr-base.css
Normal file
File diff suppressed because one or more lines are too long
524
CSS/themes/overseerr/overseerr-base.css
Normal file
524
CSS/themes/overseerr/overseerr-base.css
Normal file
@ -0,0 +1,524 @@
|
||||
/* TEXT */
|
||||
[class*="text-gray-"]:not(button:disabled) {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
[class*="text-indigo-"]:not(.text-indigo-100) {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.text-indigo-100 {
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.tagline,
|
||||
.media-crew>li>span {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
p {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>div>div.relative.z-10.flex.flex-col.flex-1.min-w-0.pr-4>div.flex.items-center.mt-2.text-sm.sm\:mt-1>span {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.media-fact-value a,
|
||||
.media-fact-value button,
|
||||
a.crew-name,
|
||||
.card-field a,
|
||||
.prose a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a.text-indigo-500 {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
a.text-indigo-500:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.media-fact-value a:hover,
|
||||
.media-fact-value button:hover,
|
||||
a.crew-name:hover,
|
||||
.prose a:hover,
|
||||
.card-field a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.label-tip {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
button[class*="bg-indigo-"],
|
||||
button[class*="bg-gray-"],
|
||||
button[class*="border-indigo-"],
|
||||
button[class*="border-gray-"],
|
||||
button.input-action {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
button[class*="text-white"] {
|
||||
color: var(--button-text)
|
||||
}
|
||||
|
||||
button[class*="bg-indigo-"]:hover,
|
||||
button[class*="bg-gray-"]:hover,
|
||||
button[class*="border-indigo-"]:hover,
|
||||
button[class*="border-gray-"]:hover,
|
||||
button.input-action:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
button[class*="text-white"]:hover,
|
||||
button.input-action:hover {
|
||||
color: var(--button-text-hover)
|
||||
}
|
||||
|
||||
/* INPUT FORMS */
|
||||
|
||||
[multiple]:focus,
|
||||
[type=date]:focus,
|
||||
[type=datetime-local]:focus,
|
||||
[type=email]:focus,
|
||||
[type=month]:focus,
|
||||
[type=number]:focus,
|
||||
[type=password]:focus,
|
||||
[type=search]:focus,
|
||||
[type=tel]:focus,
|
||||
[type=text]:focus,
|
||||
[type=time]:focus,
|
||||
[type=url]:focus,
|
||||
[type=week]:focus,
|
||||
select:focus,
|
||||
textarea:focus {
|
||||
--tw-ring-color: rgb(var(--accent-color));
|
||||
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
||||
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 transparent);
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
input[type=password],
|
||||
input[type=text],
|
||||
select,
|
||||
textarea {
|
||||
border-color: rgba(255, 255, 255, .1);
|
||||
background-color: rgba(7, 7, 7, .25);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
input[type=checkbox] {
|
||||
color: rgba(var(--accent-color));
|
||||
}
|
||||
|
||||
[type=checkbox]:focus,
|
||||
[type=radio]:focus {
|
||||
outline: 2px solid transparent;
|
||||
outline-offset: 2px;
|
||||
--tw-ring-offset-width: 2px;
|
||||
--tw-ring-offset-color: #fff;
|
||||
--tw-ring-color: rgb(var(--accent-color));
|
||||
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
||||
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
||||
}
|
||||
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div>div.relative.mt-4.text-sm.leading-5.text-gray-300>div.flex.flex-col>div>div>div>table>tbody>tr>td.px-4.py-4.text-sm.font-medium.leading-5.text-gray-100.whitespace-nowrap.false>span>span.bg-indigo-500,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div>div.relative.mt-4.text-sm.leading-5.text-gray-300>div.flex.flex-col>div>div>div>table>thead>tr>th.w-16.px-4.py-3.bg-gray-500.false>span>span.bg-indigo-500 {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
span.bg-indigo-500 {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__control {
|
||||
border-color: rgba(255, 255, 255, 0.1) !important;
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.react-select-container .react-select__option--is-focused {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
|
||||
.group-label,
|
||||
label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1f1f1f;
|
||||
}
|
||||
|
||||
|
||||
/* BG STUFF */
|
||||
#__next>div,
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.bg-gray-800 {
|
||||
--tw-bg-opacity: 0.3;
|
||||
background-color: rgb(0, 0, 0, var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.hover\:bg-gray-700:hover {
|
||||
--tw-bg-opacity: .3;
|
||||
background-color: rgb(var(--accent-color), var(--tw-bg-opacity));
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* SEARCH BAR */
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>.bg-gray-700 {
|
||||
background-color: rgb(var(--accent-color), .3)
|
||||
}
|
||||
|
||||
#search_field {
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
|
||||
/* TOP GRADIENT */
|
||||
#__next>div>div.absolute.top-0.w-full.h-64.from-gray-800.to-gray-900.bg-gradient-to-bl .bg-gradient-to-t {
|
||||
background: var(--main-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;
|
||||
|
||||
}
|
||||
|
||||
/* GRADIENT ON CARDS'N'STUFF*/
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>a>div {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>a>div>div>div>div.absolute.bottom-0.left-0.right-0.h-12.rounded-b-xl.bg-gradient-to-t.from-gray-900.bg-gradient-to-t,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>ul>li>a>div>div>div>div.absolute.bottom-0.left-0.right-0.h-12.rounded-b-xl.bg-gradient-to-t.from-gray-900 {
|
||||
background-image: none !important;
|
||||
}
|
||||
|
||||
/* SIDE BAR*/
|
||||
|
||||
.sidebar {
|
||||
border-right-width: 1px;
|
||||
--tw-border-opacity: .1;
|
||||
border-color: rgba(255, 255, 255, var(--tw-border-opacity));
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
#__next>div>div.fixed.top-0.bottom-0.left-0.z-30.hidden.lg\:flex.lg\:flex-shrink-0>div>div>div>nav>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.to-purple-600 {
|
||||
--tw-gradient-to: rgb(var(--accent-color), .3);
|
||||
}
|
||||
|
||||
.hover\:to-purple-500:hover {
|
||||
--tw-gradient-to: rgb(var(--accent-color), .8);
|
||||
}
|
||||
|
||||
#__next>div>div.fixed.top-0.bottom-0.left-0.z-30.hidden.lg\:flex.lg\:flex-shrink-0>div>div>div>nav>a.flex.group.items-center.px-2.py-2.text-lg.leading-6.font-medium.rounded-md.text-white.focus\:outline-none.transition.ease-in-out.duration-150.bg-gradient-to-br.from-indigo-600.to-purple-600.hover\:from-indigo-500.hover\:to-purple-500,
|
||||
#__next>div>div.lg\:hidden>div>div.relative.flex.flex-col.flex-1.w-full.max-w-xs.bg-gray-800.sidebar.appear-done.enter-done>div.flex.flex-col.flex-1.h-0.pt-8.pb-8.overflow-y-auto.sm\:pb-4>nav>a.flex.items-center.px-2.py-2.text-base.leading-6.font-medium.rounded-md.text-white.focus\:outline-none.transition.ease-in-out.duration-150.bg-gradient-to-br.from-indigo-600.to-purple-600.hover\:from-indigo-500.hover\:to-purple-500 {
|
||||
--tw-gradient-from: rgb(var(--accent-color), .5);
|
||||
--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(var(--accent-color), .5));
|
||||
}
|
||||
|
||||
#__next>div>div.fixed.top-0.bottom-0.left-0.z-30.hidden.lg\:flex.lg\:flex-shrink-0>div>div>div>nav>a.flex.group.items-center.px-2.py-2.text-lg.leading-6.font-medium.rounded-md.text-white.focus\:outline-none.transition.ease-in-out.duration-150.bg-gradient-to-br.from-indigo-600.to-purple-600.hover\:from-indigo-500.hover\:to-purple-500 {
|
||||
background: rgba(var(--accent-color), 0.05);
|
||||
color: rgba(var(--accent-color));
|
||||
}
|
||||
|
||||
body>div.z-50.fixed.inset-0.overflow-hidden.bg-opacity-70.bg-gray-800.enter-done>div>section>div>div {
|
||||
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;
|
||||
}
|
||||
|
||||
body>div.z-50.fixed.inset-0.overflow-hidden.bg-opacity-70.bg-gray-800.enter-done>div>section>div>div>header,
|
||||
body>div.z-50.fixed.inset-0.overflow-hidden.bg-opacity-70.bg-gray-800.enter-done>div>section>div>div>div {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
body>div.z-50.fixed.inset-0.overflow-hidden.bg-opacity-70.bg-gray-800.enter-done>div>section>div>div>div>div.overflow-hidden.bg-gray-600.rounded-md.shadow {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
#__next>div>div.fixed.top-0.bottom-0.left-0.z-30.hidden.lg\:flex.lg\:flex-shrink-0>div>div>div>div.px-2>a {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
/* LOADER */
|
||||
body>div.fixed.top-0.left-0.z-50.w-full.transition-opacity.ease-out.duration-400.opacity-0>div {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
body>div.fixed.top-0.left-0.z-50.w-full .bg-indigo-400 {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* DISCOVER PAGE */
|
||||
|
||||
.slider-title,
|
||||
.to-purple-400 {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a.slider-title:hover {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
/* CARD HOVER */
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>div>div>div>div:hover {
|
||||
background: linear-gradient(rgba(var(--accent-color), .04) 0%, rgba(var(--accent-color), 0.9) 100%);
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>div>div.absolute.inset-0.z-0>div.absolute.inset-0 {
|
||||
background-image: linear-gradient(135deg, rgba(var(--accent-color), 0.3) 0%, rgba(0, 0, 0) 75%) !important;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>a:hover {
|
||||
background: linear-gradient(rgba(var(--accent-color), .04) 0%, rgba(var(--accent-color), 0.3) 100%);
|
||||
}
|
||||
|
||||
|
||||
/* SHOW PAGE */
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.media-page-bg-image>div.absolute.inset-0 {
|
||||
background: linear-gradient(rgba(var(--accent-color), 0.3) 0%, rgba(0, 0, 0) 100%) !important;
|
||||
}
|
||||
|
||||
#__next > div > div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64 > main > div > div > div > div.media-overview {
|
||||
background: var(--main-bg-color);
|
||||
padding: 1rem 1rem 2rem 0;
|
||||
padding-left: 1rem;
|
||||
margin: 1rem -1rem -1rem;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>a>div:hover,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>ul>li>a>div:hover {
|
||||
--tw-bg-opacity: 0.4;
|
||||
background-color: rgb(var(--accent-color), var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div>div.relative.px-2.py-2.-my-2.-ml-4.-mr-4.overflow-x-scroll.overflow-y-auto.whitespace-nowrap.hide-scrollbar.overscroll-x-contain>div>a>div>div>div>div.text-gray-300 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#__next>div>div .bg-gradient-to-t.from-gray-800 {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.media-facts {
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
color: var(--text-hover) !important;
|
||||
--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
|
||||
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
||||
}
|
||||
|
||||
.media-ratings,
|
||||
.media-fact {
|
||||
border-color: rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.media-fact-value {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* REQUESTS */
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div:nth-child(2)>div>div.absolute.inset-0.z-0.w-full.bg-center.bg-cover.xl\:w-2\/3>div.absolute.inset-0 {
|
||||
background-image: linear-gradient(90deg, rgba(var(--accent-color), 0.2) 0%, rgb(var(--accent-color)) 100%) !important;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div.flex.flex-col.justify-between.mb-4.lg\:items-end.lg\:flex-row>div.mt-8.md\:flex.md\:items-center.md\:justify-between>div>h2>span {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div:nth-child(2)>div>div.absolute.inset-0.z-0.w-full.bg-center.bg-cover.xl\:w-2\/3>div.absolute.inset-0,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div>div.absolute.inset-0.z-0.w-full.bg-center.bg-cover.xl\:w-2\/3>div.absolute.inset-0 {
|
||||
background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.1) 0%, var(--modal-bg-color) 100%) !important;
|
||||
}
|
||||
|
||||
/* RINGA A DINGALING*/
|
||||
.ring-1 {
|
||||
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) rgb(0 0 0 / 10%) !important;
|
||||
}
|
||||
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div.absolute.top-0.left-0.right-0.z-0.h-96>div>div>div.absolute.inset-0 {
|
||||
background-image: linear-gradient(rgba(var(--accent-color), 0.2) 0%, #000 100%) !important;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.bg-gray-800 {
|
||||
background: #000;
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div>div.absolute.inset-0.z-0.w-full.bg-center.bg-cover.xl\:w-2\/3>div.absolute.inset-0,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div:nth-child(2)>div>div.absolute.inset-0.z-0.w-full.bg-center.bg-cover.xl\:w-2\/3>div.absolute.inset-0 {
|
||||
background: linear-gradient(90deg, rgba(var(--accent-color), 0.4) 0%, #000 100%) !important;
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
|
||||
code {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div.mt-6>div.hidden.overflow-x-scroll.border-b.border-gray-600.sm\:block.hide-scrollbar>nav>a.px-1.py-4.ml-8.text-sm.font-medium.leading-5.transition.duration-300.border-b-2.border-transparent.whitespace-nowrap.first\:ml-0.text-indigo-500.border-indigo-600 {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div.mt-10.text-white>div>ul>li>div {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.bg-indigo-600 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(var(--accent-color), var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.focus\:ring:focus {
|
||||
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
||||
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) rgba(var(--accent-color), 0.5);
|
||||
}
|
||||
|
||||
.border-gray-600 {
|
||||
--tw-border-opacity: .1;
|
||||
border-color: rgba(255, 255, 255, var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.actions {
|
||||
--tw-border-opacity: .1;
|
||||
border-color: rgba(255, 255, 255, var(--tw-border-opacity));
|
||||
--tw-text-opacity: 1;
|
||||
color: rgba(255, 255, 255, var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.border-gray-800,
|
||||
.divide-gray-800>:not([hidden])~:not([hidden]) {
|
||||
--tw-border-opacity: .2;
|
||||
border-color: rgba(255, 255, 255, var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-gray-500,
|
||||
.border-gray-700 {
|
||||
--tw-border-opacity: .1;
|
||||
border-color: rgba(255, 255, 255, var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div.mt-10.text-white>div.hidden.sm\:block>nav>a.px-3.py-2.text-sm.font-medium.transition.duration-300.rounded-md.whitespace-nowrap.mx-2.my-1.bg-indigo-700 {
|
||||
background-color: var(--button-color);
|
||||
}
|
||||
|
||||
|
||||
/* TABLE */
|
||||
|
||||
.divide-gray-700>:not([hidden])~:not([hidden]) {
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
table>thead>tr>th,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div.mt-10.text-white>div>div.flex.flex-col>div>div>div>table>tbody>tr.bg-gray-700,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div>div>div>table>tbody>tr.bg-gray-700 {
|
||||
background: rgb(0 0 0 / 25%) !important;
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
|
||||
/* MODAL */
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70.enter-done>div,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70.enter-done>div>div.relative.mt-4.text-sm.leading-5.text-gray-300>div.p-4.bg-gray-600.rounded-md.shadow,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70.enter-done>div>div.absolute.top-0.left-0.right-0.z-0.w-full.h-64>div,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div.bg-gray-700,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div>div.relative.mt-4.text-sm.leading-5.text-gray-300>div.mt-4>div.p-4.bg-gray-600.rounded-md.shadow {
|
||||
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;
|
||||
}
|
||||
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70.enter-done>div>div.absolute.top-0.left-0.right-0.z-0.w-full.h-64>div>img,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div>div.absolute.top-0.left-0.right-0.z-0.w-full.h-64>div>img {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70.enter-done>div>div.absolute.top-0.left-0.right-0.z-0.w-full.h-64>div.absolute.inset-0,
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div>div.absolute.top-0.left-0.right-0.z-0.w-full.h-64>div.absolute.inset-0 {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
body>div.fixed.top-0.bottom-0.left-0.right-0.z-50.flex.items-center.justify-center.w-full.h-full.bg-gray-800.bg-opacity-70>div>div.relative.mt-4.text-sm.leading-5.text-gray-300>div.flex.flex-col>div>div>div>table>tbody {
|
||||
background: rgb(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
|
||||
/* DROPDOWN */
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.media-header>div.media-actions>span>span>div>div.bg-gray-700,
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.media-header>div.media-actions>span>span>div>div>div>a {
|
||||
background: var(--drop-down-menu-bg);
|
||||
}
|
||||
|
||||
#__next>div>div.relative.flex.flex-col.flex-1.w-0.min-w-0.mb-16.lg\:ml-64>main>div>div>div>div.media-header>div.media-actions>span>span>div>div>div>a:hover {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
/* LOGIN */
|
||||
#__next>div>div.relative.z-50.mt-8.sm\:mx-auto.sm\:w-full.sm\:max-w-md>div>button,
|
||||
#__next>div>div.relative.z-50.mt-8.sm\:mx-auto.sm\:w-full.sm\:max-w-md>div>div:nth-child(3)>button {
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
502
CSS/themes/petio/petio-base.css
Normal file
502
CSS/themes/petio/petio-base.css
Normal file
@ -0,0 +1,502 @@
|
||||
/* 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 */
|
||||
|
||||
* {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
/* TEXT COLOR */
|
||||
p,
|
||||
.card .text-wrap .year,
|
||||
.media-content .overview,
|
||||
.media-content .media-crew .crew-credit,
|
||||
.media-content .media-crew .sidebar--item a,
|
||||
.sidebar--item .media-content .media-crew a,
|
||||
.sidebar--item p,
|
||||
.menu--item p {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.person--details p,
|
||||
.text-wrap>p,
|
||||
.card .text-wrap .title,
|
||||
.main-title,
|
||||
.media-details .media-title,
|
||||
.single-title,
|
||||
.sub-title,
|
||||
.sub-title,
|
||||
.widget--title,
|
||||
.settings--menu--item p {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.card .text-wrap>p {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.settings--menu--item.active p {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.settings--menu--item.active {
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.settings--menu--item:hover {
|
||||
border-bottom: 1px solid var(--text-hover);
|
||||
}
|
||||
|
||||
.settings--menu--item.active .icon svg path {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* MENU */
|
||||
.menu {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
@media (max-width: 1099.98px) {
|
||||
|
||||
.sidebar--inner,
|
||||
.sidebar--scroll {
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1100px) {
|
||||
.page .sidebar {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
.menu {
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
.mob-menu-top {
|
||||
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;
|
||||
}
|
||||
|
||||
.menu--item.active {
|
||||
background: rgba(var(--accent-color), .05);
|
||||
border-right: 4px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.sidebar--inner .logo .logo-text span,
|
||||
.menu .logo span {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
@media (min-width: 1100px) {
|
||||
.sidebar--item.active {
|
||||
border-top: none !important;
|
||||
border-right: 4px solid rgb(var(--accent-color));
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar--item.active {
|
||||
background: rgba(var(--accent-color), .05);
|
||||
border-top: 4px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.menu--item.active p,
|
||||
.media-content .media-crew .sidebar--item.active a,
|
||||
.sidebar--item.active .media-content .media-crew a,
|
||||
.sidebar--item.active p {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.menu--item.active .icon svg path,
|
||||
.sidebar--item.active .icon svg path {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.mob-menu-top .nav-toggle span {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.sidebar--item:hover p,
|
||||
.sidebar--item:hover .icon svg path,
|
||||
.menu--item:hover p,
|
||||
.menu--item:hover .icon svg path {
|
||||
color: rgb(var(--accent-color));
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.sidebar--item .icon svg path,
|
||||
.menu--item .icon svg path {
|
||||
fill: var(--text);
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
a,
|
||||
.table-action,
|
||||
.session--toggle,
|
||||
p a,
|
||||
.profile-page .logout,
|
||||
.person--bio--read-more,
|
||||
.filter--item--collapse,
|
||||
.filter--comparison {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.table-action:hover,
|
||||
.session--toggle:hover,
|
||||
p a:hover,
|
||||
.profile-page .logout:hover,
|
||||
.person--bio--read-more:hover,
|
||||
.filter--item--collapse:hover,
|
||||
.filter--comparison:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
/* OTHER */
|
||||
.widget--item hr {
|
||||
background: rgb(255 255 255 / 50%);
|
||||
}
|
||||
|
||||
.widget--item--inner,
|
||||
.sr--instance--inner {
|
||||
background: hsl(0deg 0% 0% / 15%);
|
||||
}
|
||||
|
||||
.filter--add:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.filter--row--add:hover,
|
||||
.filter--row--remove:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.filter--item {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.spinner svg {
|
||||
filter: var(--petio-spinner);
|
||||
}
|
||||
|
||||
.request-status {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.filter--action {
|
||||
background: rgba(var(--accent-color), .3);
|
||||
}
|
||||
|
||||
.sr--add-new .sr--instance--inner:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.console--item {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
code {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.color-green,
|
||||
.color-orange,
|
||||
.color-blue,
|
||||
.color-red {
|
||||
/* Ratings */
|
||||
background: rgb(0 0 0 / 25%);
|
||||
border-radius: 5px;
|
||||
padding: 0px 7px;
|
||||
}
|
||||
|
||||
.color-blue {
|
||||
color: #4eaff4;
|
||||
}
|
||||
|
||||
.setup--step.active {
|
||||
border-color: rgb(var(--accent-color));
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.setup--wrap .server-select-option.selected {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.login-wrap .logo span {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* DASH */
|
||||
.session--prog,
|
||||
.session--media .card .playback-status {
|
||||
background: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.card--inner:hover .image-wrap,
|
||||
.company-card:hover .company-card--inner {
|
||||
-webkit-filter: brightness(.7);
|
||||
filter: brightness(.7);
|
||||
-webkit-box-shadow: 0 0 0 2px rgb(var(--accent-color)), 0 5px 10px 0 rgb(0 0 0 / 30%);
|
||||
-moz-box-shadow: 0 0 0 2px rgb(var(--accent-color)), 0 5px 10px 0 rgba(0, 0, 0, .3);
|
||||
box-shadow: 0 0 0 2px rgb(var(--accent-color)), 0 5px 10px 0 rgb(0 0 0 / 30%);
|
||||
}
|
||||
|
||||
.card .quick-req:hover svg {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.push-msg--item {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
.btn,
|
||||
.btn__square,
|
||||
.rbc-btn-group button.rbc-active {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
border: 2px solid var(--button-color);
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn__square:hover,
|
||||
.rbc-btn-group button.rbc-active:active,
|
||||
.rbc-btn-group button.rbc-active:focus,
|
||||
.rbc-btn-group button.rbc-active:hover,
|
||||
.rbc-btn-group button:active,
|
||||
.rbc-btn-group button:focus,
|
||||
.rbc-btn-group button:hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
border: 2px solid var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* Keep Plex Button Color*/
|
||||
#root>div>div.login-wrap>div.login--inner>form>div:nth-child(7)>button,
|
||||
#root>div>div.view>div>div>div.settings--content>section:nth-child(2)>button:nth-child(3) {
|
||||
background: #d79b23;
|
||||
border: 2px solid #d79b23;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
#root>div>div.login-wrap>div.login--inner>form>div:nth-child(7)>button:hover,
|
||||
#root>div>div.view>div>div>div.settings--content>section:nth-child(2)>button:nth-child(3):hover {
|
||||
background: #ab7b1c;
|
||||
border-color: #ab7b1c;
|
||||
}
|
||||
|
||||
.btn.bad:hover {
|
||||
/*Delete/Cancel button*/
|
||||
border: 2px solid #f55;
|
||||
background: #f55;
|
||||
}
|
||||
|
||||
.btn.good.btn__square:hover {
|
||||
/*Watch Now button*/
|
||||
border: 2px solid #98ec1c;
|
||||
background: #98ec1c;
|
||||
}
|
||||
|
||||
.btn.blue.btn__square:hover {
|
||||
/* Requested button*/
|
||||
border: 2px solid #3f9de0;
|
||||
background: #3f9de0;
|
||||
}
|
||||
|
||||
.media-trailer--close {
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.media-trailer--close:hover {
|
||||
background: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.requests--status__pending,
|
||||
.requests--status__orange,
|
||||
.requests--status__bad,
|
||||
.requests--status__cinema,
|
||||
.requests--status__blue,
|
||||
.requests--status__manual {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.myrequests--item--details .detail-steps--item__active {
|
||||
color: rgb(var(--accent-color));
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.myrequests--item--details .detail-steps--item__active .icon {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.myrequests--item--details .detail-steps--item__active svg {
|
||||
fill: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.request-count {
|
||||
color: #fff;
|
||||
background: rgba(var(--accent-color), .8);
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
.generic-table tr:not(.child):not(.sub) td {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.generic-table tr:not(.child):not(.sub) th {
|
||||
text-align: left;
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .4);
|
||||
}
|
||||
|
||||
thead {
|
||||
color: var(--text-hover);
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.generic-table tr:not(.child):not(.sub) th:nth-child(odd),
|
||||
.generic-table tr:not(.child):not(.sub) th:nth-child(2n) {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* MODALS */
|
||||
.modal--inner,
|
||||
.issues--inner,
|
||||
.review--main {
|
||||
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;
|
||||
}
|
||||
|
||||
.modal--top,
|
||||
.issues--top,
|
||||
.review--top {
|
||||
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;
|
||||
}
|
||||
|
||||
/* FORMS & INPUTS */
|
||||
input[type=checkbox]:checked:after {
|
||||
background: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
input:not([type=checkbox]):not(.styled-input--input):not([type=file]):focus {
|
||||
border-bottom: 2px solid rgb(var(--accent-color));
|
||||
background: rgba(255, 255, 255, .2);
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
input:not([type=checkbox]):not(.styled-input--input):not([type=file]),
|
||||
.login-wrap input {
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0);
|
||||
color: var(--text);
|
||||
background: rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.search-form input:focus {
|
||||
background: hsla(0, 0%, 100%, .1) !important;
|
||||
color: var(--text-hover) !important;
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
/* CALENDAR */
|
||||
.rbc-show-more {
|
||||
background-color: hsl(0deg 0% 0% / 25%);
|
||||
}
|
||||
|
||||
.rbc-day-bg.rbc-today {
|
||||
background: rgb(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
a.rbc-show-more {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.calendar--event p {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
::placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
592
CSS/themes/pihole/pihole-base.css
Normal file
592
CSS/themes/pihole/pihole-base.css
Normal file
@ -0,0 +1,592 @@
|
||||
/* 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(https://theme-park.dev/CSS/defaults/placeholders.css);
|
||||
|
||||
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) !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:active,
|
||||
a:focus {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.treeview-menu>li.active>a,
|
||||
.treeview-menu>li>a:hover {
|
||||
color: var(--text-hover);
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3:not(.statistic),
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
h3.box-title {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.box,
|
||||
.box-footer,
|
||||
.info-box,
|
||||
.box-comment,
|
||||
.comment-text,
|
||||
.comment-text .username {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
kbd {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Donate dropdown */
|
||||
.skin-blue .main-header li.user-header {
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
box-shadow: none;
|
||||
border-color: rgba(0, 0, 0, .25);
|
||||
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;
|
||||
}
|
||||
|
||||
.navbar-nav>.user-menu>.dropdown-menu>.user-body {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .25);
|
||||
border-top: 1px solid rgba(255, 255, 255, .25);
|
||||
background-color: rgba(255, 255, 255, .2) !important;
|
||||
}
|
||||
|
||||
.navbar-nav>.user-menu>.dropdown-menu>.user-body a {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.navbar-nav>.user-menu>.dropdown-menu>.user-footer {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.skin-blue .main-header .navbar,
|
||||
.skin-blue .main-header .logo,
|
||||
.main-header .navbar,
|
||||
.main-header .logo {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.skin-blue .main-header .logo:hover,
|
||||
.skin-blue .main-header .navbar .sidebar-toggle:hover,
|
||||
.sidebar-menu>li:hover>a {
|
||||
background-color: rgba(255, 255, 255, .05);
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.sidebar-menu>li.active>a {
|
||||
background-color: rgba(255, 255, 255, .05);
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.main-footer {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
color: var(--text);
|
||||
border-top: 1px solid rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
/* Side bar */
|
||||
.skin-blue .sidebar a,
|
||||
.sidebar a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.skin-blue .sidebar a:hover,
|
||||
.sidebar a:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.skin-blue .wrapper,
|
||||
.skin-blue .main-sidebar,
|
||||
.skin-blue .left-side,
|
||||
.wrapper,
|
||||
.main-sidebar,
|
||||
.left-side {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.skin-blue .sidebar-menu>li.header,
|
||||
.sidebar-menu>li.header {
|
||||
color: rgb(var(--accent-color));
|
||||
background: rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.treeview-menu>li>a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.sidebar-menu>li>.treeview-menu {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
/* Menus */
|
||||
.skin-blue .sidebar-menu>li:hover>a,
|
||||
.skin-blue .sidebar-menu>li.active>a,
|
||||
.sidebar-menu>li:hover>a,
|
||||
.sidebar-menu>li.active>a {
|
||||
color: var(--text-hover);
|
||||
background: rgba(0, 0, 0, .1);
|
||||
border-left-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.skin-blue .sidebar-menu>li>.treeview-menu {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.skin-blue .treeview-menu>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Collapsed menu hover*/
|
||||
@media (min-width: 768px) {
|
||||
|
||||
.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>a>span:not(.pull-right),
|
||||
.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
||||
/* Pages */
|
||||
/*Background*/
|
||||
.content-wrapper,
|
||||
.right-side {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.page-header>small {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.main-footer .nav-tabs,
|
||||
.nav-tabs-custom .nav-tabs {
|
||||
background-color: rgb(0 0 0 / 0.25);
|
||||
border-bottom-color: rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.nav-tabs>li:hover {
|
||||
background-color: rgba(255, 255, 255, .05);
|
||||
color: var(--text-hover);
|
||||
border-top-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.nav-tabs>li:hover>a {
|
||||
background-color: rgba(255, 255, 255, .05);
|
||||
}
|
||||
|
||||
/* Dashboard */
|
||||
/*Total Queries box */
|
||||
.box-header {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.box {
|
||||
background: rgba(0, 0, 0, .24);
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.box-solid>.box-header,
|
||||
.box>.box-header {
|
||||
color: var(--text);
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
/* Total queries box*/
|
||||
.small-box.bg-green {
|
||||
background-color: rgba(0, 166, 90, .45) !important;
|
||||
}
|
||||
|
||||
/* Queries blocked box*/
|
||||
.small-box.bg-aqua {
|
||||
background-color: rgba(0, 192, 239, .45) !important;
|
||||
|
||||
}
|
||||
|
||||
/* Percent blocked box */
|
||||
.small-box.bg-yellow {
|
||||
background-color: rgba(243, 156, 18, .45) !important;
|
||||
}
|
||||
|
||||
/*Blocklist box*/
|
||||
.small-box.bg-red {
|
||||
background-color: rgba(221, 75, 57, .45) !important;
|
||||
}
|
||||
|
||||
thead {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table-bordered {
|
||||
background: rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
.table-bordered>thead>tr>th,
|
||||
.table-bordered>tbody>tr>th,
|
||||
.table-bordered>tfoot>tr>th,
|
||||
.table-bordered>thead>tr>td,
|
||||
.table-bordered>tbody>tr>td,
|
||||
.table-bordered>tfoot>tr>td {
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.table-striped>tbody>tr:nth-of-type(odd) {
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
/* Query Log */
|
||||
.text-black {
|
||||
color: #eee !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.pagination>.active>a,
|
||||
.pagination>.active>a:focus,
|
||||
.pagination>.active>a:hover,
|
||||
.pagination>.active>span,
|
||||
.pagination>.active>span:focus,
|
||||
.pagination>.active>span:hover,
|
||||
.paginate_button .active #all-queries_wrapper .pagination>li>a {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.pagination>.active>a,
|
||||
.pagination>.active>a:focus,
|
||||
.pagination>.active>a:hover,
|
||||
.pagination>.active>span,
|
||||
.pagination>.active>span:focus,
|
||||
.pagination>.active>span:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.pagination>li>a {
|
||||
color: var(--button-text) !important;
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.pagination>li>a:focus,
|
||||
.pagination>li>a:hover,
|
||||
.pagination>li>span:focus,
|
||||
.pagination>li>span:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
/* Login */
|
||||
.panel-default {
|
||||
border-color: transparent;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.panel-default>.panel-heading {
|
||||
color: var(--text-hover);
|
||||
background-color: inherit;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.panel,
|
||||
.panel-body,
|
||||
.panel-default>.panel-heading {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border-radius: 0px;
|
||||
border: 1px solid transparent;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Blacklist */
|
||||
.nav-tabs-custom {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.tab-content {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.nav-tabs>li.active {
|
||||
border-top-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.nav-tabs>li.active>a {
|
||||
border-top-color: transparent;
|
||||
border-left-color: rgba(255, 255, 255, 0.1);
|
||||
border-right-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.nav-tabs>li.active>a,
|
||||
.nav-tabs-custom>.nav-tabs>li.active:hover>a {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.nav-tabs-custom>.nav-tabs>li>a {
|
||||
color: var(--text) !important;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.input-group .input-group-addon {
|
||||
border-radius: 0;
|
||||
border-color: #d2d6de00;
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Network */
|
||||
.table-striped>tbody>tr:nth-of-type(odd) {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.table-striped>tbody>tr:nth-of-type(even) {
|
||||
background-color: rgba(0, 0, 0, .5) !important;
|
||||
}
|
||||
|
||||
#network-entries_wrapper.text-center {
|
||||
text-align: center;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
button,
|
||||
.btn-default {
|
||||
background-color: var(--button-color) !important;
|
||||
border: 1px solid var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-primary:active,
|
||||
.btn-primary.hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border: 1px solid var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.btn-default:hover,
|
||||
.btn-default:active,
|
||||
.btn-default.hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border: 1px solid var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.box.box-solid>.box-header .btn:hover,
|
||||
.box.box-solid>.box-header a:hover {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border: 1px solid var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.box.box-solid.box-info>.box-header,
|
||||
.box.box-solid.box-info {
|
||||
background-color: var(--button-color) !important;
|
||||
border: 1px solid var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background-color: #dd4b39 !important;
|
||||
border-color: #d73925 !important;
|
||||
}
|
||||
|
||||
.btn-danger:hover,
|
||||
.btn-danger:active,
|
||||
.btn-danger.hover {
|
||||
background-color: #d73925 !important;
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
background-color: #f39c12 !important;
|
||||
border-color: #e08e0b !important;
|
||||
}
|
||||
|
||||
.btn-warning:hover {
|
||||
color: #fff;
|
||||
background-color: #ec971f !important;
|
||||
border-color: #d58512 !important;
|
||||
}
|
||||
|
||||
.box.box-warning {
|
||||
border-top-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.icheck-primary>input:first-child:checked+input[type=hidden]+label::before,
|
||||
.icheck-primary>input:first-child:checked+label::before {
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.icheck-primary>input:first-child:not(:checked):not(:disabled):hover+input[type=hidden]+label::before,
|
||||
.icheck-primary>input:first-child:not(:checked):not(:disabled):hover+label::before {
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
/* Input */
|
||||
input,
|
||||
.form-control,
|
||||
pre,
|
||||
.box-footer,
|
||||
.datatables_processing {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dataTables_wrapper input[type="search"] {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
select.form-control,
|
||||
.form-group .input-group-addon,
|
||||
.input-group .input-group-addon,
|
||||
.form-group input,
|
||||
.input-group input,
|
||||
.form-group textarea,
|
||||
.input-group textarea,
|
||||
.daterangepicker select.hourselect,
|
||||
.daterangepicker select.minuteselect,
|
||||
.daterangepicker select.secondselect,
|
||||
.daterangepicker select.ampmselect,
|
||||
.form-control,
|
||||
div.dataTables_wrapper div.dataTables_length select {
|
||||
background-color: rgb(0 0 0 / 0.25);
|
||||
color: var(--text);
|
||||
border: 1px solid rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
select:focus,
|
||||
select.form-control:focus {
|
||||
background: #1b1b1b !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: rgb(255 255 255 / 0.25);
|
||||
box-shadow: none;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.select2-dropdown,
|
||||
.select2 .select2-selection {
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.select2-container--default .select2-results__option--highlighted[aria-selected] {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
673
CSS/themes/plex/plex-base.css
Normal file
673
CSS/themes/plex/plex-base.css
Normal file
@ -0,0 +1,673 @@
|
||||
/* 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 */
|
||||
|
||||
* {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
body,
|
||||
p,
|
||||
label,
|
||||
[class*="PrePlaySummary-summary-"],
|
||||
[class*="ClaimedServer-messageHeader-"],
|
||||
[class*="MetadataPosterCardTitle-isSecondary-"],
|
||||
[class*="MetadataPosterCardTitle-isSecondary-"] a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
[class*="SourceSidebarLink-title-"],
|
||||
[class*="SourceSidebarLink-sourceLink-"],
|
||||
[class*="Link-default-"],
|
||||
[class*="PrePlayTertiaryTitle-tertiaryTitle-"] {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
[class*="PivotTab-button-"] {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
[class*="PivotTabDropdown-isSelected-"] {
|
||||
border-color: rgb(var(--accent-color)) !important;
|
||||
border-bottom-width: 5px !important;
|
||||
border-left: 4px solid transparent !important;
|
||||
border-right: 4px solid transparent !important;
|
||||
border-top-width: 0 !important;
|
||||
margin-top: -2px !important;
|
||||
}
|
||||
|
||||
[class*="MetadataPosterCardActions-editButton-"],
|
||||
[class*="MetadataPosterCardActions-moreButton-"] {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
[class*="MetadataPosterCardActions-editButton-"]:hover,
|
||||
[class*="MetadataPosterCardActions-moreButton-"]:hover {
|
||||
color: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
[class*="PrePlayPrimaryTitle-primaryTitle-"] a,
|
||||
[class*="PrePlayLeftTitle-leftTitle-"],
|
||||
[class*="PrePlayPrimaryTitle-primaryTitle-"],
|
||||
[class*="CollapsibleText-readMore-"],
|
||||
[class*="HubTitle-hubTitle-"],
|
||||
[class*="FormLabel-label-"],
|
||||
[class*="ServerDashboardPageHeader-headerTitle-"],
|
||||
[class*="SidebarList-sidebarListHeader-"],
|
||||
[class*="MenuHeader-menuHeader-WuKJVD"],
|
||||
[class*="PrePlayDetailsGroupItem-label-"],
|
||||
[class*="PageHeader-pageHeader-"],
|
||||
[class*="PageHeaderTitle-title-"] {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
|
||||
a,
|
||||
[class*="Link-primary-"],
|
||||
[class*="Link-isSelected-"],
|
||||
[class*="PrePlayDetailsGroupItem-groupItem-"] a,
|
||||
[class*="MetadataPosterCardTitle-title-"] a,
|
||||
a[class*="MetadataPosterCardTitle-title-"],
|
||||
[class*="PrePlayTagListLink-tagsListLink-"][class*="Link-default-"] {
|
||||
color: var(--link-color)
|
||||
}
|
||||
|
||||
a:hover,
|
||||
[class*="Link-link-"]:hover:not([type="button"]):not([role="menuitem"]),
|
||||
.artwork-file-container:hover a,
|
||||
[class*="MetadataPosterCardTitle-title-"] a:hover,
|
||||
a[class*="MetadataPosterCardTitle-title-"]:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
[class*="MetadataPosterCardTitle-title-"][class*="MetadataPosterCardTitle-isSecondary-377V8A"] [class*="Link-link-1Kt-hA"]:hover,
|
||||
[class*="MetadataPosterCardTitle-title-"][class*="MetadataPosterCardTitle-isSecondary-377V8A"]:hover,
|
||||
[class*=".MetadataTableRow-title-"] a:hover,
|
||||
a[class*="MetadataTableRow-title-"]:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
[class*="TopUsersCell-playHistoryLink-"][class*="Link-link-"] {
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
/* BODY */
|
||||
[class*="FullPageBackground-backgroundContainer-"] [class*="CrossFadeImage-crossFade-"],
|
||||
#plex>[class*="background-container-"]>div>div>div:nth-child(2),
|
||||
#plex>div[class*="FullPageBackground-backgroundContainer-"]>div>div:nth-child(2),
|
||||
#plex>div[class*="FullPageBackground-backgroundContainer-"]>div>div:nth-child(4) {
|
||||
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;
|
||||
}
|
||||
|
||||
[class*="BottomBar-bottomBar-"] {
|
||||
background-color: rgb(0 0 0 / 70%);
|
||||
box-shadow: 0 0 4px 0 rgb(0 0 0 / 50%);
|
||||
}
|
||||
|
||||
/* SIDEBAR */
|
||||
|
||||
/* TEMP */
|
||||
[class*="SourceSidebarLink-isSelected-"] {
|
||||
box-shadow: inset 2px 0 0 0 rgb(var(--accent-color));
|
||||
background: rgb(var(--accent-color), 0.05);
|
||||
}
|
||||
|
||||
/* /TEMP */
|
||||
|
||||
[class*="SourceSidebar-openSidebar-"][class*="SourceSidebar-sidebar-"],
|
||||
[class*="SourceSidebar-sidebar-"] {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
[class*="SourceSidebar-expandedSidebar-"][class*="SourceSidebar-sidebar-"] {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
[class*="DisclosureArrow-isSelected-"] {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="SourceSidebarLink-isSelected-"]:before {
|
||||
background-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
[class*="SourceSidebarLink-isSelected-"] [class*="SourceSidebarLink-iconContainer-"],
|
||||
[class*="SourceSidebarLink-isSelected-"] [class*="SourceSidebarLink-title-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="SourceSidebarLink-sourceLink-"]:hover [class*="SourceSidebarLink-iconContainer-"],
|
||||
[class*="SourceSidebarLink-sourceLink-"]:hover [class*="SourceSidebarLink-title-"] {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
[class*="SourceSidebarServerHeader-title-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
[class*="NavBar-container-"] {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
[class*="NavBarActivityButton-isHighlighted-"] [class*="NavBarActivityButton-activityIcon-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* old plex web */
|
||||
.NavBarActivityButton-isHighlighted-2YqjDs .NavBarActivityButton-activityIcon-3gF_TD {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.NavBarActivityButton-isHighlighted-2YqjDs:hover .NavBarActivityButton-activityIcon-3gF_TD {
|
||||
background-color: var(--accent-color-hover);
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
/* /old plex web */
|
||||
|
||||
[class*="NavBarActivityButton-isHighlighted-"]:hover [class*="NavBarActivityButton-activityIcon-"] {
|
||||
color: var(--accent-color-hover);
|
||||
|
||||
}
|
||||
|
||||
[class*="NavBarActivityButton-isHighlighted-"] [class*="NavBarActivityButton-label-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="NavBarActivityButton-isHighlighted-"]:hover [class*="NavBarActivityButton-label-"] {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* ACCENTS */
|
||||
|
||||
[class*="Badge-primary-"] {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
[class*="DisclosureArrow-default-"] {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a:hover [class*="DisclosureArrow-disclosureArrow-"],
|
||||
button:hover [class*="DisclosureArrow-disclosureArrow-"] {
|
||||
border-color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.nav-pills>li.active>a,
|
||||
.nav-pills>li.active>a:focus,
|
||||
.nav-pills>li.active>a:hover {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.nav-pills>li.active>a,
|
||||
.nav-pills>li.active>a:focus,
|
||||
.nav-pills>li.active>a:hover {
|
||||
background-color: rgb(var(--accent-color), .03);
|
||||
|
||||
}
|
||||
|
||||
.btn-gray:focus,
|
||||
.btn-gray:hover {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
[class*="PageHeaderTabButton-isSelected-"],
|
||||
[class*="PageHeaderTabDropdown-isSelected-"],
|
||||
[class*="MultiSelectPageHeader-selectedTitle-"],
|
||||
[class*="PageHeaderMultiselectActions-container-"],
|
||||
[class*="PageHeaderMultiselectActions-count-"],
|
||||
[class*="PivotTab-selectedButton-"],
|
||||
[class*="PageHeaderTitle-detail-"] {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="PivotTab-selectedButton-"]:after {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="PivotTab-selectedButton-"]:hover:after {
|
||||
background-color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
[class*="MetadataPosterCardOverlay-unplayedBadge-"],
|
||||
[class*="MetadataPosterCard-legacyUnwatchedTag-"],
|
||||
[class*="MetadataPosterCard-legacyUnwatchedEpisodesBadge-"],
|
||||
[class*="MetadataPosterCardOverlay-versionBadge-"] {
|
||||
background-color: var(--plex-poster-unwatched);
|
||||
}
|
||||
|
||||
[class*="MetadataPosterCardFace-"]:hover,
|
||||
[class*="PosterCardLink-hoveredLink-"] {
|
||||
box-shadow: 0 0 0 1px rgb(var(--accent-color)), 0 0 4px rgb(0 0 0 / 30%);
|
||||
}
|
||||
|
||||
[class*="MultiSelectPageHeader-multiSelectPageHeader-"] {
|
||||
box-shadow: 0 2px 0 0 rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="MetadataPosterCardFace-isSelected-"],
|
||||
[class*="MetadataPosterCard-hoveredSelectedLink-"],
|
||||
[class*="MetadataPosterCard-selectedLink-"] {
|
||||
box-shadow: 0 0 0 2px rgb(var(--accent-color)), 0 0 4px rgb(0 0 0 / 30%);
|
||||
}
|
||||
|
||||
[class*="SelectButton-isSelected-"] [class*="SelectButton-selectCircle-"] {
|
||||
border-color: rgb(var(--accent-color));
|
||||
background-color: rgb(var(--accent-color));
|
||||
box-shadow: 0 0 4px rgb(0 0 0 / 60%);
|
||||
color: rgba(0, 0, 0, .75);
|
||||
transform: scale(1.4);
|
||||
}
|
||||
|
||||
[class*="SelectButton-selectButton-"].isActive [class*="SelectButton-selectCircle-"] {
|
||||
background: rgb(var(--accent-color-hover));
|
||||
}
|
||||
|
||||
[class*="PlayButton-playButton-"]:hover [class*="PlayButton-playCircle-"],
|
||||
[class*="PlayPauseOverlay-playCircle-"] {
|
||||
border-color: rgb(var(--accent-color));
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: #1f2326;
|
||||
}
|
||||
|
||||
[class*="PosterCardOverlayProgress-progressBar-"],
|
||||
[class*="MetadataPosterCardProgressBar-bar-"],
|
||||
[class*="SeekBar-seekBarFill-"],
|
||||
[class*="VolumeSlider-fill-"],
|
||||
[class*="SessionTile-playProgressPercent-"] {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="SeekBar-seekBarBuffer-"],
|
||||
[class*="SessionTile-transcodeProgressPercent-"] {
|
||||
background-color: rgba(var(--accent-color), .3);
|
||||
}
|
||||
|
||||
[class*="SessionTileDetails-playerContainer-"] {
|
||||
background-color: rgba(var(--accent-color), .2)
|
||||
}
|
||||
|
||||
[class*="SessionTileDetails-videoStreamInformation-"] {
|
||||
background-color: rgba(var(--accent-color), .15)
|
||||
}
|
||||
|
||||
[class*="SessionTileDetails-audioStreamInformation-"] {
|
||||
background-color: rgba(var(--accent-color), .1)
|
||||
}
|
||||
|
||||
[class*="SessionTileDetails-subtitlesStreamInformation-"] {
|
||||
background-color: rgba(var(--accent-color), .05);
|
||||
}
|
||||
|
||||
[class*="TopUsersList-container-"][class*="ServerDashboardSectionContent-container-"]>div>div>div>div:nth-child(3) {
|
||||
background-color: rgba(var(--accent-color), .2) !important;
|
||||
}
|
||||
|
||||
[class*="TopUsersList-container-"][class*="ServerDashboardSectionContent-container-"]>div>div>div>div:nth-child(4) {
|
||||
background-color: rgba(var(--accent-color), .15) !important;
|
||||
}
|
||||
|
||||
[class*="TopUsersList-container-"][class*="ServerDashboardSectionContent-container-"]>div>div>div>div:nth-child(5) {
|
||||
background-color: rgba(var(--accent-color), .1) !important;
|
||||
}
|
||||
|
||||
[class*="TopUsersList-container-"][class*="ServerDashboardSectionContent-container-"]>div>div>div>div:nth-child(6) {
|
||||
background-color: rgba(var(--accent-color), .05) !important;
|
||||
}
|
||||
|
||||
[class*="TopUsersCell-playHistoryLink-"] {
|
||||
background-color: rgb(var(--accent-color));
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
[class*="TopPlayedColumnHeader-emptyTitleBackground-"] {
|
||||
background-color: rgba(var(--accent-color), .3);
|
||||
}
|
||||
|
||||
[class*="SelectedMenuItem-isSelected-"],
|
||||
[class*="SelectedMenuItem-isSelected-"] [class*="SelectedMenuItem-selectedIcon-"],
|
||||
[class*="IconButton-isActive-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="IconButton-isActive-"]:hover {
|
||||
color: rgb(var(--accent-color-hover));
|
||||
}
|
||||
|
||||
[class*="Spinner-spinner-"] {
|
||||
border-color: rgb(var(--accent-color)) transparent transparent rgb(var(--accent-color));
|
||||
border-top-color: rgb(var(--accent-color)) !important;
|
||||
border-left-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
[class*="CircularProgressBar-circularProgressBar-"] {
|
||||
stroke-width: 2;
|
||||
stroke: rgb(var(--accent-color));
|
||||
stroke-dashoffset: 0;
|
||||
}
|
||||
|
||||
.loading {
|
||||
border-color: rgb(var(--accent-color)) transparent transparent rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.media-poster-container.selected .media-poster,
|
||||
.media-poster-container:hover .media-poster {
|
||||
-webkit-box-shadow: 0 0 4px rgb(0 0 0 / 30%), inset 0 0 0 3px rgb(var(--accent-color));
|
||||
box-shadow: 0 0 4px rgb(0 0 0 / 30%), inset 0 0 0 3px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.media-poster-container.selected .media-poster:before {
|
||||
border-color: rgb(var(--accent-color)) rgb(var(--accent-color)) transparent transparent;
|
||||
}
|
||||
|
||||
.media-poster-container.selected .media-poster:after {
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
[class*="NavBarActivityMenuStatusItem-statusButtonIndicator-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="SelectButton-selectedCircle-"] {
|
||||
border-color: rgb(var(--accent-color));
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
[class*="ModalContent-modalContent-"] {
|
||||
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;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 15px 20px;
|
||||
background: var(--modal-header-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-bottom: 1px solid rgba(255, 255, 255, .05);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
position: relative;
|
||||
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: 1px solid #999;
|
||||
border: 1px solid rgba(0, 0, 0, .2);
|
||||
border-radius: 3px;
|
||||
-webkit-box-shadow: 0 3px 9px rgb(0 0 0 / 50%);
|
||||
box-shadow: 0 3px 9px rgb(0 0 0 / 50%);
|
||||
background-clip: padding-box;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
padding: 15px 20px;
|
||||
margin-top: 0;
|
||||
background: var(--modal-footer-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-top: 1px solid rgba(255, 255, 255, .05);
|
||||
}
|
||||
|
||||
.modal-body-with-panes .modal-nav-pane {
|
||||
background-image: none;
|
||||
background: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.well,
|
||||
.files ul li {
|
||||
color: var(--text);
|
||||
background-color: rgb(255 255 255 / 10%);
|
||||
border: 1px solid transparent;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
|
||||
box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
|
||||
}
|
||||
|
||||
.edit-section-modal .wizard-blocks-group>.wizard-block.selectable:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, .05);
|
||||
}
|
||||
|
||||
.edit-section-modal .wizard-blocks-group>.wizard-block.selectable {
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
.striped-list-item>.striped-list-inner-item>.selected,
|
||||
.striped-list-item>a.selected {
|
||||
border-left: 3px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-header>h4>.modal-icon {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn-primary {
|
||||
border-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
-webkit-transition: background-color .1s;
|
||||
transition: background-color .1s;
|
||||
}
|
||||
|
||||
.btn-primary:focus,
|
||||
.btn-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
[class*="Button-primary"].isDisabled {
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary.disabled,
|
||||
.btn-primary.disabled.active,
|
||||
.btn-primary.disabled:active,
|
||||
.btn-primary.disabled:focus,
|
||||
.btn-primary.disabled:hover,
|
||||
.btn-primary[disabled],
|
||||
.btn-primary[disabled].active,
|
||||
.btn-primary[disabled]:active,
|
||||
.btn-primary[disabled]:focus,
|
||||
.btn-primary[disabled]:hover,
|
||||
fieldset[disabled] .btn-primary,
|
||||
fieldset[disabled] .btn-primary.active,
|
||||
fieldset[disabled] .btn-primary:active,
|
||||
fieldset[disabled] .btn-primary:focus,
|
||||
fieldset[disabled] .btn-primary:hover {
|
||||
background-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-gray.selected {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.btn-gray {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.edit-lock-addon.locked {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.edit-lock-addon {
|
||||
color: var(--button-color-hover);
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
border-color: transparent;
|
||||
-webkit-box-shadow: 0 0 2px rgb(0 0 0 / 30%), inset -2px 2px 2px rgb(0 0 0 / 10%);
|
||||
box-shadow: 0 0 2px rgb(0 0 0 / 30%), inset -2px 2px 2px rgb(0 0 0 / 10%);
|
||||
}
|
||||
|
||||
.edit-section-modal .wizard-blocks-group>.wizard-block.selected,
|
||||
.edit-section-modal .wizard-blocks-group>.wizard-block.selected:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.edit-section-modal .wizard-blocks-group>.wizard-block {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
[class*="Button-primary-"],
|
||||
.selectize-control.multi .selectize-input>div {
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
[class*="Button-primary-"]:hover,
|
||||
.selectize-control.multi .selectize-input>div.active {
|
||||
background-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
[class*="Menu-menu-"],
|
||||
.selectize-dropdown,
|
||||
.selectize-dropdown.form-control {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
[class*="ServerMenuItem-selectedServerMenuItem-"],
|
||||
[class*="ServerMenuItem-selectedIcon-"] {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
[class*="Tooltip-tooltip-"] {
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
[class*="Tooltip-tooltipBottomArrow-"]:after {
|
||||
border-top-color: var(--button-color);
|
||||
}
|
||||
|
||||
[class*="Tooltip-tooltipTopArrow-"]:after {
|
||||
border-bottom-color: var(--button-color);
|
||||
}
|
||||
|
||||
[class*="Tooltip-tooltipRightArrow-"]:after {
|
||||
border-left-color: var(--button-color);
|
||||
}
|
||||
|
||||
[class*="Tooltip-tooltipLeftArrow-"]:after {
|
||||
border-right-color: var(--button-color);
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
[class*="SettingsFormSection-sectionWrapper-"],
|
||||
[class*="ServerDashboardPageSection-section-"],
|
||||
hr {
|
||||
border-top: 2px solid rgb(255 255 255 / 30%);
|
||||
}
|
||||
|
||||
[class*="SettingsFormSection-sectionWrapper-"]:last-of-type,
|
||||
[class*="ClaimedServer-container-"] {
|
||||
border-bottom: 2px solid rgb(255 255 255 / 30%);
|
||||
}
|
||||
|
||||
/* ALERTS */
|
||||
.alerts-container .page-count {
|
||||
margin-right: 15px;
|
||||
font-size: 14px;
|
||||
color: var(--text);
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* SYNC */
|
||||
.filter-bar .dropdown.open>a {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* TABLE */
|
||||
|
||||
[class*="TableHeaderTitle-tableHeaderTitle-"] {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
[class*="DirectoryListTableHeader-tableHeaderCell-"],
|
||||
[class*="DirectoryListTableHeader-columnMenuButton-"] {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
a>[class*="DirectoryListTableHeader-tableHeaderCell-"]:hover,
|
||||
button>[class*="DirectoryListTableHeader-tableHeaderCell-"]:hover,
|
||||
[class*="DirectoryListTableHeader-columnMenuButton-"]:hover {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
0
CSS/themes/plpp/.deprecated
Normal file
0
CSS/themes/plpp/.deprecated
Normal file
284
CSS/themes/plpp/plpp-base.css
Normal file
284
CSS/themes/plpp/plpp-base.css
Normal file
@ -0,0 +1,284 @@
|
||||
/* 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 {
|
||||
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;
|
||||
background-color: transparent;
|
||||
color: hsla(0, 0%, 100%, .7) !important;
|
||||
font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif !important;
|
||||
font-size: 1.4em !important;
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
legend {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.navbar-inverse {
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.side-nav {
|
||||
background-color: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.navbar-inverse .navbar-nav>li>a {
|
||||
color: hsla(0, 0%, 100%, .7);
|
||||
}
|
||||
|
||||
.navbar-inverse .navbar-nav>li>a:hover,
|
||||
.navbar-inverse .navbar-nav>li>a:focus {
|
||||
background-color: hsla(0, 0%, 100%, .08);
|
||||
}
|
||||
|
||||
.nav>li.selected>a {
|
||||
background-color: transparent;
|
||||
color: #f9be03 !important;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
|
||||
.navbar-inverse .navbar-collapse,
|
||||
.navbar-inverse .navbar-form {
|
||||
border-color: transparent;
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
.breadcrumb>.active {
|
||||
text-transform: uppercase;
|
||||
text-transform: bold;
|
||||
}
|
||||
|
||||
.panel,
|
||||
.panel-default>.panel-heading,
|
||||
.breadcrumb>.active {
|
||||
background-color: transparent;
|
||||
border: transparent;
|
||||
color: inherit;
|
||||
font-size: 15px;
|
||||
font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif !important;
|
||||
line-height: 24px;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.plpp_table.even:hover,
|
||||
.plpp_table.odd:hover {
|
||||
background-color: hsla(0, 0%, 100%, .08) !important;
|
||||
}
|
||||
|
||||
.panel-heading {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.plpp_thumbs_Title:hover,
|
||||
.plpp_slider_Title:hover,
|
||||
.plpp_thumbs_Episode_Title:hover,
|
||||
.plpp_slider_Episode_Title:hover,
|
||||
.plpp_thumbs_Season_Title:hover,
|
||||
.plpp_slider_Season_Title:hover,
|
||||
.plpp_thumbs_Show_Title:hover,
|
||||
.plpp_slider_Show_Title:hover,
|
||||
.plpp_thumbs_Artist:hover,
|
||||
.plpp_slider_Artist:hover,
|
||||
.plpp_thumbs_Year:hover,
|
||||
.plpp_thumbs_Episode_No:hover,
|
||||
.plpp_slider_Year:hover,
|
||||
.plpp_slider_Episode_no:hover,
|
||||
.plpp_thumbs_Track_no:hover,
|
||||
.plpp_slider_Track_no:hover,
|
||||
.plpp_thumbs_Episode_Count:hover,
|
||||
.plpp_slider_Episode_Count:hover,
|
||||
.plpp_thumbs_Track_Count:hover,
|
||||
.plpp_slider_Track_Count:hover,
|
||||
.plpp_thumbs_Dimensions:hover,
|
||||
.plpp_slider_Dimensions:hover,
|
||||
.plpp_thumbs_Duration:hover,
|
||||
.plpp_slider_Duration:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.img-rounded {
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
.img-rounded:hover {
|
||||
border-radius: 0px;
|
||||
box-shadow: 0 0 0 2px #cc7b19;
|
||||
background: radial-gradient(farthest-corner at 50% 50%, rgba(50, 50, 50, .5) 50%, #323232 100%);
|
||||
opacity: .7;
|
||||
transition: linear .2s;
|
||||
}
|
||||
|
||||
.img-responsive,
|
||||
.thumbnail>img,
|
||||
.thumbnail a>img,
|
||||
.carousel-inner>.item>img,
|
||||
.carousel-inner>.item>a>img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div.modal-content>div.modal-body>div.plpp_details_container>div.plpp_details_Thumbnail,
|
||||
div.plpp_details_Poster>.img-rounded {
|
||||
box-shadow: none;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
div.plpp_slider {
|
||||
margin: 2px 15px 10px 2px;
|
||||
}
|
||||
|
||||
table {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
table,
|
||||
.table {
|
||||
color: hsla(0, 0%, 100%, .7);
|
||||
}
|
||||
|
||||
.table>thead>tr>th,
|
||||
.table>tbody>tr>th,
|
||||
.table>tfoot>tr>th,
|
||||
.table>thead>tr>td,
|
||||
.table>tbody>tr>td,
|
||||
.table>tfoot>tr>td {
|
||||
border-top: 1px solid rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
.table>thead>tr>th {
|
||||
vertical-align: bottom;
|
||||
border-bottom: 2px solid rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
color: #ffffff;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.pagination>.disabled>span,
|
||||
.pagination>.disabled>span:hover,
|
||||
.pagination>.disabled>span:focus,
|
||||
.pagination>.disabled>a,
|
||||
.pagination>.disabled>a:hover,
|
||||
.pagination>.disabled>a:focus {
|
||||
color: #BDBDBD;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: transparent;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
.modal-header,
|
||||
div.modal-body,
|
||||
.modal-footer {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .15);
|
||||
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;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-default {
|
||||
background-color: var(--button-color);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-default:hover,
|
||||
.btn-default:focus,
|
||||
.btn-default:active,
|
||||
.btn-default.active,
|
||||
.open .dropdown-toggle.btn-default {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.modal-header .close {
|
||||
color: #dadada;
|
||||
}
|
||||
|
||||
.modal-header .close:hover {
|
||||
color: #fff;
|
||||
}
|
||||
710
CSS/themes/portainer/portainer-base.css
Normal file
710
CSS/themes/portainer/portainer-base.css
Normal file
@ -0,0 +1,710 @@
|
||||
/* 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("https://theme-park.dev/CSS/defaults/placeholders.css");
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
label,
|
||||
legend,
|
||||
ul.sidebar .sidebar-title.endpoint-name {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-list .sidebar-sublist a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:focus,
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f44336;
|
||||
}
|
||||
|
||||
.fa.red-icon {
|
||||
color: #f44336;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.form-section-title {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-list a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* NEWS */
|
||||
.motd-body {
|
||||
background-color: rgba(255, 255, 255, 0.15) !important;
|
||||
}
|
||||
|
||||
/* LOGIN */
|
||||
.panel-default {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.panel {
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.panel-body {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* SIDEBAR */
|
||||
#sidebar-wrapper {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.sidebar-header {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-list a.active {
|
||||
color: rgb(var(--accent-color));
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-left: 3px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#page-wrapper:not(.open) ul.sidebar .sidebar-title.separator,
|
||||
.sidebar-footer,
|
||||
ul.sidebar .sidebar-list a:hover:not(ul.sidebar .sidebar-list a.active),
|
||||
ul.sidebar .sidebar-main a {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-list a:hover,
|
||||
#page-wrapper:not(.open) ul.sidebar .sidebar-list a:hover span {
|
||||
border-left: 3px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-title {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-list .sidebar-sublist a.active {
|
||||
border-left: 3px solid rgb(var(--accent-color));
|
||||
background: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
ul.sidebar .sidebar-title {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.row.header {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
/* WIDGETS */
|
||||
.widget {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.widget .widget-body table thead {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.widget .widget-header {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* DATATABLES */
|
||||
.datatable .toolBar {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.datatable .footer {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.blocklist-item--selected,
|
||||
.blocklist-item:hover {
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.datatable .actionBar,
|
||||
.datatable .toolBar {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.datatable .searchIcon {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.datatable .searchBar {
|
||||
border-top: 1px solid rgba(255, 255, 255, .1);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
padding: 8px;
|
||||
background: rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
.datatable .searchBar:focus-within {
|
||||
background:rgba(255, 255, 255, .25);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* TABLE */
|
||||
|
||||
.table-hover>tbody>tr:hover,
|
||||
.table>tbody>tr.active>td,
|
||||
.table>tbody>tr.active>th,
|
||||
.table>tbody>tr>td.active,
|
||||
.table>tbody>tr>th.active,
|
||||
.table>tfoot>tr.active>td,
|
||||
.table>tfoot>tr.active>th,
|
||||
.table>tfoot>tr>td.active,
|
||||
.table>tfoot>tr>th.active,
|
||||
.table>thead>tr.active>td,
|
||||
.table>thead>tr.active>th,
|
||||
.table>thead>tr>td.active,
|
||||
.table>thead>tr>th.active {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.table-hover>tbody>tr.active:hover>td,
|
||||
.table-hover>tbody>tr.active:hover>th,
|
||||
.table-hover>tbody>tr:hover>.active,
|
||||
.table-hover>tbody>tr>td.active:hover,
|
||||
.table-hover>tbody>tr>th.active:hover {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.table .table {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.label-default {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
.btn-danger:hover {
|
||||
color: #fff !important;
|
||||
background-color: #c9302c !important;
|
||||
border-color: #ac2925 !important;
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.btn-default {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-default.active,
|
||||
.btn-default:active,
|
||||
.open>.dropdown-toggle.btn-default,
|
||||
.btn-default.active.focus,
|
||||
.btn-default.active:focus,
|
||||
.btn-default.active:hover,
|
||||
.btn-default:active.focus,
|
||||
.btn-default:active:focus,
|
||||
.btn-default:active:hover,
|
||||
.open>.dropdown-toggle.btn-default.focus,
|
||||
.open>.dropdown-toggle.btn-default:focus,
|
||||
.open>.dropdown-toggle.btn-default:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-link {
|
||||
font-weight: 400;
|
||||
color: var(--button-color);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-default:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn.active.focus,
|
||||
.btn.active:focus,
|
||||
.btn.focus,
|
||||
.btn:active.focus,
|
||||
.btn:active:focus,
|
||||
.btn:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.btn-primary.disabled.focus,
|
||||
.btn-primary.disabled:focus,
|
||||
.btn-primary.disabled:hover,
|
||||
.btn-primary[disabled].focus,
|
||||
.btn-primary[disabled]:focus,
|
||||
.btn-primary[disabled]:hover,
|
||||
fieldset[disabled] .btn-primary.focus,
|
||||
fieldset[disabled] .btn-primary:focus,
|
||||
fieldset[disabled] .btn-primary:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.bootbox-form .checkbox i,
|
||||
.switch i {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
.btn.focus,
|
||||
.btn:focus,
|
||||
.btn:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-link:focus,
|
||||
.btn-link:hover {
|
||||
background: transparent;
|
||||
color: var(--button-color-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-primary.active.focus,
|
||||
.btn-primary.active:focus,
|
||||
.btn-primary.active:hover,
|
||||
.btn-primary:active.focus,
|
||||
.btn-primary:active:focus,
|
||||
.btn-primary:active:hover,
|
||||
.open>.dropdown-toggle.btn-primary.focus,
|
||||
.open>.dropdown-toggle.btn-primary:focus,
|
||||
.open>.dropdown-toggle.btn-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.ui-select-bootstrap>.ui-select-match>.btn:hover,
|
||||
.ui-select-bootstrap>.ui-select-match>.btn:focus {
|
||||
text-align: left !important;
|
||||
color: var(--button-text-hover);
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
border-color: #00000000;
|
||||
}
|
||||
|
||||
/* PAGINATION */
|
||||
.pagination>.disabled>a,
|
||||
.pagination>.disabled>a:focus,
|
||||
.pagination>.disabled>a:hover,
|
||||
.pagination>.disabled>span,
|
||||
.pagination>.disabled>span:focus,
|
||||
.pagination>.disabled>span:hover {
|
||||
color: var(--text-muted);
|
||||
cursor: not-allowed;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.pagination>.active>a,
|
||||
.pagination>.active>a:focus,
|
||||
.pagination>.active>a:hover,
|
||||
.pagination>.active>span,
|
||||
.pagination>.active>span:focus,
|
||||
.pagination>.active>span:hover {
|
||||
z-index: 2;
|
||||
color: var(--button-text);
|
||||
cursor: default;
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
text-decoration: none;
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.pagination>li>a:focus,
|
||||
.pagination>li>a:hover,
|
||||
.pagination>li>span:focus,
|
||||
.pagination>li>span:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* FORM CONTROL */
|
||||
|
||||
select:focus, select.form-control:focus {
|
||||
background: #1f1f1f !important;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background-color: rgba(255, 255, 255, 0.15) !important;
|
||||
border: 1px solid transparent;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.form-control:not([disabled]):not(select),
|
||||
output {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: rgb(var(--accent-color));
|
||||
outline: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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);
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a,
|
||||
.ui-select-bootstrap .ui-select-choices-row>span {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-menu>.active>a,
|
||||
.dropdown-menu>.active>a:focus,
|
||||
.dropdown-menu>.active>a:hover,
|
||||
.ui-select-bootstrap .ui-select-choices-row.active>span {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.ui-select-bootstrap .ui-select-choices-row>span:focus,
|
||||
.ui-select-bootstrap .ui-select-choices-row>span:hover,
|
||||
.ui-select-choices-row:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
/* APP TEMPLATES */
|
||||
|
||||
.blocklist-item {
|
||||
border: 1px solid transparent;
|
||||
-webkit-box-shadow: 0 3px 10px -2px hsla(0, 0%, 0%, 0.5);
|
||||
box-shadow: 0 3px 10px -2px hsla(0, 0%, 0%, 0.5);
|
||||
}
|
||||
|
||||
/* ADD NETWORK */
|
||||
|
||||
.boxselector_wrapper input[type=radio]:checked+label {
|
||||
background: rgba(255, 255, 255, .15);
|
||||
color: var(--text-hover);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.boxselector_wrapper label {
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
background: rgba(0, 0, 0, 0.15);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.boxselector_wrapper input[type=radio]:checked+label:after {
|
||||
color: rgb(var(--accent-color));
|
||||
border: 2px solid rgb(var(--accent-color));
|
||||
background: var(--label-text-color);
|
||||
}
|
||||
|
||||
.bootbox-form .checkbox :checked~i,
|
||||
.switch :checked+i {
|
||||
-webkit-box-shadow: inset 0 0 1px rgb(0 0 0 / 50%), inset 0 0 40px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 1px rgb(0 0 0 / 50%), inset 0 0 40px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.md-checkbox input[type=checkbox]:checked+label:before {
|
||||
background: rgb(var(--accent-color));
|
||||
border: none;
|
||||
}
|
||||
|
||||
.md-checkbox input[type=checkbox]:checked+label:after {
|
||||
border-color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.fa.blue-icon,
|
||||
.fab.blue-icon {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
|
||||
/* STACKS */
|
||||
.CodeMirror {
|
||||
background: rgba(255, 255, 255, 0.10);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.CodeMirror-gutters {
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.25);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
caret-color: white;
|
||||
}
|
||||
|
||||
.CodeMirror-linenumber {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.CodeMirror-line::selection,
|
||||
.CodeMirror-line>span::selection,
|
||||
.CodeMirror-line>span>span::selection {
|
||||
background: #d7d4f0;
|
||||
}
|
||||
|
||||
.cm-s-default .cm-atom {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* NAVIGATION */
|
||||
.nav-tabs>li.active>a,
|
||||
.nav-tabs>li.active>a:focus,
|
||||
.nav-tabs>li.active>a:hover {
|
||||
color: #fff;
|
||||
cursor: default;
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
border: 1px solid #ddd0;
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs>li>a:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.nav>li>a:focus,
|
||||
.nav>li>a:hover {
|
||||
text-decoration: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.nav-tabs>li>a {
|
||||
border: 1px solid rgba(0, 0, 0, 0);
|
||||
background: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
/* LOGS */
|
||||
.log_viewer {
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* JSON TREE */
|
||||
json-tree {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
json-tree .key {
|
||||
color: rgb(var(--accent-color));
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
pre {
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.close {
|
||||
float: right;
|
||||
font-size: 21px;
|
||||
font-weight: 700;
|
||||
line-height: 1;
|
||||
color: var(--text);
|
||||
text-shadow: 0 1px 0 var(--text);
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.close:focus,
|
||||
.close:hover {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.modal-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;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* STACKS / SERVICES TABLES */
|
||||
.widget .widget-body table tbody {
|
||||
background-color: transparent !important;
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.widget .widget-body table .ng-scope tr {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.widget .widget-body table thead {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.widget .widget-body table tbody .ng-isolate-scope div {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
background: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
.widget .widget-body table tbody tr:hover {
|
||||
background-color: #0000 !important;
|
||||
background: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
.widget .widget-body table thead tr:hover {
|
||||
background-color: rgba(0, 0, 0, .35) !important;
|
||||
background: rgba(0, 0, 0, .35) !important;
|
||||
}
|
||||
1101
CSS/themes/prowlarr/prowlarr-base.css
Normal file
1101
CSS/themes/prowlarr/prowlarr-base.css
Normal file
File diff suppressed because it is too large
Load Diff
1806
CSS/themes/qbittorrent/qbittorrent-base.css
Normal file
1806
CSS/themes/qbittorrent/qbittorrent-base.css
Normal file
File diff suppressed because it is too large
Load Diff
1101
CSS/themes/radarr/radarr-base.css
Normal file
1101
CSS/themes/radarr/radarr-base.css
Normal file
File diff suppressed because it is too large
Load Diff
1212
CSS/themes/readarr/readarr-base.css
Normal file
1212
CSS/themes/readarr/readarr-base.css
Normal file
File diff suppressed because it is too large
Load Diff
398
CSS/themes/requestrr/requestrr-base.css
Normal file
398
CSS/themes/requestrr/requestrr-base.css
Normal file
@ -0,0 +1,398 @@
|
||||
/* 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(https://theme-park.dev/CSS/defaults/placeholders.css);
|
||||
|
||||
body {
|
||||
color: var(--text);
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.bg-default {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.heading-small.text-muted,
|
||||
.form-control-label,
|
||||
.text-white {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.navbar-light .navbar-nav .active>.nav-link,
|
||||
.navbar-light .navbar-nav .nav-link.active,
|
||||
.navbar-light .navbar-nav .nav-link.show,
|
||||
.navbar-light .navbar-nav .show>.nav-link {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.navbar-light .navbar-nav .nav-link {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.nav-link.active:hover,
|
||||
.nav-link.active:focus {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.navbar-light .navbar-nav .nav-link:focus:not(.nav-link.active),
|
||||
.navbar-light .navbar-nav .nav-link:hover:not(.nav-link.active) {
|
||||
color: var(--text-hover);
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.navbar-vertical.navbar-expand-md.fixed-left {
|
||||
left: 0;
|
||||
border-width: 0 1px 0 0;
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
|
||||
.navbar-collapse.collapsing,
|
||||
.navbar-collapse.show {
|
||||
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;
|
||||
box-shadow: 0 50px 100px rgba(0, 0, 0, 0.1), 0 15px 35px rgba(0, 0, 0, 0.15), 0 5px 15px rgba(0, 0, 0, .1);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.navbar-nav .nav-link {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
}
|
||||
|
||||
#sidenav-main>div>div>ul.mb-md-3.navbar-nav>li:nth-child(3)>a>i {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.card-profile-image img,
|
||||
.shadow,
|
||||
.navbar-vertical {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.fade {
|
||||
-webkit-transition: opacity .15s linear;
|
||||
transition: opacity .15s linear;
|
||||
background: rgba(0, 0, 0, 0.15) !important;
|
||||
}
|
||||
|
||||
.bg-secondary {
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
.bg-gradient-default {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.card-profile-image img,
|
||||
.shadow {
|
||||
box-shadow: 0 0 2rem 0 rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.bg-white,
|
||||
.footer {
|
||||
background-color: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
/* Logo */
|
||||
|
||||
#sidenav-main>div>a::before {
|
||||
content: "";
|
||||
background: url('../static/media/requestrr.1e4722c9.svg') no-repeat;
|
||||
background-size: 200px;
|
||||
width: 200px;
|
||||
height: 36px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.navbar-brand-img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.navbar-collapse .collapse-brand img {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
#sidenav-main>div>div>div>div>div.collapse-brand.col-6>a::before {
|
||||
content: "";
|
||||
background: url('../static/media/requestrr.1e4722c9.svg') no-repeat;
|
||||
background-size: 200px;
|
||||
width: 200px;
|
||||
height: 36px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control:disabled,
|
||||
.form-control[readonly] {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
opacity: 1;
|
||||
border: 1px solid transparent;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.form-control-alternative,
|
||||
.has-danger .form-control {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.form-control-alternative:focus {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.has-success .form-control {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color: var(--text);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* Drop down*/
|
||||
.react-dropdown-select-item.css-148o527-ItemComponent {
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
.react-dropdown-select.dropdown div[role=list] span {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.react-dropdown-select.dropdown div[role=list] span:focus,
|
||||
.react-dropdown-select.dropdown div[role=list] span:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
[class*="-ItemComponent"] {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
[class*="-DropDown"]:not(.react-dropdown-select-dropdown-position-bottom) {
|
||||
background: rgb(255 255 255 / 0%);
|
||||
box-shadow: 0 0 10px 1px #000 !important;
|
||||
}
|
||||
|
||||
.react-dropdown-select.dropdown {
|
||||
color: var(--text);
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.react-dropdown-select.dropdown .react-dropdown-select-item-selected {
|
||||
background: rgb(var(--accent-color)) !important;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
|
||||
/* Buttons */
|
||||
.custom-checkbox .custom-control-input:checked~.custom-control-label:before {
|
||||
background-color: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.custom-checkbox .custom-control-input:checked~.custom-control-label:after {
|
||||
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='000000' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
|
||||
.btn-primary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-primary:not(:disabled):not(.disabled).active,
|
||||
.btn-primary:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-primary.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-default,
|
||||
.btn-default:hover {
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-default:not(:disabled):not(.disabled).active,
|
||||
.btn-default:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-default.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: rgba(0, 0, 0, 0.26);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.btn-default.disabled,
|
||||
.btn-default:disabled {
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, 0.15);
|
||||
border-color: transparent;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.btn-info.disabled,
|
||||
.btn-info:disabled {
|
||||
color: var(--text-muted);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-info,
|
||||
.btn-info:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* Login page*/
|
||||
|
||||
.header.bg-gradient-info {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.separator-skew {
|
||||
height: 70px;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#root>div>div.mt--8.pb-5.container>div>div>div {
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
#root>div>div.mt--8.pb-5.container>div>div>div>div>form>div:nth-child(1)>div>input,
|
||||
#root>div>div.mt--8.pb-5.container>div>div>div>div>form>div:nth-child(2)>div>input,
|
||||
#root>div>div.mt--8.pb-5.container>div>div>div>div>form>div:nth-child(3)>div>input {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
border: 10px solid transparent;
|
||||
}
|
||||
|
||||
.input-group-text {
|
||||
color: var(--text);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
|
||||
.input-group-prepend {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
#root>div>div.header.bg-gradient-info.py-7.py-lg-8>div.separator.separator-bottom.separator-skew.zindex-100>svg>polygon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
804
CSS/themes/resilio-sync/resilio-sync-base.css
Normal file
804
CSS/themes/resilio-sync/resilio-sync-base.css
Normal file
@ -0,0 +1,804 @@
|
||||
/* 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(https://use.fontawesome.com/releases/v5.15.1/css/all.css);
|
||||
@import url(https://theme-park.dev/CSS/defaults/placeholders.css);
|
||||
|
||||
body,
|
||||
.tableScrollContainer,
|
||||
.settings-tabs-wrapper .settings-tabs-container {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6 {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-bg-color)
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
body,
|
||||
#onboarding-dark #page-main,
|
||||
p,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
#choose-product-dialog .choose-title h1,
|
||||
label.control-label,
|
||||
.emptyMessage,
|
||||
.bt-navbar #choose-share-type-menu .container-fluid .menu-item h2,
|
||||
.bt-navbar .choose-dropdown-menu .container-fluid .menu-item h2,
|
||||
UL.jqueryFileTree A,
|
||||
.settings-tabs-wrapper .settings-tabs-container,
|
||||
.bt-checkbox label,
|
||||
.bt-radio label,
|
||||
.settings-tabs-wrapper .settings-tabs-buttons .left-nav-button,
|
||||
#licenses-tab #unlicensed-container h1,
|
||||
#licenses-tab #unlicensed-container .unlicensed-text,
|
||||
#support-tab #page-menu .support-content>a h5,
|
||||
#support-tab #page-menu .support-content>button h5,
|
||||
#support-tab #page-menu .support-content>a p,
|
||||
.modal-header .transfer-path .labelContainer .secondaryLine,
|
||||
.transfer-table .transfer-row .nameLabel,
|
||||
.dropdown-menu li a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* ACCENTS */
|
||||
#choose-product-dialog .product-container .product:hover {
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: #4CAF50;
|
||||
}
|
||||
|
||||
#historyContainer .table-filter-panel .filter-item.active,
|
||||
.resizableTableContainer .table-filter-panel .filter-item.active,
|
||||
.tableContainerWithFilterPanel .table-filter-panel .filter-item.active {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.bt-navbar {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.bt-navbar .btn.dropdown-toggle {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
.bt-navbar .btn.dropdown-toggle:hover {
|
||||
background-color: rgb(255 255 255 / 16%);
|
||||
}
|
||||
|
||||
.bt-navbar .btn.btn-tab.active,
|
||||
.bt-navbar .btn.btn-tab:active {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border-bottom-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.bt-navbar .btn:hover {
|
||||
background-color: rgb(255 255 255 / 8%) !important;
|
||||
}
|
||||
|
||||
.bt-navbar .btn#try-pro-button {
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.bt-navbar .btn#try-pro-button:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
.bt-navbar .btn.btn-tab {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* SIDE MENU */
|
||||
/* DROPDOWN MENU */
|
||||
.bt-navbar #choose-share-type-menu,
|
||||
.bt-navbar .choose-dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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: 1px solid rgba(255, 255, 255, .1);
|
||||
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .2);
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.dropdown-menu li a:focus,
|
||||
.dropdown-menu li a:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#columns-context .bt-checkbox:hover {
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.context-menu .bt-checkbox label,
|
||||
.context-menu .bt-radio label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.sync-level .add-folder-mode .option-text {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.sync-level .add-folder-mode .option-description {
|
||||
color: var(--text);
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.sync-level .add-folder-mode li.selected a {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.sync-level .add-folder-mode li:not(.selected) a:focus,
|
||||
.sync-level .add-folder-mode li:not(.selected) a:hover {
|
||||
background-color: rgb(255 255 255 / .08);
|
||||
}
|
||||
|
||||
.sync-level .add-folder-mode .btn-group {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
button.selectpicker.btn-default {
|
||||
border-color: #ccc0 !important;
|
||||
color: var(--text) !important;
|
||||
background-color: rgb(0 0 0 / 25%) !important;
|
||||
}
|
||||
|
||||
.btn-group.open .dropdown-toggle {
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
border: none;
|
||||
background: rgb(0 0 0 / 50%) !important;
|
||||
}
|
||||
|
||||
.animating {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* ICONS */
|
||||
.mycon.mycon-folder-rw,
|
||||
.mycon.mycon-folder-owner,
|
||||
.mycon.mycon-folder-encrypted,
|
||||
.mycon.mycon-file,
|
||||
.mycon.mycon-plus {
|
||||
background-image: none !important;
|
||||
}
|
||||
|
||||
.mycon.mycon-folder-rw:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 24px;
|
||||
content: "\f07b";
|
||||
font-weight: bold;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-left: 5px;
|
||||
color: var(--text);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.mycon.mycon-folder-owner:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 24px;
|
||||
content: "\f65e";
|
||||
font-weight: bold;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-left: 5px;
|
||||
color: var(--text);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.mycon.mycon-folder-encrypted:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 24px;
|
||||
content: "\f023";
|
||||
font-weight: bold;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-left: 5px;
|
||||
color: var(--text);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.mycon.mycon-file:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 24px;
|
||||
content: "\f064";
|
||||
font-weight: bold;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-left: 5px;
|
||||
color: var(--text);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.mycon.mycon-plus:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 24px;
|
||||
content: "\f0c1";
|
||||
font-weight: bold;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-left: 5px;
|
||||
color: var(--text);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.bt-navbar #choose-share-type-menu .container-fluid .menu-item:focus,
|
||||
.bt-navbar #choose-share-type-menu .container-fluid .menu-item:hover,
|
||||
.bt-navbar .choose-dropdown-menu .container-fluid .menu-item:focus,
|
||||
.bt-navbar .choose-dropdown-menu .container-fluid .menu-item:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
|
||||
}
|
||||
|
||||
.bt-navbar #choose-share-type-menu .container-fluid .menu-item .menu-item-description:hover,
|
||||
.bt-navbar .choose-dropdown-menu .container-fluid .menu-item .menu-item-description:hover {
|
||||
margin-left: 6px;
|
||||
padding-top: 4px;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.bt-navbar #choose-share-type-menu .arrow,
|
||||
.bt-navbar .choose-dropdown-menu .arrow {
|
||||
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;
|
||||
}
|
||||
|
||||
.popout-parent {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.context-menu li a:focus,
|
||||
.context-menu li a:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.context-menu li.has-icon a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.context-notification .context-notification-inner {
|
||||
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;
|
||||
}
|
||||
|
||||
#general-settings #languagedrop {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.popout-anchor.popout-open {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* MODALS */
|
||||
.modal-header {
|
||||
background: var(--modal-header-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.modal-content,
|
||||
.modal-body,
|
||||
.modal-body .fileTreeContainer,
|
||||
.modal-page {
|
||||
color: var(--text);
|
||||
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;
|
||||
}
|
||||
|
||||
.modal-body .horizontal-separator .horizontal-separator-text {
|
||||
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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.modal-filter .btn:hover,
|
||||
.modal-input .btn:hover {
|
||||
background-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
#choose-product-dialog .product-container .product {
|
||||
background-color: rgb(255 255 255 / 0.08);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.modal-header .close:hover {
|
||||
background: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
ul.jqueryFileTree a.active,
|
||||
ul.jqueryFileTree a:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.modal-filter:before,
|
||||
.modal-input:before {
|
||||
background: -owg-linear-gradient(left, transparent, transparent);
|
||||
background: transparent !important;
|
||||
background: -moz-linear-gradient(left, transparent, transparent);
|
||||
background: -o-linear-gradient(left, transparent, transparent);
|
||||
background: linear-gradient(left, transparent, transparent);
|
||||
}
|
||||
|
||||
.nav-tabs.nav-sub-tabs,
|
||||
.nav-tabs.nav-sub-tabs>li {
|
||||
background-color: transparent;
|
||||
border-bottom-color: rgb(255 255 255 / .1);
|
||||
}
|
||||
|
||||
.nav-tabs.nav-sub-tabs>li.active a,
|
||||
.nav-tabs.nav-sub-tabs>li.active a:focus,
|
||||
.nav-tabs.nav-sub-tabs>li.active a:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
border: 1px solid var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.nav-tabs.nav-sub-tabs>li>a {
|
||||
background-color: var(--button-color);
|
||||
border: 1px solid var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.nav-tabs.nav-sub-tabs>li>a:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
border: 1px solid var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
#file-sharing-content .shareOptionsContainer .shareOption:hover,
|
||||
#sharing-content .shareOptionsContainer .shareOption:hover,
|
||||
.sharing-dialog-content .shareOptionsContainer .shareOption:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#sharing-content .nav-tabs.nav-sub-tabs>li {
|
||||
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;
|
||||
}
|
||||
|
||||
#sharing-content .nav-tabs.nav-sub-tabs>li>a {
|
||||
border: 1px solid var(--button-color);
|
||||
color: var(--button-text);
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
#sharing-content .nav-tabs.nav-sub-tabs>li.active a,
|
||||
.nav-tabs.nav-sub-tabs>li.active a:focus,
|
||||
.nav-tabs.nav-sub-tabs>li.active a:hover {
|
||||
background: var(--button-color-hover) !important;
|
||||
border: 1px solid var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.activity-filter.open,
|
||||
.main-filter.open,
|
||||
.modal-filter.open,
|
||||
.modal-input.open {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
.modal-header .transfer-path .labelContainer {
|
||||
border-left: 1px solid rgb(255 255 255 / .1);
|
||||
}
|
||||
|
||||
.modal-filter .btn,
|
||||
.modal-input .btn {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.modal-filter .btn:hover,
|
||||
.modal-input .btn:focus,
|
||||
.modal-filter animating {
|
||||
background: rgb(255 255 255 / .08) !important;
|
||||
}
|
||||
|
||||
/* PAGES */
|
||||
#archive-onboarding.fixed .tutorial-background,
|
||||
#onboarding-dark.fixed .tutorial-background,
|
||||
#syncall-tutorial.fixed .tutorial-background {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
#historyContainer .table-filter-panel,
|
||||
.resizableTableContainer .table-filter-panel,
|
||||
.tableContainerWithFilterPanel .table-filter-panel {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border-bottom: 1px solid rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
.section-header {
|
||||
border-bottom: 1px solid rgb(255 255 255 / .1);
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
#sync-core-state {
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
border-top: 1px solid rgb(255 255 255 / 10%);
|
||||
}
|
||||
|
||||
#statusPanel {
|
||||
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;
|
||||
}
|
||||
|
||||
.status-panel-shown #statusPanel {
|
||||
border-top: 1px solid rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
#statusPanel .nav-pills a.tab-button .header,
|
||||
#statusPanel .nav-pills a.tab-button .value,
|
||||
#statusPanel .nav-pills a.tab-button span[class$=-speed-label] {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
#statusPanel .nav-pills li {
|
||||
border-bottom: 1px solid rgb(255 255 255 / .1);
|
||||
}
|
||||
|
||||
#statusPanel .nav-pills a.tab-button:focus,
|
||||
#statusPanel .nav-pills a.tab-button:hover,
|
||||
#statusPanel .nav-pills .active>a {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
#statusPanel .tab-content {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#statusPanel .chart-wrapper {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
border-right: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.resizableTableContainer .tableHeaderContainer {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
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;
|
||||
}
|
||||
|
||||
#statusPanel .chart-c3 .c3-tooltip {
|
||||
background-color: #000;
|
||||
opacity: .7;
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.c3-grid line {
|
||||
stroke: var(--text);
|
||||
}
|
||||
|
||||
.c3 text {
|
||||
fill: var(--text);
|
||||
}
|
||||
|
||||
|
||||
/* SETTINGS */
|
||||
.settings-tabs-wrapper .settings-tabs-buttons .left-nav-button.active {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.settings-tabs-wrapper .settings-tabs-buttons .left-nav-button:hover:not(.active) {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
.settings-tabs-wrapper .settings-tabs-buttons .left-nav-button:hover:not(.active) .txt-button {
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
#support-tab #page-menu .support-content>a,
|
||||
#support-tab #page-menu .support-content>button {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#support-tab #page-menu .support-content>a:hover h5,
|
||||
#support-tab #page-menu .support-content>a:hover p,
|
||||
#support-tab #page-menu .support-content>button:hover h5,
|
||||
#support-tab #page-menu .support-content>button:hover p {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.settings-tabs-wrapper .settings-tabs-buttons {
|
||||
border-right: 1px solid rgb(255 255 255 / 10%);
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
/* IDENTITY */
|
||||
#my-devices .my-devices .single-my-device:hover:not(.disabled) {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
#my-devices .my-devices .link-device-block #device-to-qr .device-link {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#my-devices .my-devices .link-device-block #device-to-qr:hover:not(:disabled) .device-link-text {
|
||||
text-decoration: underline;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#my-devices .my-devices .info-button:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
.btn,
|
||||
#support-tab #page-feedback-form .back-button {
|
||||
border-color: var(--button-color);
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
margin-right: 5px;
|
||||
box-shadow: none;
|
||||
border: transparent;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn:focus,
|
||||
.btn:active,
|
||||
.btn-primary:not(:disabled):not(.disabled):active,
|
||||
.btn-primary:not(:disabled):not(.disabled).active,
|
||||
#support-tab #page-feedback-form .back-button:hover {
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.transfer-table .transfer-row .optionsColumn .options-button {
|
||||
background-color: transparent;
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.transfer-table .transfer-row .optionsColumn .options-button.active,
|
||||
.transfer-table .transfer-row .optionsColumn .options-button:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control {
|
||||
color: var(--text) !important;
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
border: 1px solid transparent !important;
|
||||
box-shadow: none !important;
|
||||
transition: background-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
background-color: rgba(0, 0, 0, .5) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* TABLE */
|
||||
#advanced-settings-dialog .verticalScrollContainer tr:active,
|
||||
#advanced-settings-dialog .verticalScrollContainer tr:focus,
|
||||
#advanced-settings-dialog .verticalScrollContainer tr:hover {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table-hover>tbody>tr.active,
|
||||
.table-hover>tbody>tr:hover:not(.no-hover) {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.transfer-table .transfer-row.active a,
|
||||
.transfer-table .transfer-row:hover a {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table>thead>tr>th {
|
||||
vertical-align: bottom;
|
||||
border-bottom: 1px solid rgb(255 255 255 / 10%);
|
||||
|
||||
}
|
||||
|
||||
.table.table-bordered-header thead tr th {
|
||||
background-color: #fff;
|
||||
border-right: 1px solid rgb(255 255 255 / 0.1) !important;
|
||||
}
|
||||
|
||||
.tableScrollContainer .table thead tr th {
|
||||
background: var(--main-bg-color) !important;
|
||||
background-repeat: repeat, no-repeat !important;
|
||||
background-attachment: fixed, fixed !important;
|
||||
background-position: center center, center center !important;
|
||||
background-size: auto, cover !important;
|
||||
-webkit-background-size: auto, cover !important;
|
||||
-moz-background-size: auto, cover !important;
|
||||
-o-background-size: auto, cover !important;
|
||||
}
|
||||
1785
CSS/themes/rutorrent/rutorrent-base.css
Normal file
1785
CSS/themes/rutorrent/rutorrent-base.css
Normal file
File diff suppressed because it is too large
Load Diff
1162
CSS/themes/sabnzbd/sabnzbd-base.css
Normal file
1162
CSS/themes/sabnzbd/sabnzbd-base.css
Normal file
File diff suppressed because it is too large
Load Diff
1084
CSS/themes/sonarr/sonarr-base.css
Normal file
1084
CSS/themes/sonarr/sonarr-base.css
Normal file
File diff suppressed because it is too large
Load Diff
196
CSS/themes/synclounge/synclounge-base.css
Normal file
196
CSS/themes/synclounge/synclounge-base.css
Normal file
@ -0,0 +1,196 @@
|
||||
/* 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(https://theme-park.dev/CSS/defaults/placeholders.css);
|
||||
|
||||
:root {
|
||||
--v-primary-base: rgb(var(--accent-color));
|
||||
--v-anchor-base: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
main {
|
||||
background: var(--main-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;
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
h4 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.v-toolbar {
|
||||
background: transparent !important;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.v-toolbar__content,
|
||||
.v-toolbar__extension {
|
||||
background-color: rgba(0, 0, 0, 0.6) !important;
|
||||
}
|
||||
|
||||
p a {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.theme--dark.v-icon {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.application .theme--dark.v-card,
|
||||
.theme--dark .v-card .primary--text {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.application .theme--dark.v-card,
|
||||
.theme--dark .v-card .accent--text {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.application .theme--dark.v-card,
|
||||
.theme--dark .v-card .primary {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.flex.xs12 a {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.v-list__tile {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.v-stepper__step__step .primary {
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.primary {
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.primary:hover,
|
||||
.primary:focus {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.v-input__control .v-input__slot .primary--text input,
|
||||
.primary--text textarea {
|
||||
caret-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.v-input input:active,
|
||||
.v-input input:focus,
|
||||
.v-input textarea:active,
|
||||
.v-input textarea:focus .primary--text input,
|
||||
.primary--text textarea {
|
||||
caret-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.theme--dark.v-app-bar.v-toolbar.v-sheet {
|
||||
background: var(--modal-bg-color) !important;
|
||||
}
|
||||
|
||||
.application .theme--dark.v-btn:not(.v-btn--icon):not(.v-btn--flat),
|
||||
.theme--dark .v-btn:not(.v-btn--icon):not(.v-btn--flat):not(.v-btn:not(.v-btn--round).v-size--small) {
|
||||
background-color: var(--button-color) !important;
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.application .theme--dark.v-btn:hover:not(.v-btn--icon):not(.v-btn--flat),
|
||||
.theme--dark .v-btn:hover:not(.v-btn--icon):not(.v-btn--flat):not(.v-btn:not(.v-btn--round).v-size--small) {
|
||||
background-color: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
.v-btn__content {
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.v-btn--active:before,
|
||||
.v-btn:focus:before,
|
||||
.v-btn:hover:before {
|
||||
background-color: var(--text-hover);
|
||||
}
|
||||
|
||||
.application .theme--dark.v-card,
|
||||
.theme--dark .v-card {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.flex.md3 .application .theme--dark.v-card,
|
||||
.theme--dark .v-card {
|
||||
background: rgba(255, 255, 255, 0.10) !important;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.theme--dark.v-expansion-panels .v-expansion-panel {
|
||||
background-color: transparent;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.theme--dark.v-text-field--solo>.v-input__control>.v-input__slot {
|
||||
background: rgb(0 0 0 / 0.50);
|
||||
}
|
||||
|
||||
.v-navigation-drawer {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
/*popup modal */
|
||||
|
||||
.v-dialog,
|
||||
.theme--dark.v-list {
|
||||
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;
|
||||
}
|
||||
|
||||
.menuable__content__active {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
860
CSS/themes/tautulli/tautulli-base.css
Normal file
860
CSS/themes/tautulli/tautulli-base.css
Normal file
@ -0,0 +1,860 @@
|
||||
/* 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 {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Text */
|
||||
|
||||
p,
|
||||
.news-title,
|
||||
.news-date {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.help-block,
|
||||
h1 small,
|
||||
h2 small,
|
||||
h3 small,
|
||||
h4 small,
|
||||
h5 small,
|
||||
h6 small,
|
||||
.h1 small,
|
||||
.h2 small,
|
||||
.h3 small,
|
||||
.h4 small,
|
||||
.h5 small,
|
||||
.h6 small,
|
||||
h1 .small,
|
||||
h2 .small,
|
||||
h3 .small,
|
||||
h4 .small,
|
||||
h5 .small,
|
||||
h6 .small,
|
||||
.h1 .small,
|
||||
.h2 .small,
|
||||
.h3 .small,
|
||||
.h4 .small,
|
||||
.h5 .small,
|
||||
.h6 .small,
|
||||
.header-bar span,
|
||||
.dashboard-activity-info-time,
|
||||
strong,
|
||||
.summary-content-details-tag strong,
|
||||
.padded-header h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
.config-scheduler-table th,
|
||||
#tautulli-news .open .news-title,
|
||||
#tautulli-news .open .news-date,
|
||||
#tautulli-news .accordion li.open .link i.fa {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.list-unstyled {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.text-muted,
|
||||
.small-muted {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
|
||||
a:not(.sub-value a),
|
||||
a.no-highlight,
|
||||
.news-body a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a.no-highlight:hover,
|
||||
.dashboard-activity-metadata-title a:hover,
|
||||
.dashboard-activity-metadata-user a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
#plexpy-notifiers-table .friendly_name,
|
||||
#notifier-config-modal span.notifier_id,
|
||||
#plexpy-newsletters-table .friendly_name,
|
||||
#newsletter-config-modal span.newsletter_id,
|
||||
#plexpy-mobile-devices-table .friendly_name,
|
||||
#mobile-device-config-modal span.notifier_id {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Navbar */
|
||||
.navbar {
|
||||
background: var(--main-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;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#search_form #search_button.btn-inactive {
|
||||
background-color: #0000;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.nav>li.active>a,
|
||||
.nav>li.active>a:hover,
|
||||
.nav>li.active>a:focus {
|
||||
color: #f9be03;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.nav>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.nav>li>a:hover,
|
||||
.nav>li>a:focus {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.nav .open>a,
|
||||
.nav .open>a:hover,
|
||||
.nav .open>a:focus {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Dropdown */
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dropdown-menu>li>a:hover,
|
||||
.dropdown-menu>li>a:focus {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dropdown-menu .divider {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
select,
|
||||
.react-selectize.bootstrap3.root-node .react-selectize-control {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
/* Dashboard */
|
||||
.dashboard-stats-background,
|
||||
.dashboard-activity-background,
|
||||
.dashboard-activity-poster-container {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.dashboard-activity-progress-bar {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.dashboard-activity-progress .buffer-bar {
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.dashboard-activity-metadata-user a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.dashboard-activity-metadata-subtitle-container {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dashboard-recent-media-metacontainer h3.text-muted a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dashboard-recent-media-metacontainer h3.text-muted {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-dark {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-dark:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-dark:active,
|
||||
.btn-dark.active,
|
||||
.open>.dropdown-toggle.btn-dark,
|
||||
.btn-dark.active:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn:focus:not(select),
|
||||
.btn.focus:not(select),
|
||||
.btn-dark:focus:not(select),
|
||||
.btn-dark.focus:not(select),
|
||||
.btn-dark:active:focus:not(select) {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.btn-dark.active:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-dark.inactive:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.btn-danger.btn-edit {
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.btn-form {
|
||||
background-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-form:hover {
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* Inputs */
|
||||
textarea,
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
input[type="datetime"],
|
||||
input[type="datetime-local"],
|
||||
input[type="date"],
|
||||
input[type="month"],
|
||||
input[type="time"],
|
||||
input[type="week"],
|
||||
input[type="number"],
|
||||
input[type="email"],
|
||||
input[type="url"],
|
||||
input[type="search"],
|
||||
input[type="tel"],
|
||||
input[type="color"],
|
||||
.uneditable-input {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.react-selectize.root-node .react-selectize-control,
|
||||
.selectize-control.form-control .selectize-input {
|
||||
background: rgba(0, 0, 0, 0.25) !important;
|
||||
}
|
||||
|
||||
/*Formcontrol */
|
||||
select.form-control,
|
||||
div.form-control .selectize-input {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.form-inline .input-group>.form-control {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.form-control[disabled],
|
||||
.form-control[readonly],
|
||||
fieldset[disabled] .form-control {
|
||||
background-color: rgba(236, 236, 236, 0.25);
|
||||
}
|
||||
|
||||
textarea.form-control {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
textarea:focus,
|
||||
input[type="text"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="datetime"]:focus,
|
||||
input[type="datetime-local"]:focus,
|
||||
input[type="date"]:focus,
|
||||
input[type="month"]:focus,
|
||||
input[type="time"]:focus,
|
||||
input[type="week"]:focus,
|
||||
input[type="number"]:focus,
|
||||
input[type="email"]:focus,
|
||||
input[type="url"]:focus,
|
||||
input[type="search"]:focus,
|
||||
input[type="tel"]:focus,
|
||||
input[type="color"]:focus,
|
||||
.uneditable-input:focus {
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: transparent;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* Settings table cards */
|
||||
.table-card-header {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.25);
|
||||
border-top: 1px solid #00000000;
|
||||
}
|
||||
|
||||
.table-card-back {
|
||||
background-color: rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
table.display thead th {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
table.display thead tr:hover {
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
/*Settings menu */
|
||||
.card-back-full {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.nav-settings>li>a {
|
||||
border-bottom: 1px solid transparent;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.nav-settings>li {
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
border-top: 1px solid transparent;
|
||||
}
|
||||
|
||||
.nav-settings>.active>a,
|
||||
.nav-settings>.active>a:hover,
|
||||
.nav-settings>.active>a:focus {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.nav-settings>li>a:hover,
|
||||
.nav-settings>li>a:focus {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border-top: 1px solid #00000000;
|
||||
}
|
||||
|
||||
.card-sortable {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.card-handle {
|
||||
color: #fff;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
/*Notification agents menu */
|
||||
.stacked-configs>li {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.stacked-configs>li>span {
|
||||
color: #FFF;
|
||||
border-left: 2px solid rgba(0, 0, 0, 0.25);
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.stacked-configs>li>span:hover,
|
||||
.stacked-configs>li>span:focus {
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.stacked-configs>li>span>a.toggle-left,
|
||||
.stacked-configs>li>span>span.toggle-left {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
span>a.active,
|
||||
.stacked-configs>li>span>span.active {
|
||||
color: #f9be03;
|
||||
}
|
||||
|
||||
.inline-pre {
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
/* Summary containers */
|
||||
.summary-container .table-card-header,
|
||||
.summary-container .table-card-back {
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
.summary-navbar {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
/* pagination */
|
||||
.pagination>.disabled>span,
|
||||
.pagination>.disabled>span:hover,
|
||||
.pagination>.disabled>span:focus,
|
||||
.pagination>.disabled>a,
|
||||
.pagination>.disabled>a:hover,
|
||||
.pagination>.disabled>a:focus {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
border-color: #00000000;
|
||||
}
|
||||
|
||||
.pagination>li>a,
|
||||
.pagination>li>span {
|
||||
background-color: var(--button-color);
|
||||
border: 1px solid var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.pagination>li>a:hover,
|
||||
.pagination>li>span:hover,
|
||||
.pagination>li>a:focus,
|
||||
.pagination>li>span:focus {
|
||||
background-color: var(--button-color-hover);
|
||||
border: 1px solid var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
/* Graphs */
|
||||
.graphs-instance {
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
.modal-content {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.modal-body li {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
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;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-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-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-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-top: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-config-section {
|
||||
border-top: 1px solid rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
#changelog-modal .modal-body>h2 {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#notifier-config-modal .nav-tabs>li>a,
|
||||
#newsletter-config-modal .nav-tabs>li>a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
#notifier-config-modal .nav-tabs>li.active>a,
|
||||
#notifier-config-modal .nav-tabs>li.active>a:hover,
|
||||
#notifier-config-modal .nav-tabs>li.active>a:focus,
|
||||
#newsletter-config-modal .nav-tabs>li.active>a,
|
||||
#newsletter-config-modal .nav-tabs>li.active>a:hover,
|
||||
#newsletter-config-modal .nav-tabs>li.active>a:focus {
|
||||
color: var(--text-hover);
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
#notifier-config-modal .nav-tabs>li.active>a,
|
||||
#notifier-config-modal .nav-tabs>li.active>a:hover,
|
||||
#notifier-config-modal .nav-tabs>li.active>a:focus,
|
||||
#newsletter-config-modal .nav-tabs>li.active>a,
|
||||
#newsletter-config-modal .nav-tabs>li.active>a:hover,
|
||||
#newsletter-config-modal .nav-tabs>li.active>a:focus {
|
||||
border: 1px solid #0000;
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
#notifier-config-modal .nav-tabs>li>a:hover,
|
||||
#newsletter-config-modal .nav-tabs>li>a:hover {
|
||||
border-color: #0000;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#notifier-config-modal .nav-tabs,
|
||||
#newsletter-config-modal .nav-tabs {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.accordion {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
.accordion li .link {
|
||||
color: #fff;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.accordion li .link:hover,
|
||||
.accordion li .link:hover i.fa {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.submenu {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
/* Stream info */
|
||||
.stream-info {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
/* Edit metadata */
|
||||
.item-children-section-title {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
border-bottom: 1px solid #00000000;
|
||||
border-top: 1px solid #00000000;
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
.navbar-toggle:hover,
|
||||
.navbar-toggle:focus {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.navbar-toggle {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.navbar-collapse.in {
|
||||
box-shadow: 0px 15px 10px -10px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
}
|
||||
|
||||
#login-methods .submenu {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.login-container .remember-group {
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
#login-methods>li.open>div {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-bright {
|
||||
color: #fff;
|
||||
background-color: var(--button-color);
|
||||
box-shadow: inset 0 1px 0 var(--button-color);
|
||||
}
|
||||
|
||||
.btn-bright:hover {
|
||||
color: #fff;
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: inset 0 1px 0 var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-bright:active,
|
||||
.btn-bright.active,
|
||||
.open>.dropdown-toggle.btn-bright,
|
||||
#menu_link_show_advanced_settings.active {
|
||||
color: #fff;
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: inset 0 1px 0 var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-bright:active:hover,
|
||||
.btn-bright.active:hover,
|
||||
.open>.dropdown-toggle.btn-bright:hover,
|
||||
.btn-bright:active:focus,
|
||||
.btn-bright.active:focus,
|
||||
.open>.dropdown-toggle.btn-bright:focus,
|
||||
.btn-bright:active.focus,
|
||||
.btn-bright.active.focus,
|
||||
.open>.dropdown-toggle.btn-bright.focus {
|
||||
color: #fff;
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: inset 0 1px 0 var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn:focus:not(#history-user):not(#graph-user):not(#sync-user),
|
||||
.btn.focus,
|
||||
.btn-dark:focus,
|
||||
.btn-dark.focus,
|
||||
.btn-dark:active:focus {
|
||||
color: #fff;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
.btn-bright.disabled,
|
||||
.btn-bright[disabled],
|
||||
fieldset[disabled] .btn-bright,
|
||||
.btn-bright.disabled:hover,
|
||||
.btn-bright[disabled]:hover,
|
||||
fieldset[disabled] .btn-bright:hover,
|
||||
.btn-bright.disabled:focus,
|
||||
.btn-bright[disabled]:focus,
|
||||
fieldset[disabled] .btn-bright:focus,
|
||||
.btn-bright.disabled.focus,
|
||||
.btn-bright[disabled].focus,
|
||||
fieldset[disabled] .btn-bright.focus,
|
||||
.btn-bright.disabled:active,
|
||||
.btn-bright[disabled]:active,
|
||||
fieldset[disabled] .btn-bright:active,
|
||||
.btn-bright.disabled.active,
|
||||
.btn-bright[disabled].active,
|
||||
fieldset[disabled] .btn-bright.active {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
/* Accents */
|
||||
.badge {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.summary-content {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.nav>li.active>a,
|
||||
.nav>li.active>a:hover,
|
||||
.nav>li.active>a:focus {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dashboard-activity-progress .progress-bar {
|
||||
background-color: rgb(var(--accent-color));
|
||||
background-image: -moz-linear-gradient(top, var(--accent-color-hover), rgb(var(--accent-color)));
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(var(--accent-color-hover)), to(rgb(var(--accent-color))));
|
||||
background-image: -webkit-linear-gradient(top, var(--accent-color-hover, rgb(var(--accent-color))));
|
||||
background-image: -o-linear-gradient(top, var(--accent-color-hover, rgb(var(--accent-color))));
|
||||
background-image: linear-gradient(to bottom, var(--accent-color-hover, rgb(var(--accent-color))));
|
||||
|
||||
}
|
||||
|
||||
.dashboard-stats-info-item .sub-count {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.pagination>.active>a,
|
||||
.pagination>.active>span,
|
||||
.pagination>.active>a:hover,
|
||||
.pagination>.active>span:hover,
|
||||
.pagination>.active>a:focus,
|
||||
.pagination>.active>span:focus {
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--button-text-hover);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
table.display td:hover a {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.user-overview-stats-instance h3,
|
||||
.user-player-instance-playcount h3,
|
||||
.summary-content-title h1,
|
||||
.summary-content-title h1 a {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.user-info-nav>.active>a {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a:hover .dashboard-recent-media-poster,
|
||||
a:hover .dashboard-recent-media-cover {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.nav-settings>.active>a,
|
||||
.nav-settings>.active>a:hover,
|
||||
.nav-settings>.active>a:focus {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
div.advanced-setting {
|
||||
border-left: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.docker-setting {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.modal-body strong,
|
||||
.modal-body strong i.fa {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.user-info-nav a:hover {
|
||||
color: var(--accent-color-hover)
|
||||
}
|
||||
|
||||
a:hover .dashboard-activity-poster,
|
||||
a:hover .dashboard-activity-cover {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a:hover .dashboard-stats-poster,
|
||||
a:hover .dashboard-stats-cover,
|
||||
a:hover .dashboard-stats-circle,
|
||||
a:hover .dashboard-stats-square {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a:hover .item-children-poster {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dashboard-activity-terminate-session:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a .dashboard-activity-metadata-user-thumb:hover {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.stream-info .heading {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a .library-user-instance-box:hover {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.summary-navbar-list .breadcrumb a:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dashboard-recent-media-metacontainer h3.text-muted a:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
a .poster-face:hover,
|
||||
a .cover-face:hover,
|
||||
a .users-poster-face:hover,
|
||||
.summary-poster-face-overlay {
|
||||
-webkit-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
-moz-box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
box-shadow: inset 0 0 0 2px rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.submenu li {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
span>a.active,
|
||||
.stacked-configs>li>span>span.active {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.accordion li.open .link,
|
||||
.accordion li.open .link i.fa {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.news-body a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
0
CSS/themes/thelounge/.deprecated
Normal file
0
CSS/themes/thelounge/.deprecated
Normal file
179
CSS/themes/thelounge/thelounge-base.css
Normal file
179
CSS/themes/thelounge/thelounge-base.css
Normal file
@ -0,0 +1,179 @@
|
||||
/* 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 */
|
||||
|
||||
#chat .userlist .names {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
#chat .user-mode:before {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
#chat .userlist .names {
|
||||
box-shadow: 0 0 25px 0 rgba(0, 0, 0, .5);
|
||||
background: var(--window-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;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
#viewport.menu-dragging #sidebar,
|
||||
#viewport.menu-open #sidebar {
|
||||
box-shadow: 0 0 25px 0 rgba(0, 0, 0, .5);
|
||||
background: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
}
|
||||
|
||||
#chat .chan .notice .user,
|
||||
#chat .notice .content,
|
||||
#chat .notice .time {
|
||||
color: var(--date-marker-color) !important;
|
||||
}
|
||||
|
||||
#form #nick {
|
||||
background: var(--theme-accent);
|
||||
color: #f3f3f3;
|
||||
}
|
||||
|
||||
#form {
|
||||
background-color: rgba(0, 0, 0, 0.45);
|
||||
border-color: #0086ff00;
|
||||
color: var(--body-color);
|
||||
}
|
||||
|
||||
#sidebar .active,
|
||||
#sidebar .active:hover {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
#chat .msg.motd .text,
|
||||
code,
|
||||
.irc-monospace {
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
color: #f3f3f3;
|
||||
}
|
||||
|
||||
#chat .content,
|
||||
#windows #chat .header,
|
||||
#chat .user-mode::before,
|
||||
#chat .userlist {
|
||||
border-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#chat .msg[data-type=motd] .text {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
/* Dropdown menu */
|
||||
#context-menu,
|
||||
.textcomplete-menu {
|
||||
background: var(--body-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;
|
||||
/* color: white !important; */
|
||||
}
|
||||
|
||||
.context-menu-item,
|
||||
.textcomplete-item {
|
||||
color: var(--body-color);
|
||||
}
|
||||
|
||||
#chat .userlist .user.active,
|
||||
.context-menu-item:focus,
|
||||
.context-menu-item:hover,
|
||||
.textcomplete-item:focus,
|
||||
.textcomplete-item:hover,
|
||||
.textcomplete-menu .active {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
transition: none;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
#chat.table.ignore-list td,
|
||||
#chat table.ban-list td,
|
||||
#chat table.ban-list th,
|
||||
#chat table.channel-list td,
|
||||
#chat table.channel-list th,
|
||||
#chat table.ignore-list th,
|
||||
#chat table.invite-list td,
|
||||
#chat table.invite-list th {
|
||||
padding: 5px;
|
||||
vertical-align: top;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
#chat .userlist .count {
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
#footer button:hover,
|
||||
#sidebar .chan:hover {
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
#settings .extra-help:before {
|
||||
content: "\F059";
|
||||
color: var(--body-color);
|
||||
}
|
||||
|
||||
#windows .window h2 {
|
||||
color: var(--body-color);
|
||||
}
|
||||
|
||||
#windows .window h2 {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.input:not(:disabled):focus,
|
||||
.input:not(:disabled):hover {
|
||||
border-color: #ffffff;
|
||||
}
|
||||
|
||||
.btn:active,
|
||||
.btn:focus,
|
||||
.input:focus {
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.btn {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.mentions-popup {
|
||||
background: var(--body-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;
|
||||
}
|
||||
|
||||
#chat .toggle-content {
|
||||
background: var(--highlight-bg-color);
|
||||
|
||||
}
|
||||
982
CSS/themes/transmission/transmission-base.css
Normal file
982
CSS/themes/transmission/transmission-base.css
Normal file
@ -0,0 +1,982 @@
|
||||
/* 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(https://use.fontawesome.com/releases/v5.0.7/css/all.css);
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--main-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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
div#torrent_container {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector_header #torrent_inspector_name,
|
||||
.prefs-section .title {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* Toolbar */
|
||||
div#toolbar {
|
||||
background: rgba(0, 0, 0, .25);
|
||||
background-image: none;
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-separator {
|
||||
display: none
|
||||
}
|
||||
|
||||
/* Open torrent folder*/
|
||||
div#toolbar>div#toolbar-open {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-open:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-open:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f07c";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
/* Stop Icon */
|
||||
div#toolbar>div#toolbar-remove {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-remove:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-remove:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f28d";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
/* Start Icon */
|
||||
div#toolbar>div#toolbar-start {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-start:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-start:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f152";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
/* Pause Icon */
|
||||
div#toolbar>div#toolbar-pause {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-pause:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-pause:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f04c";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
/* Start-all Icon */
|
||||
div#toolbar>div#toolbar-start-all {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-start-all:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-start-all:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f101";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
/* Pause-all Icon */
|
||||
div#toolbar>div#toolbar-pause-all {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-pause-all:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-pause-all:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f28b";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Info Icon */
|
||||
div#toolbar>div#toolbar-inspector {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-inspector:hover:before {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
div#toolbar>div#toolbar-inspector:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 33px;
|
||||
content: "\f05a";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* Statusbar */
|
||||
#statusbar {
|
||||
border-bottom: 1px solid transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25)
|
||||
}
|
||||
|
||||
#statusbar #filter input#torrent_search {
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#statusbar #filter input#torrent_search.blur {
|
||||
color: #999;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#statusbar #speed-info #speed-dn-icon {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#statusbar #speed-info #speed-dn-icon:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 10px;
|
||||
content: "\f0d7";
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
#statusbar #speed-info #speed-up-icon {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#statusbar #speed-info #speed-up-icon:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 10px;
|
||||
content: "\f0d8";
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
ul.torrent_list,
|
||||
ul.torrent_list li.torrent.even {
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
ul.torrent_list li.torrent div.torrent_name {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
ul.torrent_list li.torrent.selected {
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
ul.torrent_list li.torrent {
|
||||
border-bottom: 1px solid rgba(204, 204, 204, 0.1);
|
||||
padding: 4px 30px 5px 14px;
|
||||
color: var(--text);
|
||||
background-color: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
/* Modal */
|
||||
div.dialog_container div.dialog_window {
|
||||
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: none !important;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
div.dialog_container div.dialog_window h2.dialog_heading,
|
||||
div#upload_container div.dialog_window div.dialog_message label {
|
||||
color: #dedede
|
||||
}
|
||||
|
||||
input {
|
||||
color: var(--text-hover);
|
||||
background: rgba(0, 0, 0, .25)
|
||||
}
|
||||
|
||||
#add-dialog-folder-input,
|
||||
#torrent_upload_url {
|
||||
color: var(--text-hover);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
div.dialog_container div.dialog_window div.dialog_message {
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
/* Button*/
|
||||
div.dialog_container div.dialog_window a {
|
||||
background-color: var(--button-color);
|
||||
border: 1px solid var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
div.dialog_container div.dialog_window a:hover,
|
||||
div.dialog_container div.dialog_window a:active {
|
||||
background: none;
|
||||
background-color: var(--button-color-hover);
|
||||
border: 1px solid var(--button-color-hover);
|
||||
}
|
||||
|
||||
/* ul.torrent_list div.torrent_progress_bar.complete.leeching {
|
||||
background-position: left 0px;
|
||||
background: var(--progress-color);
|
||||
border-color: var(--progress-color);
|
||||
} */
|
||||
|
||||
/* ul.torrent_list div.torrent_progress_bar {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
background-image: none;
|
||||
background-repeat: repeat-x;
|
||||
border: 1px solid #888;
|
||||
} */
|
||||
|
||||
.ui-widget-content {
|
||||
border: 1px solid transparent;
|
||||
background: var(--drop-down-menu-bg);
|
||||
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);
|
||||
}
|
||||
|
||||
.ui-widget-header {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.ui-widget .ui-widget {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.ui-widget {
|
||||
-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
|
||||
-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
#download-dir,
|
||||
#seedRatioLimit,
|
||||
#idle-seeding-limit,
|
||||
#speed-limit-up,
|
||||
#speed-limit-down,
|
||||
#alt-speed-up,
|
||||
#alt-speed-down,
|
||||
#peer-limit-per-torrent,
|
||||
#peer-limit-global,
|
||||
#blocklist-url,
|
||||
#blocklist-update-button,
|
||||
#peer-port {
|
||||
color: black;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.ui-widget-header {
|
||||
border: 1px solid transparent;
|
||||
background: none;
|
||||
color: #222;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.ui-state-active,
|
||||
.ui-widget-content .ui-state-active,
|
||||
.ui-widget-header .ui-state-active {
|
||||
border: 1px solid transparent;
|
||||
background: rgba(255, 255, 255, .1) !important;
|
||||
font-weight: normal;
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
.ui-state-active a,
|
||||
.ui-state-active a:link,
|
||||
.ui-state-active a:visited {
|
||||
color: #dedede;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.ui-state-default a,
|
||||
.ui-state-default a:link,
|
||||
.ui-state-default a:visited {
|
||||
color: #dedede;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.ui-state-default,
|
||||
.ui-widget-content .ui-state-default,
|
||||
.ui-widget-header .ui-state-default {
|
||||
border: 1px solid transparent;
|
||||
background: rgba(0, 0, 0, 0.25);
|
||||
font-weight: normal;
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
|
||||
/*Close Icon*/
|
||||
ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 10px;
|
||||
content: "\f00d";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*Inspector*/
|
||||
div#torrent_inspector {
|
||||
border-left: 1px solid transparent;
|
||||
-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
|
||||
-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>* {
|
||||
border-color: transparent;
|
||||
height: auto;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector div.inspector_torrent_file_list_entry_name,
|
||||
div#torrent_inspector ul.tier_list .tracker_activity,
|
||||
div#torrent_inspector ul.tier_list table,
|
||||
div#torrent_inspector div.tracker_host {
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
/*Info button*/
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f05a";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info.selected {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-info.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f05a";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*Peers Button*/
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0c0";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers.selected {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-peers.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0c0";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*Tracker Button*/
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f233";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers.selected {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-trackers.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f233";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*Files Button*/
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0c5";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files.selected {
|
||||
background-image: none;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files:active,
|
||||
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs>#inspector-tab-files.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0c5";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
tr.inspector_peer_entry.odd {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
/* Priority buttons */
|
||||
div.file-priority-radiobox>* {
|
||||
border-color: transparent;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/*Low pri*/
|
||||
div.file-priority-radiobox>div.low {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.low:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.low:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 30px;
|
||||
content: "\f107";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.low:active,
|
||||
div.file-priority-radiobox>div.low.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.low:active,
|
||||
div.file-priority-radiobox>div.low.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.low:active,
|
||||
div.file-priority-radiobox>div.low.selectedbefore {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 30px;
|
||||
content: "\f107";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*Normal pri*/
|
||||
div.file-priority-radiobox>div.normal {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.normal:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.normal:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 30px;
|
||||
content: "\f068";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.normal:active,
|
||||
div.file-priority-radiobox>div.normal.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.normal:active,
|
||||
div.file-priority-radiobox>div.normal.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.normal:active,
|
||||
div.file-priority-radiobox>div.normal.selectedbefore {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 30px;
|
||||
content: "\f068";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*High pri*/
|
||||
div.file-priority-radiobox>div.high {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.high:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.high:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 30px;
|
||||
content: "\f106";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.high:active,
|
||||
div.file-priority-radiobox>div.high.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.high:active,
|
||||
div.file-priority-radiobox>div.high.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.file-priority-radiobox>div.high:active,
|
||||
div.file-priority-radiobox>div.high.selectedbefore {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 30px;
|
||||
content: "\f106";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div#torrent_inspector li.inspector_tracker_entry.odd {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
/*Bottom Toolbar*/
|
||||
div.torrent_footer {
|
||||
border-top: 1px solid transparent;
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
background-image: none;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
div.torrent_footer>div {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
/* Settings Icon */
|
||||
div.torrent_footer #settings_menu {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #settings_menu:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #settings_menu:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f013";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.torrent_footer #settings_menu:active,
|
||||
div.torrent_footer #settings_menu.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #settings_menu:active,
|
||||
div.torrent_footer #settings_menu.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #settings_menu:active,
|
||||
div.torrent_footer #settings_menu.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f013";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Prefs Icon */
|
||||
div.torrent_footer #prefs-button {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #prefs-button:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #prefs-button:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0ad";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.torrent_footer #prefs-button:active,
|
||||
div.torrent_footer #prefs-button.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #prefs-button:active,
|
||||
div.torrent_footer #prefs-button.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #prefs-button:active,
|
||||
div.torrent_footer #prefs-button.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0ad";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Turtle Icon */
|
||||
div.torrent_footer #turtle-button {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #turtle-button:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #turtle-button:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f3fd";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.torrent_footer #turtle-button:active,
|
||||
div.torrent_footer #turtle-button.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #turtle-button:active,
|
||||
div.torrent_footer #turtle-button.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #turtle-button:active,
|
||||
div.torrent_footer #turtle-button.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f3fd";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Compact Icon */
|
||||
div.torrent_footer #compact-button {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #compact-button:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #compact-button:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0ca";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div.torrent_footer #compact-button:active,
|
||||
div.torrent_footer #compact-button.selected {
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
div.torrent_footer #compact-button:active,
|
||||
div.torrent_footer #compact-button.selected:hover:before {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.torrent_footer #compact-button:active,
|
||||
div.torrent_footer #compact-button.selected:before {
|
||||
font-family: "Font Awesome 5 Free";
|
||||
font-size: 20px;
|
||||
content: "\f0ca";
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/*Compact mode*/
|
||||
ul.torrent_list li.torrent div.torrent_name.paused,
|
||||
ul.torrent_list li.torrent.compact div.torrent_name {
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
/* Settings menu */
|
||||
.ui-state-hover,
|
||||
.ui-widget-content .ui-state-hover,
|
||||
.ui-widget-header .ui-state-hover,
|
||||
.ui-state-focus,
|
||||
.ui-widget-content .ui-state-focus,
|
||||
.ui-widget-header .ui-state-focus {
|
||||
border: 1px solid transparent;
|
||||
background: none;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
color: var(--text-hover);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.ui-icon,
|
||||
.ui-widget-content .ui-icon {
|
||||
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/transmission/icons.png);
|
||||
}
|
||||
721
CSS/themes/unraid/unraid-base.css
Normal file
721
CSS/themes/unraid/unraid-base.css
Normal file
@ -0,0 +1,721 @@
|
||||
/* 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 */
|
||||
|
||||
* {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--text);
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
strong {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
i.fa.fa-fw {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
a,
|
||||
.blue-text,
|
||||
a.static,
|
||||
i.control {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a.static:hover,
|
||||
i.control:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
#template {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
#menu {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
#header .text-left {
|
||||
border-right: solid medium rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#header {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#header,
|
||||
#header .text-right a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
#header .block {
|
||||
background-color: rgb(0 0 0 / 20%);
|
||||
border-radius: 0px 0px 0px 25px;
|
||||
}
|
||||
|
||||
#nav-block #nav-item:focus:after,
|
||||
#nav-block #nav-item:hover:after,
|
||||
#nav-block #nav-item.active:after {
|
||||
background: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
#nav-block #nav-item a:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
#nav-block #nav-item a {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
#nav-item.active a {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
#nav-item.active a:hover {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
textarea {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
/*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);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
span.outer.solid {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
span.inner {
|
||||
width: 137px !important;
|
||||
}
|
||||
|
||||
thead.sortable,
|
||||
thead,
|
||||
table.tablesorter thead tr th {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.sys,
|
||||
.usage-disk,
|
||||
.usage-bar {
|
||||
background: rgba(0, 0, 0, .35);
|
||||
}
|
||||
|
||||
.usage-disk>span:first-child {
|
||||
background-color: #4caf50
|
||||
}
|
||||
|
||||
#db-box3>tbody.smb.share.share1.sortable>tr>td>a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
#db-box3>tbody.smb.share.share1.sortable>tr>td>a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.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-hover);
|
||||
}
|
||||
|
||||
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(--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-hover);
|
||||
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-hover) !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 !important;
|
||||
}
|
||||
|
||||
/* 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);
|
||||
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;
|
||||
}
|
||||
|
||||
#sb-info-inner,
|
||||
#sb-loading-inner,
|
||||
div.sb-message {
|
||||
color: var(--text);
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#sb-title,
|
||||
#sb-title-inner {
|
||||
color: var(--text-hover);
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
#sb-wrapper {
|
||||
border: 1px rgba(0, 0, 0, 0) solid;
|
||||
color: var(--text);
|
||||
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;
|
||||
}
|
||||
|
||||
#sb-loading,
|
||||
#sb-body-inner,
|
||||
iframe {
|
||||
color: var(--text);
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
div.Panel i.PanelIcon {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* PLUGINS */
|
||||
div.tab [type=radio]:checked+label,
|
||||
div.tab [type=radio]+label:hover {
|
||||
border: 1px solid var(--accent-color-hover);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
div.tab [type=radio]+label {
|
||||
border: 1px solid rgb(255 255 255 / 25%);
|
||||
background-color: rgb(0 0 0 / 50%);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
#footer {
|
||||
color: var(--text);
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
/* CA */
|
||||
.ca_holderDocker {
|
||||
background-color: rgb(0 0 0 / 10%) !important;
|
||||
border-color: rgb(0 0 0 / 25%) !important;
|
||||
}
|
||||
|
||||
.ca_holderDocker::before {
|
||||
color: rgb(255 255 255 / 40%) !important;
|
||||
}
|
||||
|
||||
.selectedMenu {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.hoverMenu {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.ca_descriptionArea:hover,
|
||||
a.ca_repoPopup:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.ca_templatesDisplay .ca_holderFav {
|
||||
background: rgb(var(--accent-color), .7) !important;
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
a.ca_appreadmore:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.ca_bottomLine .appIcons:hover,
|
||||
.ca_bottomLine .unpinned:hover {
|
||||
text-decoration: none;
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.tooltipster-sidetip.tooltipster-right .tooltipster-box {
|
||||
border-left: 3px solid rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.tooltipster-sidetip.tooltipster-bottom .tooltipster-box {
|
||||
border-top: 3px solid rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border {
|
||||
border-top-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border {
|
||||
border-right-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border,
|
||||
.tooltipster-sidetip.tooltipster-top .tooltipster-box {
|
||||
border-bottom-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.appIconsPopUp:hover {
|
||||
color: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
a.popUpLink:hover {
|
||||
color: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
li.caMenuItem {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
li.caMenuItem:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.ca_holder {
|
||||
background-color: rgb(0, 0, 0, .25) !important;
|
||||
border-color: rgba(255, 255, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
.ca_holder:hover {
|
||||
background-color: rgba(0, 0, 0, 0.45) !important;
|
||||
}
|
||||
|
||||
.supportButton,
|
||||
.actionsPopup,
|
||||
.supportPopup,
|
||||
.popupProfile,
|
||||
.repoPopup,
|
||||
.ca_favouriteRepo {
|
||||
color: var(--button-text) !important;
|
||||
background: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
#templates_content > div > div > div.ca_bottomLine > div.infoButton.ca_appPopup {
|
||||
color: var(--button-text) !important;
|
||||
background: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
.infoButton:hover {
|
||||
background: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.supportButton:hover,
|
||||
.actionsPopup:hover,
|
||||
.supportPopup:hover,
|
||||
.popupProfile:hover,
|
||||
.repoPopup:hover,
|
||||
.ca_favouriteRepo:hover,
|
||||
.donate:hover{
|
||||
background: var(--button-color-hover) !important;
|
||||
color: var(--button-text-hover) !important;
|
||||
border-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.donate a {
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.donate:hover a {
|
||||
color: var(--button-text-hover) !important;
|
||||
}
|
||||
|
||||
.unpinned {
|
||||
color: var(--button-color) !important
|
||||
}
|
||||
|
||||
.unpinned:hover {
|
||||
color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
.homeMore:hover,
|
||||
.popUpClose:hover,
|
||||
.enabledIcon:hover,
|
||||
.ca_readmore:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.homeMore,
|
||||
.popUpClose,
|
||||
.ca_readmore {
|
||||
color: var(--link-color) !important;
|
||||
}
|
||||
|
||||
.sortIcons.enabledIcon {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.sortIcons.enabledIcon:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.sortIcons {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.sortIcons:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.pageSelected {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.pageNumber:hover {
|
||||
color: var(--accent-color-hover) !important;
|
||||
}
|
||||
|
||||
#copyright>a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
#copyright>a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
.ca_red {
|
||||
color: #e22828 !important;
|
||||
}
|
||||
|
||||
/* CA search input */
|
||||
#searchButton:hover {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
#searchBox,
|
||||
.searchSubmit {
|
||||
background: rgba(255, 255, 255, 0.05) !important;
|
||||
}
|
||||
|
||||
/* CA slide in menu */
|
||||
|
||||
.chartMenu:hover {
|
||||
color: var(--link-color-hover) !important;
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
background: var(--modal-bg-color) !important;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
/* AZURE THEME*/
|
||||
div.frame,
|
||||
div.tabs {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
/*DROPDOWN MENU*/
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg) !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;
|
||||
}
|
||||
|
||||
.dropdown-menu a {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu .divider {
|
||||
background-color: rgb(255 255 255 / 10%) !important;
|
||||
border-bottom: 1px solid rgb(255 255 255 / 10%) !important;
|
||||
}
|
||||
|
||||
.dropdown-menu li>a:hover,
|
||||
.dropdown-menu li>a:focus,
|
||||
.dropdown-submenu:hover>a {
|
||||
color: var(--text-hover) !important;
|
||||
background: rgb(255 255 255 / 10%) !important;
|
||||
}
|
||||
|
||||
/*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:not([data-has-cancel-button="false"]),
|
||||
.swal-overlay--show-modal .swal-modal {
|
||||
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;
|
||||
}
|
||||
|
||||
.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(0 0 0 / 25%);
|
||||
border-bottom: 2px solid rgb(0 0 0 / 25%);
|
||||
color: var(--text);
|
||||
background-color: rgb(0 0 0 / 10%);
|
||||
}
|
||||
|
||||
/* MY SERVERS */
|
||||
.UnraidUPC .--hasBanner-custom .UnraidUPC-dropdown {
|
||||
background: var(--drop-down-menu-bg) !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;
|
||||
--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-hover);
|
||||
--tw-gradient-stops: var(--tw-gradient-from), rgb(var(--accent-color)), rgba(226, 40, 40, 0);
|
||||
--tw-gradient-to: var(--accent-color-hover);
|
||||
--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;
|
||||
}
|
||||
|
||||
/* Edit template*/
|
||||
#contDescription {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
padding: 1%;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
dt {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
395
CSS/themes/uptime-kuma/uptime-kuma-base.css
Normal file
395
CSS/themes/uptime-kuma/uptime-kuma-base.css
Normal file
@ -0,0 +1,395 @@
|
||||
@import url("https://theme-park.dev/CSS/defaults/placeholders.css");
|
||||
|
||||
body,
|
||||
.dark {
|
||||
margin: 0;
|
||||
font-family: var(--bs-body-font-family);
|
||||
font-size: var(--bs-body-font-size);
|
||||
font-weight: var(--bs-body-font-weight);
|
||||
line-height: var(--bs-body-line-height);
|
||||
color: var(--text);
|
||||
text-align: var(--bs-body-text-align);
|
||||
background: var(--main-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;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
.text-secondary {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
.text-dark,
|
||||
.form-text {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.stats p,
|
||||
.word,
|
||||
footer {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: rgb(var(--accent-color)) !important
|
||||
}
|
||||
|
||||
h6,
|
||||
.h6,
|
||||
h5,
|
||||
.h5,
|
||||
h4,
|
||||
.h4,
|
||||
h3,
|
||||
.h3,
|
||||
h2,
|
||||
.h2,
|
||||
h1,
|
||||
.h1 {
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
a:hover:not(.btn),
|
||||
.nav-link:hover,
|
||||
.dark a:hover:not(.btn) {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
a,
|
||||
.nav-link,
|
||||
.dark a,
|
||||
.dark .nav-link {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
.url a {
|
||||
color: var(--link-color) !important;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* CARDS */
|
||||
.shadow-box,
|
||||
.dark .shadow-box {
|
||||
box-shadow: 0px 0px 20px 10px #0000001a;
|
||||
background: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
.list .item:hover {
|
||||
background-color: rgba(255, 255, 255, .15) !important;
|
||||
}
|
||||
|
||||
.dark .list .item.active,
|
||||
.list .item.active {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.dark .hp-bar-big .beat.empty,
|
||||
.hp-bar-big .beat.empty {
|
||||
background-color: rgba(255, 255, 255, .45) !important;
|
||||
}
|
||||
|
||||
|
||||
canvas {
|
||||
filter: invert(1)
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
|
||||
th {
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
td {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.dark .table-hover>tbody>tr:hover,
|
||||
.table-hover>tbody>tr:hover {
|
||||
--bs-table-accent-bg: rgba(0, 0, 0, .2);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
|
||||
/* MENUS */
|
||||
.dropdown-menu {
|
||||
color: var(--text) !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.dropdown-item:hover,
|
||||
.dropdown-item:focus {
|
||||
color: var(--text-hover) !important;
|
||||
background-color: rgba(255, 255, 255, .1) !important;
|
||||
}
|
||||
|
||||
.dark .dropdown-clear-data ul {
|
||||
border-color: #0000 !important;
|
||||
color: var(--text) !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
/* HEADER */
|
||||
.dark header,
|
||||
#app>div>header {
|
||||
background-color: rgba(0, 0, 0, .15) !important;
|
||||
border-bottom-color: rgba(255, 255, 255, 0) !important;
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
.dark .btn-primary {
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-check:focus+.btn-primary,
|
||||
.btn-primary:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
box-shadow: 0 0 0 .25rem rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.btn-check:checked+.btn-primary,
|
||||
.btn-check:active+.btn-primary,
|
||||
.btn-primary:active,
|
||||
.btn-primary.active,
|
||||
.show>.btn-primary.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-check:checked+.btn-primary:focus,
|
||||
.btn-check:active+.btn-primary:focus,
|
||||
.btn-primary:active:focus,
|
||||
.btn-primary.active:focus,
|
||||
.show>.btn-primary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 .25rem rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.btn-primary:disabled,
|
||||
.btn-primary.disabled {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
|
||||
.btn-outline-primary,
|
||||
.btn-outline-secondary {
|
||||
color: var(--button-text);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-outline-primary:hover,
|
||||
.btn-outline-secondary:hover {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-check:focus+.btn-outline-primary,
|
||||
.btn-outline-primary:focus {
|
||||
box-shadow: 0 0 0 .25rem rgba(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.btn-check:checked+.btn-outline-primary,
|
||||
.btn-check:active+.btn-outline-primary,
|
||||
.btn-outline-primary:active,
|
||||
.btn-outline-primary.active,
|
||||
.btn-outline-primary.dropdown-toggle.show {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-check:checked+.btn-outline-primary:focus,
|
||||
.btn-check:active+.btn-outline-primary:focus,
|
||||
.btn-outline-primary:active:focus,
|
||||
.btn-outline-primary.active:focus,
|
||||
.btn-outline-primary.dropdown-toggle.show:focus {
|
||||
box-shadow: 0 0 0 .25rem rgba(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.btn-outline-primary:disabled,
|
||||
.btn-outline-primary.disabled {
|
||||
color: var(--button-color);
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
|
||||
.nav-pills .nav-link.active,
|
||||
.nav-pills .show>.nav-link {
|
||||
color: var(--button-text) !important;
|
||||
background-color: var(--button-color);
|
||||
}
|
||||
|
||||
.dark #importBackup::file-selector-button,
|
||||
#importBackup::file-selector-button {
|
||||
color: var(--button-text) !important;
|
||||
background-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.dark #importBackup[data-v-d684482e]:hover:not(:disabled):not([readonly])::file-selector-button,
|
||||
#importBackup[data-v-d684482e]:hover:not(:disabled):not([readonly])::file-selector-button {
|
||||
color: var(--button-text-hover) !important;
|
||||
background-color: var(--button-color-hover) !important;
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
|
||||
.dark .form-control,
|
||||
.dark .form-select,
|
||||
.form-select,
|
||||
.form-control {
|
||||
color: var(--text);
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='#ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.dark .form-select:focus,
|
||||
.dark .form-control:focus,
|
||||
.form-select:focus,
|
||||
.form-control:focus {
|
||||
background: #1f1f1f;
|
||||
box-shadow: 0 0 0 0.25rem rgba(var(--accent-color), 0.25);
|
||||
border-color: rgba(var(--accent-color), 0.25);
|
||||
}
|
||||
|
||||
.dark .form-control,
|
||||
.dark .form-select,
|
||||
.form-select,
|
||||
.form-control {
|
||||
border-color: #0000;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.form-check-input:checked {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.form-check-input[type=checkbox]:indeterminate {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e")
|
||||
}
|
||||
|
||||
.dark .multiselect__content-wrapper,
|
||||
.multiselect__content-wrapper {
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
.multiselect {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.multiselect__option--highlight {
|
||||
background: rgb(var(--accent-color)) !important;
|
||||
outline: none;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.multiselect__option--highlight:after {
|
||||
content: attr(data-select);
|
||||
background: rgb(var(--accent-color)) !important;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.multiselect__option--selected,
|
||||
.dark .multiselect__option--selected {
|
||||
background: rgba(0, 0, 0, .45);
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.multiselect__tag,
|
||||
.dark .multiselect__tag {
|
||||
background: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.dark .multiselect__tags,
|
||||
.multiselect__tags {
|
||||
color: var(--text);
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.dark .multiselect__input,
|
||||
.dark .multiselect__single,
|
||||
.multiselect__input,
|
||||
.multiselect__single {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.dark .modal-header,
|
||||
.modal-header {
|
||||
border-color: rgb(var(--accent-color));
|
||||
border-radius: 1rem 1rem 0 0;
|
||||
background: var(--modal-header-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;
|
||||
}
|
||||
|
||||
.dark .modal-footer,
|
||||
.modal-footer {
|
||||
border-color: rgb(var(--accent-color));
|
||||
background: var(--modal-footer-color);
|
||||
border-radius: 0 0 1rem 1rem;
|
||||
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;
|
||||
}
|
||||
|
||||
.dark .modal-content,
|
||||
.modal-content {
|
||||
box-shadow: 0 15px 70px #000;
|
||||
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;
|
||||
}
|
||||
492
CSS/themes/vuetorrent/vuetorrent-base.css
Normal file
492
CSS/themes/vuetorrent/vuetorrent-base.css
Normal file
@ -0,0 +1,492 @@
|
||||
/* 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 */
|
||||
|
||||
/* MOBILE */
|
||||
|
||||
@media (max-width: 720px) {
|
||||
|
||||
.modal__body,
|
||||
.modal__content__wrapper,
|
||||
.modal__header,
|
||||
body,
|
||||
.dark .torrents,
|
||||
.torrents,
|
||||
.action-bar {
|
||||
background: #1b1b1b !important;
|
||||
}
|
||||
}
|
||||
|
||||
body,
|
||||
.background,
|
||||
.theme--light.v-application,
|
||||
.theme--dark.v-application,
|
||||
.v-application .background {
|
||||
color: var(--text);
|
||||
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;
|
||||
}
|
||||
|
||||
html {
|
||||
color: var(--text);
|
||||
background: #1f1f1f !important;
|
||||
}
|
||||
|
||||
/* SCROLL BAR */
|
||||
#app>div>nav>nav>div.v-navigation-drawer__content::-webkit-scrollbar-thumb {
|
||||
background: rgba(255, 255, 255, .1);
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
#app>div>nav>nav>div.v-navigation-drawer__content::-webkit-scrollbar-thumb:hover {
|
||||
background: rgba(255, 255, 255, .25);
|
||||
border-radius: 20px
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
.h1,
|
||||
.h2,
|
||||
.h3,
|
||||
.h4,
|
||||
.h5,
|
||||
.h6,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
.theme--dark.v-label,
|
||||
.theme--light.v-label,
|
||||
.theme--light.v-counter {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.v-application .grey--text {
|
||||
color: var(--text-muted) !important;
|
||||
caret-color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
.theme--light.v-tabs>.v-tabs-bar .v-tab--disabled,
|
||||
.theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active),
|
||||
.theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn,
|
||||
.theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon,
|
||||
.theme--dark.v-tabs>.v-tabs-bar .v-tab--disabled,
|
||||
.theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active),
|
||||
.theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn,
|
||||
.theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.theme--dark.v-subheader,
|
||||
.theme--light.v-subheader {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.theme--light.v-input,
|
||||
.theme--light.v-input input,
|
||||
.theme--light.v-input textarea {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.theme--light.v-card,
|
||||
.theme--dark.v-card {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* TOP NAVBAR */
|
||||
.theme--light.v-app-bar.v-toolbar.v-sheet,
|
||||
.theme--dark.v-app-bar.v-toolbar.v-sheet {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.v-app-bar.v-app-bar--hide-shadow {
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
}
|
||||
|
||||
.v-app-bar.v-app-bar--is-scrolled {
|
||||
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;
|
||||
}
|
||||
|
||||
.v-navigation-drawer__content .theme--dark.v-card,
|
||||
.v-navigation-drawer__content .theme--light.v-card {
|
||||
background: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
/* SIDE MENU */
|
||||
.v-application .primary {
|
||||
background: rgba(0, 0, 0, .25) !important;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.v-application .secondary {
|
||||
background-color: rgba(255, 255, 255, .15) !important;
|
||||
border-color: rgba(255, 255, 255, .15) !important;
|
||||
|
||||
}
|
||||
|
||||
.theme--dark.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border,
|
||||
.theme--light.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border {
|
||||
background-color: rgba(0, 0, 0, .12);
|
||||
}
|
||||
|
||||
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
|
||||
|
||||
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
|
||||
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close),
|
||||
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
|
||||
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close) {
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
}
|
||||
|
||||
/* slightly transparent fallback for Firefox (not supporting backdrop-filter) */
|
||||
@supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
|
||||
|
||||
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
|
||||
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close),
|
||||
.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close),
|
||||
.v-navigation-drawer--temporary:not(.v-navigation-drawer--close) {
|
||||
background-color: rgba(0, 0, 0, 0.9);
|
||||
}
|
||||
}
|
||||
|
||||
.v-application .download--text {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
caret-color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.v-navigation-drawer__content .download--text {
|
||||
color: var(--v-download-base) !important;
|
||||
caret-color: var(--v-download-base) !important;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.v-dialog .theme--dark.v-card,
|
||||
.v-dialog .theme--light.v-card,
|
||||
.v-dialog .theme--light.v-tabs-items,
|
||||
.v-dialog .theme--dark.v-tabs-items,
|
||||
.v-dialog .theme--light.v-list,
|
||||
.v-dialog .theme--dark.v-list {
|
||||
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;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.v-application .primary--text {
|
||||
color: var(--button-color) !important;
|
||||
caret-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.theme--light.v-tabs>.v-tabs-bar,
|
||||
.theme--dark.v-tabs>.v-tabs-bar {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
.v-application .white,
|
||||
.v-tab:before,
|
||||
.v-tabs-slider {
|
||||
background-color: rgb(var(--accent-color)) !important;
|
||||
border-color: rbg(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.theme--dark.v-icon.v-icon.v-icon--disabled,
|
||||
.theme--light.v-icon.v-icon.v-icon--disabled {
|
||||
color: rgba(255, 255, 255, .38) !important;
|
||||
}
|
||||
|
||||
.theme--dark.v-text-field--solo>.v-input__control>.v-input__slot,
|
||||
.theme--light.v-text-field--solo>.v-input__control>.v-input__slot {
|
||||
background: #1e1e1e;
|
||||
}
|
||||
|
||||
.v-input__icon svg,
|
||||
.v-select__selection {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.v-application .accent {
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.theme--light.v-text-field>.v-input__control>.v-input__slot:before,
|
||||
.theme--dark.v-text-field>.v-input__control>.v-input__slot:before {
|
||||
border-color: rgb(255 255 255 / 42%);
|
||||
}
|
||||
|
||||
.theme--light.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before,
|
||||
.theme--dark.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before {
|
||||
border-color: rgba(255, 255, 255, .87);
|
||||
}
|
||||
|
||||
.theme--dark.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled),
|
||||
.theme--light.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled) {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.v-input__slot:hover fieldset,
|
||||
.v-text-field--outlined fieldset {
|
||||
border-color: rgba(255, 255, 255, .1) !important;
|
||||
}
|
||||
|
||||
/* DASHBOARD */
|
||||
|
||||
.theme--dark.v-card.sideborder.done,
|
||||
.theme--light.v-card.sideborder.done {
|
||||
background-color: #16573e40;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.downloading,
|
||||
.theme--light.v-card.sideborder.downloading {
|
||||
background-color: #5bb97440;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.fail,
|
||||
.theme--light.v-card.sideborder.fail {
|
||||
background-color: #f83e7040;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.paused,
|
||||
.theme--light.v-card.sideborder.paused {
|
||||
background-color: #9ca3af40;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.queued,
|
||||
.theme--light.v-card.sideborder.queued {
|
||||
background-color: #2e5eaa40;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.seeding,
|
||||
.theme--light.v-card.sideborder.seeding {
|
||||
background-color: #4ecde640;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.checking,
|
||||
.theme--light.v-card.sideborder.checking {
|
||||
background-color: #ff704340;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.stalled,
|
||||
.theme--light.v-card.sideborder.stalled {
|
||||
background-color: #4ade8040;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.metadata,
|
||||
.theme--light.v-card.sideborder.metadata {
|
||||
background-color: #7e57c240;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme--dark.v-card.sideborder.moving,
|
||||
.theme--light.v-card.sideborder.moving {
|
||||
background-color: #ffaa2c40;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.v-application .torrent-paused-color .caption,
|
||||
.v-application .torrent-seeding-color .caption,
|
||||
.v-application .torrent-done-color .caption {
|
||||
color: #ccc !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-paused-color {
|
||||
background-color: rgb(156 163 175 / 70%) !important;
|
||||
border-color: rgb(156 163 175 / 70%) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-seeding-color {
|
||||
background-color: rgba(78, 205, 230, .7) !important;
|
||||
border-color: rgba(78, 205, 230, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-done-color {
|
||||
background-color: rgba(22, 87, 62, .7) !important;
|
||||
border-color: rgba(22, 87, 62, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-downloading-color {
|
||||
background-color: rgba(91, 185, 116, .7) !important;
|
||||
border-color: rgba(91, 185, 116, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-fail-color {
|
||||
background-color: rgba(248, 62, 112, .7) !important;
|
||||
border-color: rgba(248, 62, 112, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-queued-color {
|
||||
background-color: rgba(46, 94, 170, .7) !important;
|
||||
border-color: rgba(46, 94, 170, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-checking-color {
|
||||
background-color: rgba(255, 112, 67, .7) !important;
|
||||
border-color: rgba(255, 112, 67, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-stalled-color {
|
||||
background-color: rgba(74, 222, 128, .7) !important;
|
||||
border-color: rgba(74, 222, 128, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-metadata-color {
|
||||
background-color: rgba(126, 87, 194, .7) !important;
|
||||
border-color: rgba(126, 87, 194, .7) !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-moving-color {
|
||||
background-color: rgba(255, 170, 44, .7) !important;
|
||||
border-color: rgba(255, 170, 44, .7) !important;
|
||||
}
|
||||
|
||||
.torrent-paused-color .v-chip.paused,
|
||||
.torrent-seeding-color .v-chip.seeding,
|
||||
.torrent-done-color .v-chip.downloading,
|
||||
.torrent-done-color .v-chip.fail,
|
||||
.torrent-done-color .v-chip.queued,
|
||||
.torrent-done-color .v-chip.checking,
|
||||
.torrent-done-color .v-chip.stalled,
|
||||
.torrent-done-color .v-chip.metadata,
|
||||
.torrent-done-color .v-chip.moving {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
/* DROPDOWN */
|
||||
.v-menu__content .theme--dark.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled),
|
||||
.v-menu__content .theme--light.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled) {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.v-menu__content .theme--dark.theme--dark.v-list,
|
||||
.v-menu__content .theme--light.theme--light.v-list {
|
||||
background: var(--modal-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;
|
||||
}
|
||||
|
||||
.theme--dark.v-icon,
|
||||
.theme--light.v-icon {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
.theme--light.v-divider,
|
||||
.theme--dark.v-divider {
|
||||
border-color: rgba(255, 255, 255, .2) !important;
|
||||
}
|
||||
|
||||
/* TABLE */
|
||||
.theme--dark.v-data-table,
|
||||
.theme--light.v-data-table {
|
||||
background-color: rgba(0, 0, 0, .65);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>tbody>tr:hover:not(.v-data-table__expanded__content):not(.v-data-table__empty-wrapper),
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:hover:not(.v-data-table__expanded__content):not(.v-data-table__empty-wrapper) {
|
||||
background: rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>td:last-child,
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>td:not(.v-data-table__mobile-row),
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>th:last-child,
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>th:not(.v-data-table__mobile-row),
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>thead>tr:last-child>th,
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>td:last-child,
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>td:not(.v-data-table__mobile-row),
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>th:last-child,
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>tbody>tr:not(:last-child)>th:not(.v-data-table__mobile-row),
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>thead>tr:last-child>th {
|
||||
border-bottom: thin solid hsla(0, 0%, 100%, .12);
|
||||
}
|
||||
|
||||
.theme--light.v-data-table>.v-data-table__wrapper>table>thead>tr>th,
|
||||
.theme--dark.v-data-table>.v-data-table__wrapper>table>thead>tr>th {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.theme--light.v-data-table .v-data-table-header th.sortable.active,
|
||||
.theme--light.v-data-table .v-data-table-header th.sortable.active .v-data-table-header__icon,
|
||||
.theme--light.v-data-table .v-data-table-header th.sortable:hover,
|
||||
.theme--dark.v-data-table .v-data-table-header th.sortable.active,
|
||||
.theme--dark.v-data-table .v-data-table-header th.sortable.active .v-data-table-header__icon,
|
||||
.theme--dark.v-data-table .v-data-table-header th.sortable:hover {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* TOOLTIP */
|
||||
.apexcharts-tooltip.apexcharts-theme-dark .apexcharts-tooltip-title,
|
||||
.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.apexcharts-tooltip.apexcharts-theme-dark,
|
||||
.apexcharts-tooltip.apexcharts-theme-light {
|
||||
color: var(--text);
|
||||
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: 1px solid rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
/* MOBILE */
|
||||
|
||||
.theme--dark.v-btn.v-btn--has-bg,
|
||||
.theme--light.v-btn.v-btn--has-bg {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.v-speed-dial__list .v-icon__svg {
|
||||
fill: #fff;
|
||||
}
|
||||
0
CSS/themes/webtools/.deprecated
Normal file
0
CSS/themes/webtools/.deprecated
Normal file
392
CSS/themes/webtools/webtools-base.css
Normal file
392
CSS/themes/webtools/webtools-base.css
Normal file
@ -0,0 +1,392 @@
|
||||
/* 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 {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
a,
|
||||
.language a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#content:before {
|
||||
background: var(--main-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;
|
||||
}
|
||||
|
||||
* {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
body,
|
||||
.head .title,
|
||||
.fm .sections .section {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* ACCENTS */
|
||||
webtools-loading .webtoolsLoading,
|
||||
content-loading .contentLoading {
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
.uas .type.active {
|
||||
background: var(--button-color);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.uas .type.active:hover {
|
||||
background: var(--button-color-hover);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* NAVBAR */
|
||||
.head {
|
||||
background-color: rgb(0 0 0 / 0.25);
|
||||
box-shadow: 0 0 0 0px rgb(0 0 0 / 0%);
|
||||
}
|
||||
|
||||
.vertical-center {
|
||||
box-shadow: inset 0px 15px 15px -4px rgb(255 255 0 / 0%);
|
||||
}
|
||||
|
||||
/* SIDE MENU */
|
||||
.menu .toggle {
|
||||
background: rgb(0 0 0 / .25);
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
.menu {
|
||||
background-color: rgb(0 0 0 / 25%);
|
||||
box-shadow: 0 0 0 0px rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.menu .item {
|
||||
background: rgb(255 255 255 / 8%);
|
||||
color: var(--button-text);
|
||||
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .0);
|
||||
}
|
||||
|
||||
.menu .item:hover {
|
||||
background: rgb(255 255 255 / .16);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.menu .item.active {
|
||||
background: var(--accent-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
/* MODALS */
|
||||
.ngdialog.ngdialog-theme-default .ngdialog-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;
|
||||
color: var(--text) !important;
|
||||
border: #f0505000 5px solid;
|
||||
}
|
||||
|
||||
.fm .settings {
|
||||
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;
|
||||
color: var(--text);
|
||||
Border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* PAGES */
|
||||
.sub .settings {
|
||||
background: rgb(255 255 255 / 25%);
|
||||
}
|
||||
|
||||
label {
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.sub .rowShow,
|
||||
.uas .repoContainer .repo,
|
||||
.uas .typesMenu,
|
||||
.uas .repoContainer .repo.installed,
|
||||
.fm .sections .section,
|
||||
.playlists .userContainer .fileContainer,
|
||||
.playlists .playlistContainer {
|
||||
background: rgb(255 255 255 / .08);
|
||||
box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, .0);
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.uas .type:hover {
|
||||
background: rgb(255 255 255 / 8%);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.sub .rowShow:hover,
|
||||
.uas .repoContainer .repo:hover,
|
||||
.fm .sections .section:hover {
|
||||
background: rgb(255 255 255 / .16);
|
||||
box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, .0);
|
||||
}
|
||||
|
||||
.expanded:hover {
|
||||
background: rgb(255 255 255 / .08) !important;
|
||||
box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, .0);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .detail {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .detail .subItem .download:hover,
|
||||
.sub .rowShow .lineShow .contentShow .detail .subHeader .selectActions div:hover {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .detail .subItem.selected {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .detail .subItem.checked {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .detail .subItem.selected.checked {
|
||||
background: var(--accent-color);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .tvshow {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .tvshow:hover {
|
||||
background-color: rgb(255 255 255 / 16%);
|
||||
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .loadmore {
|
||||
background: var(--button-color);
|
||||
border: solid 6px var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .tvshowheader div {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .tvshowheader div:hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text);
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.sub .rowShow .lineShow .contentShow .loadmore:hover {
|
||||
background: var(--button-color-hover);
|
||||
color: var(--button-text);
|
||||
border: solid 6px transparent;
|
||||
}
|
||||
|
||||
.logs .logDetails {
|
||||
background-color: rgb(255 255 255 / 14%);
|
||||
}
|
||||
|
||||
.logs .search {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
.logs .logDetails table tr.danger {
|
||||
background-color: rgb(244 67 54 / 50%) !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.uas .repoContainer .repo .details .row,
|
||||
.uas .repoContainer .repo .details .row:nth-child(2n) {
|
||||
background: rgb(0 0 0 / 25%);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* SETTINGS */
|
||||
|
||||
/* BUTTONS */
|
||||
.btn,
|
||||
.sub .search .btnSearch,
|
||||
.logs .logButton,
|
||||
.uas .uasBtn,
|
||||
.uas .repoContainer .repo .header .right .installUpdate,
|
||||
.uas .typesMenu .search .btnSearch,
|
||||
.btnInput,
|
||||
.playlists .playlistBtn,
|
||||
.language .languageActions .langBtn,
|
||||
.fr .reset,
|
||||
.logs .search .btnSearch,
|
||||
.fm button {
|
||||
border-color: var(--button-color);
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
margin-right: 5px;
|
||||
box-shadow: none;
|
||||
border: transparent;
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn:focus,
|
||||
.btn:active,
|
||||
.btn-primary:not(:disabled):not(.disabled):active,
|
||||
.btn-primary:not(:disabled):not(.disabled).active,
|
||||
.show>.btn-primary.dropdown-toggle,
|
||||
.sub .search .btnSearch:hover,
|
||||
.sub .search .btnSearch:focus,
|
||||
.logs .logButton:hover,
|
||||
.logs .logButton:focus,
|
||||
.uas .uasBtn:hover,
|
||||
.uas .uasBtn:focus,
|
||||
.uas .repoContainer .repo .header .right .installUpdate:hover,
|
||||
.uas .repoContainer .repo .header .right .installUpdate:focus,
|
||||
.uas .typesMenu .search .btnSearch:focus,
|
||||
.uas .typesMenu .search .btnSearch:hover,
|
||||
.btnInput:hover,
|
||||
.btnInput:focus,
|
||||
.playlists .playlistBtn:hover,
|
||||
.playlists .playlistBtn:focus,
|
||||
.playlists .playlistBtn:not(.disabled):hover,
|
||||
.language .languageActions .langBtn:hover,
|
||||
.fr .reset:hover,
|
||||
.logs .search .btnSearch:hover,
|
||||
.logs .search .btnSearch:focus,
|
||||
.fm button:hover,
|
||||
.fm button:focus {
|
||||
border-color: var(--button-color-hover);
|
||||
color: var(--text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.uas .repoContainer .repo .header .right .delete,
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(2)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(3)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(4)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(5)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(6)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(7)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(8)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(9)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(10)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1),
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(11)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1) {
|
||||
background: #F44336;
|
||||
color: var(--button-text);
|
||||
border: #F44336;
|
||||
}
|
||||
|
||||
.uas .repoContainer .repo .header .right .delete:hover,
|
||||
.uas .repoContainer .repo .header .right .delete:focus,
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(2)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1):focus,
|
||||
body>div.content.ng-scope>div>div.pushTopMinor.ng-scope>div:nth-child(2)>div.playlistContent>div.topPart>div.buttons.pull-right>div:nth-child(1):hover {
|
||||
background: #ec2626;
|
||||
color: var(--button-text);
|
||||
border: #ec2626;
|
||||
}
|
||||
|
||||
.playlists .playlistBtn.disabled {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
border: var(--button-color);
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.playlists .playlistBtn.disabled:hover {
|
||||
background: var(--button-color);
|
||||
color: var(--button-text);
|
||||
border: var(--button-color);
|
||||
}
|
||||
|
||||
/* FORMS */
|
||||
.form-control,
|
||||
.sub .search .searchInput,
|
||||
.uas .manualInstall,
|
||||
.uas .typesMenu .search .searchInput,
|
||||
.logs .search .searchInput {
|
||||
color: var(--text) !important;
|
||||
background-color: rgba(0, 0, 0, .25) !important;
|
||||
border: 1px solid transparent !important;
|
||||
box-shadow: none !important;
|
||||
transition: background-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
.form-control:focus,
|
||||
.sub .search .searchInput:focus,
|
||||
.uas .manualInstall:focus,
|
||||
.uas .typesMenu .search .searchInput:focus,
|
||||
.logs .search .searchInput:focus {
|
||||
background-color: rgba(0, 0, 0, .5) !important;
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
/* TABLE */
|
||||
.info tr:nth-child(2n+1) {
|
||||
background-color: rgb(255 255 255 / 0.08);
|
||||
}
|
||||
|
||||
.logs .logDetails table tr:nth-child(even) {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
::placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
458
CSS/themes/xbackbone/xbackbone-base.css
Normal file
458
CSS/themes/xbackbone/xbackbone-base.css
Normal file
@ -0,0 +1,458 @@
|
||||
/* 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 */
|
||||
|
||||
.bg-light {
|
||||
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;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-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;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .2);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background-color: hsla(0, 0%, 100%, .5);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
body,
|
||||
.table,
|
||||
.navbar-dark .navbar-nav .nav-link,
|
||||
.dropdown-menu,
|
||||
.dropdown-item {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link:focus,
|
||||
.navbar-dark .navbar-nav .nav-link:hover,
|
||||
.navbar-dark .navbar-nav .show>.nav-link,
|
||||
.col-form-label {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-nav .nav-link.active {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.card-header {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
code {
|
||||
font-size: .875em;
|
||||
color: #d63384;
|
||||
word-wrap: break-word;
|
||||
background: rgb(0 0 0 / 50%);
|
||||
padding: 2px 6px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
pre {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
a {
|
||||
color: var(--link-color);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
/* TOP NAV */
|
||||
.bg-primary {
|
||||
background: rgba(0, 0, 0, .15) !important;
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-brand {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.navbar-dark .navbar-brand:focus,
|
||||
.navbar-dark .navbar-brand:hover {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
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;
|
||||
}
|
||||
|
||||
.dropdown-header {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dropdown-item:focus,
|
||||
.dropdown-item:hover {
|
||||
color: var(--text-hover);
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
||||
.dropdown-item.disabled,
|
||||
.dropdown-item:disabled {
|
||||
color: var(--text-muted);
|
||||
pointer-events: none;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.dropdown-divider {
|
||||
border-top: 1px solid rgb(255 255 255 / 15%);
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
.table-hover>tbody>tr:hover,
|
||||
.table>thead {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table {
|
||||
border-color: rgb(255 255 255 / 20%);
|
||||
}
|
||||
|
||||
.table>:not(:last-child)>:last-child>* {
|
||||
border-bottom-color: rgb(255 255 255 / 50%);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
.btn-light {
|
||||
color: var(--button-text);
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
border-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
.btn-light:hover {
|
||||
color: var(--button-text-hover);
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
border-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.btn-outline-dark,
|
||||
.btn-outline-secondary {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover,
|
||||
.btn-outline-dark:hover,
|
||||
.btn-outline-secondary:hover,
|
||||
.btn-check:focus+.btn-primary,
|
||||
.btn-primary:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-check:active+.btn-primary:focus,
|
||||
.btn-check:checked+.btn-primary:focus,
|
||||
.btn-primary.active:focus,
|
||||
.btn-primary:active:focus,
|
||||
.show>.btn-primary.dropdown-toggle:focus,
|
||||
.btn-check:focus+.btn-primary,
|
||||
.btn-primary:focus {
|
||||
box-shadow: 0 0 0 0.25rem rgba(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.btn-outline-primary,
|
||||
.btn-outline-info {
|
||||
color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-outline-primary:hover,
|
||||
.btn-outline-info:hover,
|
||||
.btn-check:active+.btn-outline-primary,
|
||||
.btn-check:checked+.btn-outline-primary,
|
||||
.btn-outline-primary.active,
|
||||
.btn-outline-primary.dropdown-toggle.show,
|
||||
.btn-outline-primary:active,
|
||||
.btn-check:active+.btn-outline-info,
|
||||
.btn-check:checked+.btn-outline-info,
|
||||
.btn-outline-info.active,
|
||||
.btn-outline-info.dropdown-toggle.show,
|
||||
.btn-outline-info:active {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-check:focus+.btn-outline-primary,
|
||||
.btn-outline-primary:focus,
|
||||
.btn-check:focus+.btn-outline-info,
|
||||
.btn-outline-info:focus,
|
||||
.btn-check:active+.btn-outline-primary:focus,
|
||||
.btn-check:checked+.btn-outline-primary:focus,
|
||||
.btn-outline-primary.active:focus,
|
||||
.btn-outline-primary.dropdown-toggle.show:focus,
|
||||
.btn-outline-primary:active:focus,
|
||||
.btn-check:active+.btn-outline-info:focus,
|
||||
.btn-check:checked+.btn-outline-info:focus,
|
||||
.btn-outline-info.active:focus,
|
||||
.btn-outline-info.dropdown-toggle.show:focus,
|
||||
.btn-outline-info:active:focus {
|
||||
box-shadow: 0 0 0 0.25rem rgb(var(--accent-color), .5);
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-info:not(:disabled):not(.disabled).active:focus,
|
||||
.btn-outline-info:not(:disabled):not(.disabled):active:focus,
|
||||
.show>.btn-outline-info.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color) / 50%);
|
||||
}
|
||||
|
||||
.btn-outline-info:not(:disabled):not(.disabled).active,
|
||||
.btn-outline-info:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-outline-info.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-primary {
|
||||
color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-outline-primary:hover {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-primary.focus,
|
||||
.btn-outline-primary:focus {
|
||||
box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .5)
|
||||
}
|
||||
|
||||
.btn-outline-primary.disabled,
|
||||
.btn-outline-primary:disabled {
|
||||
color: var(--button-color);
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.btn-outline-primary:not(:disabled):not(.disabled).active,
|
||||
.btn-outline-primary:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-outline-primary.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
|
||||
.show>.btn-outline-primary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 .2rem rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.btn-outline-dark {
|
||||
color: var(--button-text);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
.btn-outline-dark:hover {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-dark.focus,
|
||||
.btn-outline-dark:focus {
|
||||
box-shadow: 0 0 0 .2rem rgba(var(--accent-color), .5)
|
||||
}
|
||||
|
||||
.btn-outline-dark.disabled,
|
||||
.btn-outline-dark:disabled {
|
||||
color: var(--button-color);
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
.btn-outline-dark:not(:disabled):not(.disabled).active,
|
||||
.btn-outline-dark:not(:disabled):not(.disabled):active,
|
||||
.show>.btn-outline-dark.dropdown-toggle {
|
||||
color: var(--button-text-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
.btn-outline-dark:not(:disabled):not(.disabled).active:focus,
|
||||
.btn-outline-dark:not(:disabled):not(.disabled):active:focus,
|
||||
.show>.btn-outline-dark.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 .2rem rgba(52, 58, 64, .5)
|
||||
}
|
||||
|
||||
|
||||
/* FORMS */
|
||||
.form-control {
|
||||
color: #fff;
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
border: 1px solid rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
color: #fff;
|
||||
background: #1f1f1f;
|
||||
border-color: rgba(255, 255, 255, .15);
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0);
|
||||
}
|
||||
|
||||
textarea.form-control:focus {
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, .35);
|
||||
border-color: rgba(255, 255, 255, .15);
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.25rem rgb(255 255 255 / 0%);
|
||||
}
|
||||
|
||||
.form-control:disabled,
|
||||
.form-control[readonly] {
|
||||
background-color: rgba(255, 255, 255, .15);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.form-check-input:checked {
|
||||
background-color: rgb(var(--accent-color));
|
||||
border-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.form-check-input:focus {
|
||||
border-color: rgb(var(--accent-color));
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.25rem rgb(var(--accent-color), .25);
|
||||
}
|
||||
|
||||
.dropzone {
|
||||
border: 2px dashed rgb(255 255 255 / 30%);
|
||||
}
|
||||
|
||||
/* PAGINATION */
|
||||
.page-link {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border: 1px solid var(--button-color);
|
||||
}
|
||||
|
||||
.page-link:hover {
|
||||
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border: 1px solid var(--button-color-hover);
|
||||
}
|
||||
|
||||
.page-link:focus {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
box-shadow: 0 0 0 0.25rem rgb(var(--accent-color) / 25%);
|
||||
}
|
||||
|
||||
.page-item.disabled .page-link {
|
||||
color: var(--text-muted);
|
||||
pointer-events: none;
|
||||
background-color: rgba(255, 255, 255, .08);
|
||||
border-color: rgba(255, 255, 255, .08);
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.card {
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
}
|
||||
|
||||
.image-card:hover .overlay {
|
||||
opacity: 1;
|
||||
transition: opacity .3s ease-in-out;
|
||||
-moz-transition: opacity .3s ease-in-out;
|
||||
-webkit-transition: opacity .3s ease-in-out;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
/* PLACEHOLDER TEXT */
|
||||
::placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
:-ms-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5 !important;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
30
CSS/variables/aquamarine.css
Normal file
30
CSS/variables/aquamarine.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #009688;
|
||||
--button-color-hover: #12afa0;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 18, 175, 160;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #0ed2bf;
|
||||
--link-color-hover: #36e7d6;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #009688; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(21, 213, 194);
|
||||
--petio-spinner: invert(39%) sepia(98%) saturate(527%) hue-rotate(129deg) brightness(94%) contrast(101%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 18, 175, 160;
|
||||
}
|
||||
32
CSS/variables/blackberry-abyss.css
Normal file
32
CSS/variables/blackberry-abyss.css
Normal file
@ -0,0 +1,32 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(to bottom, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at bottom center, rgba(0, 0, 0, 0.4) 0%, hsla(211, 18%, 45%, 0.55), hsla(211, 18%, 5%, 0)) center center/cover no-repeat fixed,
|
||||
linear-gradient(to right, hsla(211, 18%, 5%, 1), hsla(211, 18%, 45%, 1), hsla(211, 18%, 5%, 1)) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: hsla(211, 18%, 45%, 1);
|
||||
--button-color-hover: hsla(211, 18%, 45%, 0.55);
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 130, 157, 185;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: rgb(130, 157, 185);
|
||||
--link-color-hover: rgb(100, 119, 139);
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #829db9;
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 130, 157, 185;
|
||||
}
|
||||
30
CSS/variables/blackberry-amethyst.css
Normal file
30
CSS/variables/blackberry-amethyst.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(at top center, rgba(0, 0, 0, 0.25), hsla(0, 14%, 18%, 0.55) , hsla(0, 18%, 5%, 0.9)) center center/cover no-repeat fixed, linear-gradient(to bottom, #df89de 0%, hsl(276, 100%, 3%) 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: rgb(134, 84, 132);
|
||||
--button-color-hover: rgba(134, 84, 132, .8);
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 217, 164, 217;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: rgb(199, 118, 197);
|
||||
--link-color-hover: rgb(217, 164, 217);
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(134, 84, 132);
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 134, 84, 132;
|
||||
}
|
||||
37
CSS/variables/blackberry-carol.css
Normal file
37
CSS/variables/blackberry-carol.css
Normal file
@ -0,0 +1,37 @@
|
||||
:root {
|
||||
--main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"),
|
||||
radial-gradient(at center center, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.9) 120%) center center/cover no-repeat fixed,
|
||||
radial-gradient(at bottom center, rgba(0, 0, 0, 0.15), hsla(0, 14%, 18%, 0.45), hsla(0, 18%, 5%, 0.6)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at bottom center, rgba(167, 6, 6, 0.15), hsla(0, 14%, 18%, 0), hsla(0, 18%, 5%, 0)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at top center, rgba(11, 80, 25, 0.6), hsla(0, 14%, 18%, 0.45), hsla(0, 18%, 5%, 0.6)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at bottom right, #0b5019, hsla(0, 14%, 18%, 0), hsla(0, 18%, 5%, 0)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at center center, rgba(167, 6, 6, 0.25), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)) center center/cover no-repeat fixed,
|
||||
linear-gradient(45deg, #0b5019 0%, #a70606 135%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: rgb(51, 0, 0);
|
||||
--button-color-hover: rgb(104, 4, 4);
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color:170,170,170;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #aaaaaa;
|
||||
--link-color-hover: #fff;
|
||||
--label-text-color: rgb(32, 32, 32);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(100, 15, 15);
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 100, 15, 15;
|
||||
}
|
||||
33
CSS/variables/blackberry-dreamscape.css
Normal file
33
CSS/variables/blackberry-dreamscape.css
Normal file
@ -0,0 +1,33 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(at top center, rgba(0, 0, 0, 0), hsla(0, 14%, 18%, 0.2), hsla(0, 18%, 5%, 1) 95%) center center/cover no-repeat fixed,
|
||||
radial-gradient(at bottom center, rgba(0, 0, 0, 0.15), hsla(0, 14%, 18%, 0.45), hsla(0, 18%, 5%, 0.6)) center center/cover no-repeat fixed,
|
||||
linear-gradient(to top, #e2c9cc 1%, #e7627d 46%, #b8235a 59%, #801357 71%, #3d1635 84%, #1c1a27 100%) center center/cover no-repeat fixed;
|
||||
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: #3d1635;
|
||||
--button-color-hover: #801357;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 231, 98, 125;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: rgb(230, 125, 146);
|
||||
--link-color-hover: #e2c9cc;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #e7627d;
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 231, 98, 125;
|
||||
}
|
||||
31
CSS/variables/blackberry-flamingo.css
Normal file
31
CSS/variables/blackberry-flamingo.css
Normal file
@ -0,0 +1,31 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(at bottom center, rgba(0, 0, 0, 0.15), hsla(0, 14%, 18%, 0.65), hsla(0, 18%, 5%, 0.95)) center center/cover no-repeat fixed,
|
||||
linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: #fad0c4;
|
||||
--button-color-hover: #ff9a9e;
|
||||
--button-text: hsla(0, 18%, 5%, 0.95);
|
||||
--button-text-hover: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--accent-color: 250, 208, 196;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #fad0c4;
|
||||
--link-color-hover: #e2c9cc;
|
||||
--label-text-color: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #ff9a9e;
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 154, 158;
|
||||
}
|
||||
32
CSS/variables/blackberry-hearth.css
Normal file
32
CSS/variables/blackberry-hearth.css
Normal file
@ -0,0 +1,32 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(at bottom center, rgba(0, 0, 0, 0.4) 0%, hsla(0, 14%, 18%, 0.55), hsla(0, 18%, 5%, 0)) center center/cover no-repeat fixed,
|
||||
linear-gradient(to bottom, hsl(0, 18%, 5%), hsl(0, 65%, 23%), hsl(0, 100%, 9%)) center center/cover no-repeat fixed;
|
||||
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: rgb(236, 106, 106);
|
||||
--button-color-hover: hsl(0, 65%, 23%);
|
||||
--button-text: hsla(0, 18%, 5%, 0.95);
|
||||
--button-text-hover: hsla(0, 0%, 100%, 0.95);
|
||||
|
||||
--accent-color: 236, 106, 106;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #fad0c4;
|
||||
--link-color-hover: #e2c9cc;
|
||||
--label-text-color: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #ff9a9e;
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 154, 158;
|
||||
}
|
||||
32
CSS/variables/blackberry-martian.css
Normal file
32
CSS/variables/blackberry-martian.css
Normal file
@ -0,0 +1,32 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(to right, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.45)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at right center, rgba(0, 0, 0, 0.3) 10%, hsla(0, 14%, 18%, 0.6), hsla(0, 18%, 5%, 1) 95%) center center/cover no-repeat fixed,
|
||||
linear-gradient(to right, #43e97b 0%, #043815 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: #2e5135;
|
||||
--button-color-hover: #043815;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: hsla(0, 0%, 100%, 0.95);
|
||||
|
||||
--accent-color: 67, 233, 123;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #43e97b;
|
||||
--link-color-hover: #2e5135;
|
||||
--label-text-color: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #43e97b;
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 67, 233, 123;
|
||||
}
|
||||
33
CSS/variables/blackberry-pumpkin.css
Normal file
33
CSS/variables/blackberry-pumpkin.css
Normal file
@ -0,0 +1,33 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(135deg, transparent 40%, rgba(20, 9, 27, 0.5)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at center center, rgba(243, 217, 217, 0.25), hsla(0, 14%, 18%, 0.55), rgba(14, 0, 19, 0.7)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at bottom center, rgba(0, 0, 0, 0.25), hsla(0, 14%, 18%, 0.55), rgb(10, 4, 12)) center center/cover no-repeat fixed,
|
||||
radial-gradient(at center center, #ff8a00 50%, #37033a 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: #924e00;
|
||||
--button-color-hover: #723d00;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: hsla(0, 0%, 100%, 0.95);
|
||||
|
||||
--accent-color: 255, 138, 0;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #ff8a00;
|
||||
--link-color-hover: #bd6500;
|
||||
--label-text-color: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #ff8a00;
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 138, 0;
|
||||
}
|
||||
31
CSS/variables/blackberry-royal.css
Normal file
31
CSS/variables/blackberry-royal.css
Normal file
@ -0,0 +1,31 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.7) 100%) center center/cover no-repeat fixed,
|
||||
radial-gradient(at top center, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.40) 120%) #000000 center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: rgb(185, 170, 159);
|
||||
--button-color-hover: rgb(184, 159, 141);
|
||||
--button-text: hsla(0, 18%, 5%, 0.95);;
|
||||
--button-text-hover: hsla(0, 0%, 100%, 0.95);
|
||||
|
||||
--accent-color: 185, 170, 159;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: rgb(185, 170, 159);
|
||||
--link-color-hover: rgb(184, 159, 141);
|
||||
--label-text-color: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(185, 170, 159);
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 185, 170, 159;
|
||||
}
|
||||
30
CSS/variables/blackberry-shadow.css
Normal file
30
CSS/variables/blackberry-shadow.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(135deg, #252b2f, #090c0e) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: #252b2f;
|
||||
--button-color-hover: #090c0e;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: hsla(0, 0%, 100%, 0.95);
|
||||
|
||||
--accent-color: 81, 101, 114;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: rgb(96, 128, 150);
|
||||
--link-color-hover: rgb(81, 101, 114, .8);
|
||||
--label-text-color: #eee;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(81, 101, 114);
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 81, 101, 114;
|
||||
}
|
||||
31
CSS/variables/blackberry-solar.css
Normal file
31
CSS/variables/blackberry-solar.css
Normal file
@ -0,0 +1,31 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(at top left, rgba(0, 0, 0, 0.31), hsla(0, 14%, 18%, 0.9), hsla(0, 18%, 5%, 1)) center center/cover no-repeat fixed,
|
||||
linear-gradient(120deg, #f6d365 0%, #a25a25 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: var(--main-bg-color);
|
||||
--modal-header-color: var(--main-bg-color);
|
||||
--modal-footer-color: var(--main-bg-color);
|
||||
|
||||
--drop-down-menu-bg: var(--main-bg-color);
|
||||
|
||||
--button-color: #f6d365;
|
||||
--button-color-hover: #a25a25;
|
||||
--button-text: hsla(0, 18%, 5%, 0.95);
|
||||
--button-text-hover: hsla(0, 0%, 100%, 0.95);
|
||||
|
||||
--accent-color: 246, 211, 101;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: rgb(246, 211, 101);
|
||||
--link-color-hover: rgb(246, 211, 101, .8);
|
||||
--label-text-color: hsla(0, 18%, 5%, 0.95);
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(246, 211, 101);
|
||||
--petio-spinner: invert(68%) sepia(13%) saturate(766%) hue-rotate(170deg) brightness(90%) contrast(79%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 246, 211, 101;
|
||||
}
|
||||
30
CSS/variables/blackberry-vanta.css
Normal file
30
CSS/variables/blackberry-vanta.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: #000;
|
||||
|
||||
--modal-bg-color: #181818;
|
||||
--modal-header-color: #181818;
|
||||
--modal-footer-color: #181818;
|
||||
|
||||
--drop-down-menu-bg: #2d2d2d;
|
||||
|
||||
--button-color: #7a7a7a;
|
||||
--button-color-hover: #9b9b9b;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 170, 170, 170;
|
||||
--accent-color-hover: rgba(255, 255, 255, 0.45);
|
||||
--link-color: #7a7a7a;
|
||||
--link-color-hover: #fff;
|
||||
--label-text-color: black;
|
||||
|
||||
--text:#a5a5a5;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #e5a00d;
|
||||
--petio-spinner: invert(35%) sepia(12%) saturate(4%) hue-rotate(2deg) brightness(104%) contrast(86%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 255, 255;
|
||||
}
|
||||
30
CSS/variables/dark.css
Normal file
30
CSS/variables/dark.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
||||
--modal-header-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: #2d2d2d;
|
||||
|
||||
--button-color: #7a7a7a;
|
||||
--button-color-hover: #9b9b9b;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 170, 170, 170;
|
||||
--accent-color-hover: rgba(255, 255, 255, 0.45);
|
||||
--link-color: #7a7a7a;
|
||||
--link-color-hover: #fff;
|
||||
--label-text-color: black;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #e5a00d;
|
||||
--petio-spinner: invert(35%) sepia(12%) saturate(4%) hue-rotate(2deg) brightness(104%) contrast(86%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 255, 255;
|
||||
}
|
||||
30
CSS/variables/dracula.css
Normal file
30
CSS/variables/dracula.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: #282a36;
|
||||
|
||||
--modal-bg-color: #1e2029;
|
||||
--modal-header-color: #1e2029;
|
||||
--modal-footer-color: #1e2029;
|
||||
|
||||
--drop-down-menu-bg: #1e2029;
|
||||
|
||||
--button-color: #bd93f9;
|
||||
--button-color-hover: #ff79c6;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 80, 250, 123;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #ff79c6;
|
||||
--link-color-hover: #8be9fd;
|
||||
--label-text-color: #282a36;
|
||||
|
||||
--text:#6272a4;
|
||||
--text-hover: #95adfa;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #50fa7b; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #bd93f9;
|
||||
--petio-spinner: invert(79%) sepia(27%) saturate(1033%) hue-rotate(74deg) brightness(104%) contrast(96%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 80, 250, 123;
|
||||
}
|
||||
30
CSS/variables/hotline-old.css
Normal file
30
CSS/variables/hotline-old.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: hsla(0,0%,100%,.15);
|
||||
--button-color-hover: hsla(0,0%,100%,.30);
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 244, 67, 54;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #fff;
|
||||
--link-color-hover: #fff;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6b5; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #FB3122;
|
||||
--petio-spinner: invert(32%) sepia(35%) saturate(3786%) hue-rotate(341deg) brightness(100%) contrast(92%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 244, 67, 54;
|
||||
}
|
||||
30
CSS/variables/hotline.css
Normal file
30
CSS/variables/hotline.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(0deg, rgba(247,101,184,1) 0%, rgb(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: linear-gradient(0deg, rgba(247,101,184,1) 0%, rgb(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: linear-gradient(0deg, rgba(247,101,184,1) 0%, rgb(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(0deg, rgba(247,101,184,1) 0%, rgb(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(90deg, rgba(247,101,184,1) 0%, rgba(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #f98dc9;
|
||||
--button-color-hover: #ff4cb1;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #fff;
|
||||
|
||||
--accent-color: 249, 141, 201;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color:rgb(255, 179, 222);
|
||||
--link-color-hover: #d7fffe;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #f98dc9; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #f765b8;
|
||||
--petio-spinner: invert(78%) sepia(17%) saturate(4447%) hue-rotate(290deg) brightness(109%) contrast(95%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 215,255,254;
|
||||
}
|
||||
30
CSS/variables/hotpink.css
Normal file
30
CSS/variables/hotpink.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(45deg, #fb3f62 0%, #204c80 37%, #004249 97%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: radial-gradient(circle, #204c80 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: radial-gradient(circle, #204c80 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: radial-gradient(circle, #204c80 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: #204c80;
|
||||
|
||||
--button-color: #fb3f62;
|
||||
--button-color-hover: #cd4164;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 251, 63, 98;
|
||||
--accent-color-hover: rgba(var(--accent-color), .8);
|
||||
--link-color: rgb(0, 255, 157);
|
||||
--link-color-hover: rgba(0, 255, 157, 0.8);
|
||||
--label-text-color: #282a36;
|
||||
|
||||
--text:#eee;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
--arr-queue-color: rgb(0, 255, 157);
|
||||
--plex-poster-unwatched: #fb3f62;
|
||||
--petio-spinner: invert(29%) sepia(87%) saturate(2199%) hue-rotate(331deg) brightness(115%) contrast(97%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 251, 63, 98;
|
||||
}
|
||||
|
||||
30
CSS/variables/mind.css
Normal file
30
CSS/variables/mind.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(255, 242, 0, .7) 0%, #0d0400 80%, rgba(0, 0, 0, 1) 100%) center center/cover no-repeat fixed,
|
||||
url("https://theme-park.dev/Resources/mind.jpg") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: linear-gradient(180deg, rgba(51, 49, 0, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: linear-gradient(180deg, rgba(51, 49, 0, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(180deg, rgba(51, 49, 0, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(180deg, rgba(51, 49, 0, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #e1d500;
|
||||
--button-color-hover: #c3b900;
|
||||
--button-text: #000;
|
||||
--button-text-hover: #000;
|
||||
|
||||
--accent-color: 228, 216, 0;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #fff200;
|
||||
--link-color-hover: #fff200cc;
|
||||
--label-text-color: #000;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #e1d500; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #e1d500;
|
||||
--petio-spinner: invert(72%) sepia(97%) saturate(1218%) hue-rotate(10deg) brightness(102%) contrast(101%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 228, 216, 0;
|
||||
}
|
||||
30
CSS/variables/nord.css
Normal file
30
CSS/variables/nord.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: #2E3440;
|
||||
|
||||
--modal-bg-color: #3B4252;
|
||||
--modal-header-color: #434C5E;
|
||||
--modal-footer-color: #434C5E;
|
||||
|
||||
--drop-down-menu-bg: #3B4252;
|
||||
|
||||
--button-color: #79b8ca;
|
||||
--button-color-hover: #6a9daf;
|
||||
--button-text: #2E3440;
|
||||
--button-text-hover: #D8DEE9;
|
||||
|
||||
--accent-color: 121, 184, 202;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #81A1C1;
|
||||
--link-color-hover: #88C0D0;
|
||||
--label-text-color: #222730;
|
||||
|
||||
--text:#D8DEE9;
|
||||
--text-hover: #ECEFF4;
|
||||
--text-muted: #81A1C1;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #A3BE8C; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #D08770;
|
||||
--petio-spinner: invert(83%) sepia(9%) saturate(1787%) hue-rotate(156deg) brightness(85%) contrast(83%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 121, 184, 202;
|
||||
}
|
||||
31
CSS/variables/onedark.css
Normal file
31
CSS/variables/onedark.css
Normal file
@ -0,0 +1,31 @@
|
||||
:root {
|
||||
--main-bg-color: #282c34;
|
||||
|
||||
--modal-bg-color: #1e222a;
|
||||
--modal-header-color: #1e222a;
|
||||
--modal-footer-color: #1e222a;
|
||||
|
||||
--drop-down-menu-bg: #1e222a;
|
||||
|
||||
--button-color: #61afef;
|
||||
--button-color-hover: #c678dd;
|
||||
--button-text: #e2e4eb;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 152, 195, 121;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #61afef;
|
||||
--link-color-hover: #56b6c2;
|
||||
--label-text-color: #282c34;
|
||||
|
||||
--text:#abb2bf;
|
||||
--text-hover: #c8ccd4;
|
||||
--text-muted: #565c64;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #e5c07b; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #e06c75;
|
||||
--petio-spinner: invert(79%) sepia(27%) saturate(1033%) hue-rotate(74deg) brightness(104%) contrast(96%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 97, 175, 239;
|
||||
}
|
||||
|
||||
30
CSS/variables/organizr.css
Normal file
30
CSS/variables/organizr.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: #1f1f1f;
|
||||
|
||||
--modal-bg-color: #333;
|
||||
--modal-header-color: #232323;
|
||||
--modal-footer-color: #232323;
|
||||
|
||||
--drop-down-menu-bg: #1b1b1b;
|
||||
|
||||
--button-color: #2cabe3;
|
||||
--button-color-hover: #298fbc;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #fff;
|
||||
|
||||
--accent-color: 44, 171, 227;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #2cabe3;
|
||||
--link-color-hover: #3cc5ff;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#96a2b4;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #2cabe3; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #2cabe3;
|
||||
--petio-spinner: invert(65%) sepia(83%) saturate(2026%) hue-rotate(167deg) brightness(90%) contrast(97%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 44, 171, 227;
|
||||
}
|
||||
30
CSS/variables/overseerr.css
Normal file
30
CSS/variables/overseerr.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: linear-gradient(360deg, hsl(221, 39%, 11%) 65%, hsl(215, 28%, 17%) 100%);
|
||||
|
||||
--modal-bg-color: #1f2937;
|
||||
--modal-header-color: #1f2937;
|
||||
--modal-footer-color: #1f2937;
|
||||
|
||||
--drop-down-menu-bg: #374151;
|
||||
|
||||
--button-color: #4f46e5;
|
||||
--button-color-hover: #6366f1;
|
||||
--button-text: #e5e7eb;
|
||||
--button-text-hover: #fff;
|
||||
|
||||
--accent-color: 167, 139, 250;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #6366f1;
|
||||
--link-color-hover: #a78bfa;
|
||||
--label-text-color: #000;
|
||||
|
||||
--text: #d1d5db;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #9ca3af;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #6366f1; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #6366f1;
|
||||
--petio-spinner: invert(24%) sepia(59%) saturate(3411%) hue-rotate(237deg) brightness(91%) contrast(96%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 98, 116, 145;
|
||||
}
|
||||
32
CSS/variables/plex.css
Normal file
32
CSS/variables/plex.css
Normal file
@ -0,0 +1,32 @@
|
||||
:root {
|
||||
/* --main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed;
|
||||
*/
|
||||
--main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png") repeat scroll 0% 0%, radial-gradient(circle at 0% 100%, rgba(54, 66, 84, 0.55) 0%, rgba(54, 66, 84, 0.043) 70%, rgba(54, 66, 84, 0) 80%), radial-gradient(circle at 100% 100%, rgba(113, 135, 153, 0.55) 0%, rgba(113, 135, 153, 0.043) 70%, rgba(113, 135, 153, 0) 80%), radial-gradient(circle at 100% 0%, rgba(54, 66, 84, 0.55) 0%, rgba(54, 66, 84, 0.043) 70%, rgba(54, 66, 84, 0) 80%), radial-gradient(circle at 0% 0%, rgba(91, 114, 135, 0.55) 0%, rgba(91, 114, 135, 0.043) 70%, rgba(91, 114, 135, 0) 80%), rgb(0, 0, 0) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: #1f2326;
|
||||
--modal-header-color: #1f2326;
|
||||
--modal-footer-color: #323232;
|
||||
|
||||
--drop-down-menu-bg: #191a1c;
|
||||
|
||||
--button-color: #cc7b19;
|
||||
--button-color-hover: #e59029;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #fff;
|
||||
|
||||
--accent-color: 229, 160, 13;
|
||||
--accent-color-hover: #ffc107;
|
||||
--link-color: #e5a00d;
|
||||
--link-color-hover: #fff;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #27c24c; /* Servarr apps + Bazarr*/
|
||||
--petio-spinner: invert(0%) sepia(0%) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 193, 7;
|
||||
}
|
||||
30
CSS/variables/power.css
Normal file
30
CSS/variables/power.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(166, 40, 140, .7) 0%, rgba(11,8,51,1) 80%, rgba(0,0,0,1) 100%) center center/cover no-repeat fixed,
|
||||
url("https://theme-park.dev/Resources/power.jpg") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: linear-gradient(180deg, rgba(35, 0, 57, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: linear-gradient(180deg, rgba(35, 0, 57, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(180deg, rgba(35, 0, 57, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(180deg, rgba(35, 0, 57, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #85096b;
|
||||
--button-color-hover: #85096bcc;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 166, 40, 140;
|
||||
--accent-color-hover: rgba(var(--accent-color), 0.8);
|
||||
--link-color: rgb(223, 21, 179);
|
||||
--link-color-hover: rgb(255, 0, 200);
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: rgb(216, 22, 174); /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(216, 22, 174);
|
||||
--petio-spinner: invert(8%) sepia(62%) saturate(6812%) hue-rotate(304deg) brightness(108%) contrast(98%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 166, 40, 140;
|
||||
}
|
||||
27
CSS/variables/reality.css
Normal file
27
CSS/variables/reality.css
Normal file
@ -0,0 +1,27 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(232, 11, 11, 0.7) 0%, #08000d 80%, rgba(0,0,0,1) 100%) center center/cover no-repeat fixed,
|
||||
url("https://theme-park.dev/Resources/reality.jpg") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: linear-gradient(180deg, rgba(102, 5, 5, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: linear-gradient(180deg, rgba(102, 5, 5, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(180deg, rgba(102, 5, 5, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(180deg, rgba(102, 5, 5, 1) 0%, #000 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #e80c0b;
|
||||
--button-color-hover: #e80c0bcc;
|
||||
--accent-color: 232, 12, 11;
|
||||
--accent-color-hover: rgba(var(--accent-color), 0.8);
|
||||
--link-color: rgb(232, 12, 11);
|
||||
--link-color-hover: rgba(232, 12, 11,.8);
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #e80c0b; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(232, 12, 11);
|
||||
--petio-spinner: invert(14%) sepia(93%) saturate(3042%) hue-rotate(349deg) brightness(112%) contrast(116%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 232, 12, 11;
|
||||
}
|
||||
30
CSS/variables/soul.css
Normal file
30
CSS/variables/soul.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(255, 153, 0, .7) 0%, #3c0015 80%, rgba(0, 0, 0, 1) 100%) center center/cover no-repeat fixed,
|
||||
url("https://theme-park.dev/Resources/soul.jpg") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: linear-gradient(180deg, rgba(140, 64, 2, 1) 0%, #3c0015 100%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: linear-gradient(180deg, rgba(140, 64, 2, 1) 0%, #3c0015 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(180deg, rgba(140, 64, 2, 1) 0%, #3c0015 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(180deg, rgba(140, 64, 2, 1) 0%, #3c0015 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: rgb(255, 153, 0);
|
||||
--button-color-hover: #f90c;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 255, 153, 0;
|
||||
--accent-color-hover: rgba(var(--accent-color), 0.8);
|
||||
--link-color: rgb(255, 153, 0);
|
||||
--link-color-hover: rgb(255, 153, 0, 0.8);
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: rgb(255, 153, 0); /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #880030;
|
||||
--petio-spinner: invert(9%) sepia(44%) saturate(6901%) hue-rotate(327deg) brightness(101%) contrast(110%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 255, 153, 0;
|
||||
}
|
||||
30
CSS/variables/space-gray.css
Normal file
30
CSS/variables/space-gray.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
|
||||
--modal-bg-color: radial-gradient(ellipse at top, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
--modal-header-color: radial-gradient(ellipse at top, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: radial-gradient(ellipse at top, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: radial-gradient(ellipse at top, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #607D8B;
|
||||
--button-color-hover: #81a6b7;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #fff;
|
||||
|
||||
--accent-color: 129, 166, 183;
|
||||
--accent-color-hover: rgb(var(--accent-color),.8);
|
||||
--link-color: #81a6b7;
|
||||
--link-color-hover: #9adfff;
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#bbb;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #81a6b7; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: #70aeca;
|
||||
--petio-spinner: invert(50%) sepia(31%) saturate(341%) hue-rotate(155deg) brightness(88%) contrast(85%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 129, 166, 183;
|
||||
}
|
||||
30
CSS/variables/space.css
Normal file
30
CSS/variables/space.css
Normal file
@ -0,0 +1,30 @@
|
||||
:root {
|
||||
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(0, 98, 255, .7) 0%, #020013 80%, rgb(0, 0, 0) 100%) center center/cover no-repeat fixed,
|
||||
url("https://theme-park.dev/Resources/space.jpg") center center/cover no-repeat fixed;
|
||||
--modal-bg-color: linear-gradient(180deg, rgb(0, 57, 148) 0%, #10003c 100%) center center/cover no-repeat fixed;
|
||||
--modal-headercolor: linear-gradient(180deg, rgb(0, 57, 148) 0%, #10003c 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(180deg, rgb(0, 57, 148) 0%, #10003c 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(180deg, rgb(0, 57, 148) 0%, #10003c 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--button-color: #0062ff;
|
||||
--button-color-hover: #0062ffcc;
|
||||
--button-text: #eee;
|
||||
--button-text-hover: #FFF;
|
||||
|
||||
--accent-color: 0, 98, 255;
|
||||
--accent-color-hover: rgba(var(--accent-color), 0.8);
|
||||
--link-color: rgb(61, 126, 255);
|
||||
--link-color-hover: rgb(0, 98, 255);
|
||||
--label-text-color: #fff;
|
||||
|
||||
--text:#ddd;
|
||||
--text-hover: #fff;
|
||||
--text-muted: #999;
|
||||
|
||||
/*Specials*/
|
||||
--arr-queue-color: #0062ffcc; /* Servarr apps + Bazarr*/
|
||||
--plex-poster-unwatched: rgb(0, 98, 255);
|
||||
--petio-spinner: invert(25%) sepia(99%) saturate(4489%) hue-rotate(214deg) brightness(104%) contrast(109%); /* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
|
||||
--gitea-color-primary-dark-4: 0, 98, 255;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user