topaLE
/
theme.park
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

formatting

pull/241/head
Marius 4 years ago
parent
d7d4fa28fa
commit
a3377c35a8
45 changed files with 10430 additions and 7331 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 57
      CSS/themes/adguard/adguard-base.css
  2. 45
      CSS/themes/bazarr/bazarr-base.css
  3. 42
      CSS/themes/bitwarden/bitwarden-base.css
  4. 10
      CSS/themes/calibreweb/calibreweb-base.css
  5. 4713
      CSS/themes/deluge/deluge-base.css
  6. 12
      CSS/themes/dozzle/dozzle-base.css
  7. 3
      CSS/themes/duplicacy/duplicacy-base.css
  8. 206
      CSS/themes/emby/emby-base.css
  9. 30
      CSS/themes/flood/flood-base.css
  10. 8
      CSS/themes/gitea/gitea-base.css
  11. 1004
      CSS/themes/grafana/grafana-base.css
  12. 877
      CSS/themes/guacamole/guacamole-base.css
  13. 230
      CSS/themes/jellyfin/jellyfin-base.css
  14. 67
      CSS/themes/librespeed/librespeed-base.css
  15. 37
      CSS/themes/lidarr/lidarr-base.css
  16. 401
      CSS/themes/logarr/logarr-base.css
  17. 333
      CSS/themes/monitorr/monitorr-base.css
  18. 103
      CSS/themes/monitorr/organizr-dashboard.css
  19. 8
      CSS/themes/moviematch/moviematch-base.css
  20. 433
      CSS/themes/nzbget/nzbget-base.css
  21. 172
      CSS/themes/nzbhydra2/nzbhydra-base.css
  22. 57
      CSS/themes/ombi/ombi-base.css
  23. 726
      CSS/themes/ombi/ombiv3-base.css
  24. 1703
      CSS/themes/organizr/organizr-base-old.css
  25. 170
      CSS/themes/organizr/organizr-base.css
  26. 39
      CSS/themes/petio/petio-base.css
  27. 914
      CSS/themes/pihole/pihole-base.css
  28. 5
      CSS/themes/plex/plex-base.css
  29. 266
      CSS/themes/plpp/plpp-base.css
  30. 35
      CSS/themes/prowlarr/prowlarr-base.css
  31. 33
      CSS/themes/qbittorrent/qbittorrent-base.css
  32. 34
      CSS/themes/radarr/radarr-base.css
  33. 38
      CSS/themes/readarr/readarr-base.css
  34. 311
      CSS/themes/requestrr/requestrr-base.css
  35. 32
      CSS/themes/resilio-sync/resilio-base.css
  36. 2199
      CSS/themes/rutorrent/rutorrent-base.css
  37. 40
      CSS/themes/sonarr/sonarr-base.css
  38. 93
      CSS/themes/synclounge/synclounge-base.css
  39. 1056
      CSS/themes/tautulli/tautulli-base.css
  40. 94
      CSS/themes/thelounge/thelounge-base.css
  41. 998
      CSS/themes/transmission/transmission-base.css
  42. 39
      CSS/themes/unraid/unraid-base.css
  43. 50
      CSS/themes/vuetorrent/vuetorrent-base.css
  44. 8
      CSS/themes/webtools/webtools-base.css
  45. 30
      CSS/themes/xbackbone/xbackbone-base.css

57
CSS/themes/adguard/adguard-base.css
View File

@ -42,12 +42,15 @@ body {
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
body *::-webkit-scrollbar-thumb { body *::-webkit-scrollbar-thumb {
background: hsla(0,0%,100%,.2); background: hsla(0, 0%, 100%, .2);
} }
body *:hover::-webkit-scrollbar-thumb { body *:hover::-webkit-scrollbar-thumb {
background: hsla(0, 0%, 100%, 0.4); background: hsla(0, 0%, 100%, 0.4);
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 14px; width: 14px;
} }
@ -85,9 +88,22 @@ a:hover {
a:-webkit-any-link:focus { a:-webkit-any-link:focus {
outline: none; outline: none;
} }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
color: var(--text-hover) color: var(--text-hover)
} }
/* LOGIN PAGE */ /* LOGIN PAGE */
.login .login__form .text-center .h-6 { .login .login__form .text-center .h-6 {
@ -214,6 +230,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
background: rgb(var(--accent-color)); background: rgb(var(--accent-color));
color: var(--label-text-color); color: var(--label-text-color);
} }
.toast--success { .toast--success {
background-color: rgba(90, 173, 99, 0.75); background-color: rgba(90, 173, 99, 0.75);
} }
@ -277,7 +294,8 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
border-color: #F44336; border-color: #F44336;
} }
.btn-icon--green,.icon--green { .btn-icon--green,
.icon--green {
color: var(--button-color); color: var(--button-color);
} }
@ -307,6 +325,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
text-decoration: none; text-decoration: none;
background-color: rgb(255 255 255 / 0.08); background-color: rgb(255 255 255 / 0.08);
} }
.select__menu { .select__menu {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -318,17 +337,22 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
-o-background-size: auto, cover; -o-background-size: auto, cover;
box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .5); box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .5);
} }
.select__option:hover {
.select__option:hover {
background: rgba(255, 255, 255, .08) !important; background: rgba(255, 255, 255, .08) !important;
} }
.select__option {
.select__option {
background: rgba(0, 0, 0, 0) !important; background: rgba(0, 0, 0, 0) !important;
border-bottom: solid rgba(255, 255, 255, .1) 1px; border-bottom: solid rgba(255, 255, 255, .1) 1px;
} }
.select__multi-value__remove { .select__multi-value__remove {
color: black; color: black;
} }
.basic-multi-select .select__control--is-focused, .basic-multi-select .select__control--is-focused:hover {
.basic-multi-select .select__control--is-focused,
.basic-multi-select .select__control--is-focused:hover {
border-color: transparent !important; border-color: transparent !important;
} }
@ -340,6 +364,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
.setup__progress-wrap { .setup__progress-wrap {
background-color: rgb(0 0 0 / 50%); background-color: rgb(0 0 0 / 50%);
} }
.setup__logo { .setup__logo {
filter: invert(1); filter: invert(1);
} }
@ -376,7 +401,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
color: var(--text) color: var(--text)
} }
.logs__no-data{ .logs__no-data {
color: var(--text); color: var(--text);
background-color: transparent; background-color: transparent;
} }
@ -411,7 +436,8 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
background: rgba(255, 255, 255, 0.5); background: rgba(255, 255, 255, 0.5);
} }
.ReactTable .rt-thead .rt-th, .ReactTable .rt-thead .rt-td, .ReactTable .rt-thead .rt-th,
.ReactTable .rt-thead .rt-td,
.logs__cell--header__container { .logs__cell--header__container {
color: var(--text-hover); color: var(--text-hover);
} }
@ -420,7 +446,10 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
border-bottom: solid 1px rgb(255 255 255 / 20%); border-bottom: solid 1px rgb(255 255 255 / 20%);
} }
.table th, .text-wrap table th, .table td, .text-wrap table td { .table th,
.text-wrap table th,
.table td,
.text-wrap table td {
padding: 0.75rem; padding: 0.75rem;
vertical-align: top; vertical-align: top;
border-top: 1px solid rgba(255, 255, 255, 0.2); border-top: 1px solid rgba(255, 255, 255, 0.2);
@ -501,7 +530,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
border-color: transparent; border-color: transparent;
} }
.checkbox__input:checked + .checkbox__label:before { .checkbox__input:checked+.checkbox__label:before {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMi4zIDkuMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiPjxwYXRoIGQ9Ik0xMS44IDAuNUw1LjMgOC41IDAuNSA0LjIiLz48L3N2Zz4=); background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMi4zIDkuMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiPjxwYXRoIGQ9Ik0xMS44IDAuNUw1LjMgOC41IDAuNSA0LjIiLz48L3N2Zz4=);
background-color: rgb(var(--accent-color)); background-color: rgb(var(--accent-color));
@ -511,11 +540,13 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before { .custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
background-color: rgb(var(--accent-color)); background-color: rgb(var(--accent-color));
} }
.custom-control-input:focus~.custom-control-label::before, .custom-control-input:focus~.custom-control-label::before,
.custom-radio .custom-control-input:disabled:checked~.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); -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); box-shadow: 0 0 0 1px rgb(var(--accent-color)), 0 0 0 2px rgb(var(--accent-color), .25);
} }
/* MODALS */ /* MODALS */
.modal-content { .modal-content {
background: var(--modal-bg-color); background: var(--modal-bg-color);
@ -580,4 +611,4 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
::-webkit-input-placeholder { ::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }

45
CSS/themes/bazarr/bazarr-base.css
View File

@ -92,12 +92,20 @@ a:hover {
.table { .table {
color: var(--text); color: var(--text);
} }
.table thead th { .table thead th {
color: var(--text-hover); color: var(--text-hover);
} }
h1, h2, h3, h4, h5, h6, h1,
.custom-control-label,label,.modal-header { h2,
h3,
h4,
h5,
h6,
.custom-control-label,
label,
.modal-header {
color: var(--text-hover); color: var(--text-hover);
} }
@ -212,9 +220,10 @@ h1, h2, h3, h4, h5, h6,
background-color: transparent !important; background-color: transparent !important;
color: rgb(var(--accent-color)) !important; color: rgb(var(--accent-color)) !important;
} }
.content-header.bg-dark .btn-dark:hover { .content-header.bg-dark .btn-dark:hover {
color:rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
.sidebar-container .sidebar-button.sb-active, .sidebar-container .sidebar-button.sb-active,
.sidebar-container .sidebar-button.sb-active:hover { .sidebar-container .sidebar-button.sb-active:hover {
@ -231,10 +240,12 @@ h1, h2, h3, h4, h5, h6,
} }
.content-header.bg-dark .btn-dark { .content-header.bg-dark .btn-dark {
color:var(--text); color: var(--text);
} }
.btn-dark.disabled:hover, .btn-dark:disabled:hover {
color:var(--text) !important; .btn-dark.disabled:hover,
.btn-dark:disabled:hover {
color: var(--text) !important;
} }
@ -257,10 +268,12 @@ h1, h2, h3, h4, h5, h6,
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
.sidebar-container .badge-secondary { .sidebar-container .badge-secondary {
color: var(--label-text-color); color: var(--label-text-color);
background-color: var(--queue-color); background-color: var(--queue-color);
} }
/* TOP NAV BAR */ /* TOP NAV BAR */
.header-container .bg-primary { .header-container .bg-primary {
background-color: rgba(0, 0, 0, .35) !important; background-color: rgba(0, 0, 0, .35) !important;
@ -313,13 +326,16 @@ h1, h2, h3, h4, h5, h6,
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.auth-card { .auth-card {
border: 1px solid transparent; border: 1px solid transparent;
} }
.auth-card .card-footer { .auth-card .card-footer {
background-color: transparent; background-color: transparent;
border-top: 1px solid rgba(255, 255, 255, .1); border-top: 1px solid rgba(255, 255, 255, .1);
} }
hr { hr {
border-top: 1px solid rgb(255 255 255 / 10%); border-top: 1px solid rgb(255 255 255 / 10%);
} }
@ -642,6 +658,7 @@ hr {
.custom-checkbox .custom-control-input:checked~.custom-control-label:after { .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"); 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 { input {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
@ -658,7 +675,8 @@ input {
} }
/* DROPDOWN MENU */ /* DROPDOWN MENU */
.dropdown-menu,.dropdown-header { .dropdown-menu,
.dropdown-header {
color: var(--text); color: var(--text);
background: var(--drop-down-menu-bg); background: var(--drop-down-menu-bg);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -802,23 +820,24 @@ line {
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid rgba(0,0,0,.1); border: 1px solid rgba(0, 0, 0, .1);
box-shadow: 0 .25rem .75rem rgba(0,0,0,.1); box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .1);
color: var(--text) color: var(--text)
} }
.toast-header { .toast-header {
color: var(--text-hover); color: var(--text-hover);
background-color: hsla(0, 0%, 0%, .35); background-color: hsla(0, 0%, 0%, .35);
border-bottom: 1px solid rgba(0,0,0,.05); border-bottom: 1px solid rgba(0, 0, 0, .05);
} }
.alert-container .toast-container .toast .toast-body .progress .progress-bar { .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); 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 overflow: visible
} }
.progress-bar-striped { .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-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 background-size: 1rem 1rem
} }

42
CSS/themes/bitwarden/bitwarden-base.css
View File

@ -46,7 +46,7 @@ app-org-vault-groupings .card li.active>a:first-of-type,
app-org-vault-groupings .card li.active>div 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>a:first-of-type,
.groupings .card li.active>div a:first-of-type { .groupings .card li.active>div a:first-of-type {
color: var(--link-color-hover) !important; color: var(--link-color-hover) !important;
} }
/* TEXT */ /* TEXT */
@ -63,9 +63,23 @@ app-org-vault-groupings .card li.active>div a:first-of-type,
background-color: rgba(255, 255, 255, .08); 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 h1,
.card-header:first-child, h2,
.card-header, .modal-header { 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; color: var(--text-hover) !important;
} }
@ -73,7 +87,11 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,label,label:not(.form-check
.navbar { .navbar {
background-color: rgb(0 0 0 / 25%) !important; 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 {
.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)); color: rgb(var(--accent-color));
} }
@ -312,12 +330,13 @@ a.text-danger:focus {
.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.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, .show>.btn-outline-primary.dropdown-toggle:focus,
.btn-outline-secondary:focus, .btn-outline-secondary:focus,
.swal2-popup .swal2-actions button.swal2-cancel:focus, .swal2-popup .swal2-actions button.swal2-cancel:focus,
.btn-outline-secondary.focus, .btn-outline-secondary.focus,
.swal2-popup .swal2-actions button.focus.swal2-cancel, .swal2-popup .swal2-actions button.focus.swal2-cancel,
.btn-outline-primary:focus, .btn-outline-primary.focus { .btn-outline-primary:focus,
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color),.5); .btn-outline-primary.focus {
box-shadow: 0 0 0 0.2rem rgb(var(--accent-color), .5);
} }
.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled):active,
@ -381,6 +400,7 @@ app-vault-groupings .card .card-body a:hover.text-muted {
color: #fff !important; color: #fff !important;
opacity: 1 !important; opacity: 1 !important;
} }
app-vault-groupings .card li.active>a:first-of-type, 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 a:first-of-type,
app-org-vault-groupings .card li.active>a:first-of-type, app-org-vault-groupings .card li.active>a:first-of-type,
@ -393,6 +413,7 @@ app-org-vault-groupings .card li.active>div a:first-of-type {
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: #000; color: #000;
} }
@ -401,6 +422,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: #000; color: #000;
} }
@ -409,6 +431,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: #000; color: #000;
} }
@ -417,6 +440,7 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: #000; color: #000;
} }

10
CSS/themes/calibreweb/calibreweb-base.css
View File

@ -145,6 +145,7 @@
.modal-content { .modal-content {
background-color: var(--modal-bg-color); background-color: var(--modal-bg-color);
} }
#GeneralDeleteModal .bg-danger { #GeneralDeleteModal .bg-danger {
background: var(--modal-bg-color); background: var(--modal-bg-color);
} }
@ -173,7 +174,8 @@
.btn-toolbar>.btn-group>#btnGroupDrop2:hover>span, .btn-toolbar>.btn-group>#btnGroupDrop2:hover>span,
.btn-toolbar>.btn-group>.btn-group>#btnGroupDrop2:hover>span, .btn-toolbar>.btn-group>.btn-group>#btnGroupDrop2:hover>span,
div[aria-label="Edit/Delete book"]>.btn>span:hover, div[aria-label="Edit/Delete book"]>.btn>span:hover,
#btnGroupDrop1[aria-expanded=true] > span, #shelf-actions > .btn-group.open > #add-to-shelf > span { #btnGroupDrop1[aria-expanded=true]>span,
#shelf-actions>.btn-group.open>#add-to-shelf>span {
color: var(--text-hover); color: var(--text-hover);
} }
@ -304,7 +306,7 @@
/* SERIES PAGE */ /* SERIES PAGE */
.cover .badge { .cover .badge {
color: var(--label-text-color); color: var(--label-text-color);
background-color: rgb(var(--accent-color)); background-color: rgb(var(--accent-color));
} }

4713
CSS/themes/deluge/deluge-base.css
View File

File diff suppressed because it is too large

12
CSS/themes/dozzle/dozzle-base.css
View File

@ -27,7 +27,12 @@ body {
color: var(--text); color: var(--text);
} }
h1, h2, h3, h4, h5, h6, h1,
h2,
h3,
h4,
h5,
h6,
section header, section header,
.menu-label { .menu-label {
color: var(--text-hover) !important; color: var(--text-hover) !important;
@ -206,11 +211,12 @@ section .is-scrollbar-notification button {
color: var(--button-text-hover) !important; color: var(--button-text-hover) !important;
} }
#hide-nav{ #hide-nav {
background: var(--button-color) !important; background: var(--button-color) !important;
color: var(--button-text) !important; color: var(--button-text) !important;
} }
#hide-nav:hover{
#hide-nav:hover {
border-color: var(--button-color-hover) !important; border-color: var(--button-color-hover) !important;
background: var(--button-color-hover) !important; background: var(--button-color-hover) !important;
color: var(--button-text-hover) !important; color: var(--button-text-hover) !important;

3
CSS/themes/duplicacy/duplicacy-base.css
View File

@ -268,7 +268,8 @@ label {
background: rgb(0 0 0 / 10%); background: rgb(0 0 0 / 10%);
} }
.sidebar[data-background-color="black"] .logo, .off-canvas-sidebar[data-background-color="black"] .logo { .sidebar[data-background-color="black"] .logo,
.off-canvas-sidebar[data-background-color="black"] .logo {
border-bottom: 1px solid rgba(var(--accent-color)); border-bottom: 1px solid rgba(var(--accent-color));
} }

206
CSS/themes/emby/emby-base.css
View File

@ -1,18 +1,22 @@
/*TP CUSTOM */ /*TP CUSTOM */
h1,h2, h3, h4, h5, h6, h1,
.inputLabel, label { h2,
h3,
h4,
h5,
h6,
.inputLabel,
label {
color: var(--text-hover); color: var(--text-hover);
} }
a:not(.emby-button), a:not(.emby-button),
.cardText.cardTextCentered.cardText-first > button { .cardText.cardTextCentered.cardText-first>button {
color: var(--link-color) !important; color: var(--link-color) !important;
} }
a:hover:not(.emby-button), a:hover:not(.emby-button),
.cardText.cardTextCentered.cardText-first > button:hover .cardText.cardTextCentered.cardText-first>button:hover {
{
color: var(--link-color-hover) !important; color: var(--link-color-hover) !important;
} }
@ -24,7 +28,7 @@ html {
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: var(--line-background)!important border-color: var(--line-background) !important
} }
.skinHeader-withBackground.skinHeader-withfulldrawer { .skinHeader-withBackground.skinHeader-withfulldrawer {
@ -42,7 +46,8 @@ html {
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.appfooter,.formDialogFooter:not(.formDialogFooter-clear) { .appfooter,
.formDialogFooter:not(.formDialogFooter-clear) {
background: var(--footer-background); background: var(--footer-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -52,6 +57,7 @@ html {
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.formDialogHeader:not(.formDialogHeader-clear) { .formDialogHeader:not(.formDialogHeader-clear) {
background: var(--modal-header-color); background: var(--modal-header-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -76,7 +82,7 @@ html {
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) { @supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
.skinHeader-withBackground { .skinHeader-withBackground {
background:var(--header-blur-background); background: var(--header-blur-background);
-webkit-backdrop-filter: saturate(1.8) blur(1.5em); -webkit-backdrop-filter: saturate(1.8) blur(1.5em);
backdrop-filter: saturate(1.8) blur(1.5em) backdrop-filter: saturate(1.8) blur(1.5em)
} }
@ -89,24 +95,25 @@ html {
} }
.skinHeader.semiTransparent { .skinHeader.semiTransparent {
-webkit-backdrop-filter: none!important; -webkit-backdrop-filter: none !important;
backdrop-filter: none!important; backdrop-filter: none !important;
background-color: rgba(0,0,0,.3); 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-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: -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: -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)); background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
-webkit-box-shadow: none!important; -webkit-box-shadow: none !important;
box-shadow: none!important; box-shadow: none !important;
border-bottom: 0; border-bottom: 0;
color: rgba(255,255,255,.87) color: rgba(255, 255, 255, .87)
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(https://theme-park.dev/Resources/emby/logowhite.png) background-image: url(https://theme-park.dev/Resources/emby/logowhite.png)
} }
.backgroundContainer,html { .backgroundContainer,
html {
background: var(--theme-background); background: var(--theme-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -118,12 +125,12 @@ html {
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
background-color: rgba(0,0,0,.83) background-color: rgba(0, 0, 0, .83)
} }
@media not all and (min-width: 50em) { @media not all and (min-width: 50em) {
.itemBackgroundContainer.withBackdrop { .itemBackgroundContainer.withBackdrop {
background :var(--theme-background); background: var(--theme-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
@ -134,25 +141,28 @@ html {
} }
} }
.paper-icon-button-light-tv:focus,.paper-icon-button-light:active { .paper-icon-button-light-tv:focus,
.paper-icon-button-light:active {
color: rgb(var(--theme-primary-color)); color: rgb(var(--theme-primary-color));
background-color: var(--theme-icon-focus-background) background-color: var(--theme-icon-focus-background)
} }
@media(hover: hover) and (pointer:fine) { @media(hover: hover) and (pointer:fine) {
.paper-icon-button-light:focus { .paper-icon-button-light:focus {
color:rgb(var(--theme-primary-color)); color: rgb(var(--theme-primary-color));
background-color: var(--theme-icon-focus-background) background-color: var(--theme-icon-focus-background)
} }
} }
.detailButton-icon,.fab,.raised { .detailButton-icon,
.fab,
.raised {
background: var(--button-color); background: var(--button-color);
color: var(--button-text); color: var(--button-text);
} }
.detailButton-icon { .detailButton-icon {
border-color: rgba(255,255,255,.3) border-color: rgba(255, 255, 255, .3)
} }
.emby-select-withcolor { .emby-select-withcolor {
@ -167,27 +177,33 @@ html {
} }
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) { @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); .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); -webkit-backdrop-filter: saturate(1.8) blur(1.5em);
backdrop-filter: saturate(1.8) blur(1.5em) backdrop-filter: saturate(1.8) blur(1.5em)
} }
.dialog-blur,.toast { .dialog-blur,
.toast {
color: #fff; color: #fff;
background: rgba(56,56,56,.76); background: rgba(56, 56, 56, .76);
-webkit-backdrop-filter: blur(2.5em) saturate(1.8); -webkit-backdrop-filter: blur(2.5em) saturate(1.8);
backdrop-filter: blur(2.5em) saturate(1.8); backdrop-filter: blur(2.5em) saturate(1.8);
-webkit-box-shadow: none!important; -webkit-box-shadow: none !important;
box-shadow: none!important box-shadow: none !important
} }
.toast-large { .toast-large {
color: rgba(255,255,255,.87) color: rgba(255, 255, 255, .87)
} }
} }
.fab:focus,.raised:focus { .fab:focus,
.raised:focus {
background: var(--button-color-hover); background: var(--button-color-hover);
color: var(--button-text-hover); color: var(--button-text-hover);
} }
@ -209,12 +225,12 @@ html {
} }
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: rgb(var(--theme-primary-color))!important border-color: rgb(var(--theme-primary-color)) !important
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: rgb(var(--theme-primary-color))!important; background-color: rgb(var(--theme-primary-color)) !important;
color: #fff!important color: #fff !important
} }
.checkboxLabel { .checkboxLabel {
@ -225,7 +241,9 @@ html {
background-color: var(--theme-icon-focus-background) background-color: var(--theme-icon-focus-background)
} }
.inputLabelFocused,.selectLabelFocused,.textareaLabelFocused { .inputLabelFocused,
.selectLabelFocused,
.textareaLabelFocused {
color: rgb(var(--accent-color)) color: rgb(var(--accent-color))
} }
@ -237,7 +255,8 @@ html {
color: rgb(var(--accent-color)) color: rgb(var(--accent-color))
} }
.paperList,.visualCardBox { .paperList,
.visualCardBox {
background-color: var(--card-background) background-color: var(--card-background)
} }
@ -245,12 +264,16 @@ html {
border: var(--line-size) solid var(--line-background) border: var(--line-size) solid var(--line-background)
} }
.fieldDescription,.listItemBodyText-secondary,.secondaryText { .fieldDescription,
.listItemBodyText-secondary,
.secondaryText {
color: var(--theme-body-secondary-text-color) color: var(--theme-body-secondary-text-color)
} }
.cardText-secondary { .cardText-secondary {
color: var(--text) color: var(--text)
} }
.cardText-first { .cardText-first {
color: var(--theme-text-color-opaque) color: var(--theme-text-color-opaque)
} }
@ -261,7 +284,7 @@ html {
@media(hover: hover) and (pointer:fine) { @media(hover: hover) and (pointer:fine) {
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color:rgba(255,255,255,.2) background-color: rgba(255, 255, 255, .2)
} }
} }
@ -269,8 +292,9 @@ html {
background: rgb(var(--theme-primary-color)); background: rgb(var(--theme-primary-color));
color: var(--label-text-color); color: var(--label-text-color);
} }
.itemSelectionCount { .itemSelectionCount {
color: var(--label-text-color)!important; color: var(--label-text-color) !important;
} }
@ -289,20 +313,20 @@ html {
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: rgb(var(--theme-primary-color)); background-color: rgb(var(--theme-primary-color));
color: #fff!important color: #fff !important
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c; background: #1c1c1c;
background: rgba(30,30,30,.9) background: rgba(30, 30, 30, .9)
} }
.listItem-border { .listItem-border {
border-color: var(--line-background)!important border-color: var(--line-background) !important
} }
.listItem-focusscale:focus { .listItem-focusscale:focus {
background: rgba(54,54,54,.8) background: rgba(54, 54, 54, .8)
} }
.progressring-spiner { .progressring-spiner {
@ -321,13 +345,15 @@ html {
color: #cb272a color: #cb272a
} }
.emby-input,.emby-textarea { .emby-input,
.emby-textarea {
color: inherit; color: inherit;
background: rgb(0 0 0 / 25%); background: rgb(0 0 0 / 25%);
border: var(--line-size) solid rgba(255, 255, 255, 0.1) border: var(--line-size) solid rgba(255, 255, 255, 0.1)
} }
.emby-input:focus,.emby-textarea:focus { .emby-input:focus,
.emby-textarea:focus {
border-color: rgb(var(--theme-primary-color)) border-color: rgb(var(--theme-primary-color))
} }
@ -338,8 +364,9 @@ html {
.emby-checkbox:checked+span:before { .emby-checkbox:checked+span:before {
border-color: rgb(var(--theme-primary-color)) !important; border-color: rgb(var(--theme-primary-color)) !important;
background-color: rgb(var(--theme-primary-color)) !important; background-color: rgb(var(--theme-primary-color)) !important;
} }
.checkboxLabel::after { .checkboxLabel::after {
color: var(--label-text-color); color: var(--label-text-color);
} }
@ -372,16 +399,17 @@ html {
@media(hover: hover) and (pointer:fine) { @media(hover: hover) and (pointer:fine) {
.navMenuOption:hover { .navMenuOption:hover {
background:#303030 background: #303030
} }
} }
.navMenuOption-selected { .navMenuOption-selected {
background-color: var(--theme-icon-focus-background)!important; background-color: var(--theme-icon-focus-background) !important;
color: rgb(var(--accent-color)) color: rgb(var(--accent-color))
} }
.emby-button-focusscale:focus,.emby-button-focusscale:focus .detailButton-icon { .emby-button-focusscale:focus,
.emby-button-focusscale:focus .detailButton-icon {
background: rgb(var(--theme-primary-color)); background: rgb(var(--theme-primary-color));
color: #fff color: #fff
} }
@ -407,7 +435,9 @@ html {
outline-color: rgb(var(--theme-primary-color)) outline-color: rgb(var(--theme-primary-color))
} }
.channelCell,.guide-headerTimeslots,.timeslotHeaders { .channelCell,
.guide-headerTimeslots,
.timeslotHeaders {
background: var(--theme-background); background: var(--theme-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -420,7 +450,7 @@ html {
@media (pointer: coarse) { @media (pointer: coarse) {
.channelCell-mobilefocus { .channelCell-mobilefocus {
background:var(--theme-background)!important; background: var(--theme-background) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
@ -432,7 +462,7 @@ html {
} }
.channelCell-mobilefocus:not(:focus-visible) { .channelCell-mobilefocus:not(:focus-visible) {
background: var(--theme-background)!important; background: var(--theme-background) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
@ -443,7 +473,7 @@ html {
} }
.channelCell-mobilefocus:not(:-moz-focusring) { .channelCell-mobilefocus:not(:-moz-focusring) {
background: var(--theme-background)!important; background: var(--theme-background) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
@ -453,8 +483,10 @@ html {
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.channelCell,.epgRow,.programCell { .channelCell,
border-color: rgba(255,255,255,.05) .epgRow,
.programCell {
border-color: rgba(255, 255, 255, .05)
} }
.guide-currentTimeIndicatorDot { .guide-currentTimeIndicatorDot {
@ -470,22 +502,23 @@ html {
} }
.programCell-sports { .programCell-sports {
background: #3949ab!important background: #3949ab !important
} }
.programCell-movie { .programCell-movie {
background: #5e35b1!important background: #5e35b1 !important
} }
.programCell-kids { .programCell-kids {
background: #039be5!important background: #039be5 !important
} }
.programCell-news { .programCell-news {
background: #43a047!important background: #43a047 !important
} }
.channelCell:focus,.programCell:focus { .channelCell:focus,
.programCell:focus {
background-color: rgb(var(--theme-primary-color)); background-color: rgb(var(--theme-primary-color));
color: #fff color: #fff
} }
@ -503,7 +536,7 @@ html {
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33!important color: #c33 !important
} }
.downloadbutton-icon-on { .downloadbutton-icon-on {
@ -515,7 +548,7 @@ html {
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33!important color: #c33 !important
} }
.repeatButton-active { .repeatButton-active {
@ -561,7 +594,8 @@ html {
.cardOverlayButtonIcon { .cardOverlayButtonIcon {
background-color: rgb(var(--theme-primary-color)) background-color: rgb(var(--theme-primary-color))
} }
.cardScalable.cardPadder-portrait > div > button > i{
.cardScalable.cardPadder-portrait>div>button>i {
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -607,11 +641,11 @@ html {
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: #fff;
background: rgba(20,20,20,.5) background: rgba(20, 20, 20, .5)
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33!important color: #c33 !important
} }
.drawerLogo { .drawerLogo {
@ -624,16 +658,16 @@ html {
} }
.emby-search-tab-button.emby-tab-button-active { .emby-search-tab-button.emby-tab-button-active {
background: rgb(var(--accent-color))!important background: rgb(var(--accent-color)) !important
} }
.textActionButton.dragging { .textActionButton.dragging {
background: var(--button-background)!important background: var(--button-background) !important
} }
.dragging-over.full-drop-target { .dragging-over.full-drop-target {
background: rgb(var(--theme-primary-color))!important; background: rgb(var(--theme-primary-color)) !important;
color: #fff!important color: #fff !important
} }
.dragging-over-top:before { .dragging-over-top:before {
@ -649,17 +683,17 @@ html {
background: 0 !important; background: 0 !important;
color: var(--accent-color-hover); color: var(--accent-color-hover);
} }
} }
.mainDrawer { .mainDrawer {
background: var(--header-blur-background); background: var(--header-blur-background);
-webkit-backdrop-filter: saturate(1.8) blur(1.5em); -webkit-backdrop-filter: saturate(1.8) blur(1.5em);
backdrop-filter: saturate(1.8) blur(1.5em); backdrop-filter: saturate(1.8) blur(1.5em);
} }
.jstree-default .jstree-clicked { .jstree-default .jstree-clicked {
background: rgb(var(--accent-color)); background: rgb(var(--accent-color));
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
border-radius: 2px; border-radius: 2px;
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }

30
CSS/themes/flood/flood-base.css
View File

@ -54,8 +54,18 @@ h4,
h5, h5,
h6, h6,
p, 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 .inverse .h1,
.dark .torrents__alert, .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 { .torrents__alert {
color: var(--text-hover); color: var(--text-hover);
} }
@ -341,6 +351,7 @@ p,
color: #39ce83; color: #39ce83;
font-weight: 500; font-weight: 500;
} }
.dark .torrent--is-condensed.torrent--is-selected .torrent__detail, .dark .torrent--is-condensed.torrent--is-selected .torrent__detail,
.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, .dark .torrent--is-condensed.torrent--is-selected.torrent--is-stopped .torrent__detail,
@ -414,8 +425,7 @@ p,
.dark .torrent-details__table__heading--primary, .dark .torrent-details__table__heading--primary,
.torrent-details__table__heading--primary, .torrent-details__table__heading--primary,
.dark .torrent-details__table__heading--secondary .dark .torrent-details__table__heading--secondary .torrent-details__table__heading--secondary,
.torrent-details__table__heading--secondary,
.dark .torrent-details__table__heading--tertiary, .dark .torrent-details__table__heading--tertiary,
.torrent-details__table__heading--tertiary { .torrent-details__table__heading--tertiary {
color: var(--text-hover); color: var(--text-hover);
@ -480,9 +490,13 @@ p,
box-shadow: 1px 0 hsl(0deg 0% 100% / 12%); box-shadow: 1px 0 hsl(0deg 0% 100% / 12%);
color: var(--text); color: var(--text);
} }
.sidebar-filter__item--heading, .sidebar-filter__item--heading:focus-visible, .sidebar-filter__item--heading:hover {
.sidebar-filter__item--heading,
.sidebar-filter__item--heading:focus-visible,
.sidebar-filter__item--heading:hover {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
.dark .sidebar-filter__item, .dark .sidebar-filter__item,
.sidebar-filter__item { .sidebar-filter__item {
color: var(--text); color: var(--text);
@ -515,9 +529,9 @@ p,
color: var(--label-text-color); color: var(--label-text-color);
} }
.dark .sidebar-filter__item:focus-visible .icon, .dark .sidebar-filter__item:focus-visible .icon,
.dark .sidebar-filter__item:hover .icon, .dark .sidebar-filter__item:hover .icon,
.sidebar-filter__item:focus-visible .icon, .sidebar-filter__item:focus-visible .icon,
.sidebar-filter__item:hover .icon { .sidebar-filter__item:hover .icon {
fill: rgb(var(--accent-color)); fill: rgb(var(--accent-color));
} }
@ -565,6 +579,7 @@ p,
.torrent--is-selected.torrent--is-stopped .progress-bar__icon .icon { .torrent--is-selected.torrent--is-stopped .progress-bar__icon .icon {
color: #ffffff; color: #ffffff;
} }
.torrent--is-selected.torrent--is-stopped .progress-bar__fill { .torrent--is-selected.torrent--is-stopped .progress-bar__fill {
background: #ffffff; background: #ffffff;
} }
@ -629,6 +644,7 @@ p,
.modal__tabs .modal__tab.is-active:after { .modal__tabs .modal__tab.is-active:after {
background: rgb(var(--accent-color)); background: rgb(var(--accent-color));
} }
.modal--vertical .modal__tabs .modal__tab:after { .modal--vertical .modal__tabs .modal__tab:after {
width: 3px; width: 3px;
} }

8
CSS/themes/gitea/gitea-base.css
View File

@ -167,8 +167,7 @@ h4,
h5, h5,
h6, h6,
.ui.header, .ui.header,
.ui.header .sub.header .ui.header .sub.header {
{
color: var(--text-hover); color: var(--text-hover);
} }
@ -324,6 +323,7 @@ b:hover,
color: var(--text-hover); color: var(--text-hover);
box-shadow: none; box-shadow: none;
} }
.feeds .list ul li:not(:last-child) { .feeds .list ul li:not(:last-child) {
border-bottom: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.1);
} }
@ -428,6 +428,7 @@ b:hover,
.ui.menu.new-menu { .ui.menu.new-menu {
background: rgb(0 0 0 / 25%); background: rgb(0 0 0 / 25%);
} }
.ui.menu.new-menu::after { .ui.menu.new-menu::after {
background: transparent; background: transparent;
} }
@ -974,7 +975,8 @@ a.ui.card:hover {
.ui.blue.labels .label, .ui.blue.labels .label,
.ui.ui.ui.blue.label, .ui.ui.ui.blue.label,
.ui.grey.labels .label, .ui.ui.ui.grey.label { .ui.grey.labels .label,
.ui.ui.ui.grey.label {
background-color: rgb(var(--accent-color)) !important; background-color: rgb(var(--accent-color)) !important;
border-color: rgb(var(--accent-color)) !important; border-color: rgb(var(--accent-color)) !important;
color: var(--label-text-color); color: var(--label-text-color);

1004
CSS/themes/grafana/grafana-base.css
View File

File diff suppressed because it is too large

877
CSS/themes/guacamole/guacamole-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -15,33 +14,43 @@
* { * {
outline: none !important; outline: none !important;
} }
h1,h2,h3,h4,h5,h6 {
h1,
h2,
h3,
h4,
h5,
h6 {
color: var(--text-hover); color: var(--text-hover);
} }
body {
body {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color:var(--text) !important; color: var(--text) !important;
} }
div.displayMiddle {
background: var(--modal-bg-color); div.displayMiddle {
background-repeat: repeat, no-repeat; background: var(--modal-bg-color);
background-attachment: fixed, fixed; background-repeat: repeat, no-repeat;
background-position: center center, center center; background-attachment: fixed, fixed;
background-size: auto, cover; background-position: center center, center center;
-webkit-background-size: auto, cover; background-size: auto, cover;
-moz-background-size: auto, cover; -webkit-background-size: auto, cover;
-o-background-size: auto, cover; -moz-background-size: auto, cover;
} -o-background-size: auto, cover;
}
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text) !important; color: var(--text) !important;
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
@ -50,6 +59,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text) !important; color: var(--text) !important;
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
@ -58,6 +68,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text) !important; color: var(--text) !important;
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
@ -66,204 +77,267 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text) !important; color: var(--text) !important;
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
/* Scrollbar */
@media only screen and (min-width: 768px) { /* Scrollbar */
html { @media only screen and (min-width: 768px) {
height: 100%; html {
width: 100%; height: 100%;
overflow: hidden; width: 100%;
} overflow: hidden;
body { }
overflow-y: auto;
height: 100%; body {
background: var(--main-bg-color); overflow-y: auto;
background-repeat: repeat, no-repeat; height: 100%;
background-attachment: fixed, fixed; background: var(--main-bg-color);
background-position: center center, center center; background-repeat: repeat, no-repeat;
background-size: auto, cover; background-attachment: fixed, fixed;
-webkit-background-size: auto, cover; background-position: center center, center center;
-moz-background-size: auto, cover; background-size: auto, cover;
-o-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 { ::-webkit-scrollbar {
min-height: 50px; width: 14px;
border: 3px solid transparent; }
border-radius: 8px;
background-color: hsla(0,0%,100%,.2); ::-webkit-scrollbar-thumb {
background-clip: padding-box; min-height: 50px;
} border: 3px solid transparent;
::-webkit-scrollbar-track { border-radius: 8px;
background-color: transparent; background-color: hsla(0, 0%, 100%, .2);
} background-clip: padding-box;
::-webkit-scrollbar-thumb:hover { }
min-height: 50px;
border: 3px solid transparent; ::-webkit-scrollbar-track {
border-radius: 8px; background-color: transparent;
background-color: hsla(0,0%,100%,.5); }
background-clip: padding-box;
} ::-webkit-scrollbar-thumb:hover {
/* LOGIN MENU */ min-height: 50px;
div.login-ui { border: 3px solid transparent;
background: inherit; border-radius: 8px;
} background-color: hsla(0, 0%, 100%, .5);
.login-ui div.login-dialog { background-clip: padding-box;
background: rgba(0, 0, 0, .25); }
border: none;
} /* LOGIN MENU */
input[type="submit"], button, a.button { div.login-ui {
background-color: var(--button-color); background: inherit;
border: none; }
outline: none;
} .login-ui div.login-dialog {
input[type="submit"]:hover, button:hover, a.button:hover { background: rgba(0, 0, 0, .25);
background-color: var(--button-color-hover); border: none;
border: none; }
cursor: pointer;
} input[type="submit"],
.login-ui .login-fields .labeled-field input:focus { button,
background: rgba(0,0,0,0.45) !important; a.button {
outline: none; background-color: var(--button-color);
} border: none;
.login-ui .login-fields .labeled-field.empty input { outline: none;
background: rgba(0,0,0,0.25) !important; }
outline: none;
} input[type="submit"]:hover,
.login-ui .login-fields .labeled-field.empty input:focus { button:hover,
background: rgba(0,0,0,0.45) !important; a.button:hover {
outline: none; background-color: var(--button-color-hover);
} border: none;
.login-ui .login-dialog .login-fields input { cursor: pointer;
background-color: rgba(0,0,0,0.45) !important; }
}
div.location, input[type=text], input[type=email], input[type=number], input[type=password], textarea { .login-ui .login-fields .labeled-field input:focus {
color: white !important; background: rgba(0, 0, 0, 0.45) !important;
background: rgba(0, 0, 0, 0.25) !important; outline: none;
} }
input[type=checkbox], input[type=number], input[type=text], input[type=email], input[type=radio], textarea {
color: var(--text-hover) !important; .login-ui .login-fields .labeled-field.empty input {
background: transparent; background: rgba(0, 0, 0, 0.25) !important;
} outline: none;
}
/* HOME MENU */
.header h2 { .login-ui .login-fields .labeled-field.empty input:focus {
color: var(--text-hover); background: rgba(0, 0, 0, 0.45) !important;
background-color: rgba(0, 0, 0, 0.25); outline: none;
} }
.connection .icon.vnc, .connection .icon.rdp { .login-ui .login-dialog .login-fields input {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-monitor.png); background-color: rgba(0, 0, 0, 0.45) !important;
} }
.connection .icon.ssh, .connection .icon.telnet {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-text.png); div.location,
} input[type=text],
input[type=email],
.user-menu .menu-dropdown .menu-title { input[type=number],
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-user.png); input[type=password],
background-color: transparent; textarea {
} color: white !important;
.user-menu .menu-dropdown .menu-contents li a[href="#/"] { background: rgba(0, 0, 0, 0.25) !important;
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"] { input[type=checkbox],
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-config-dark.png); input[type=number],
} input[type=text],
.user-menu .menu-dropdown .menu-contents li a.logout { input[type=email],
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-logout-dark.png); input[type=radio],
} textarea {
.icon.user { color: var(--text-hover) !important;
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-user.png); background: transparent;
} }
.pager .icon.first-page {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-first-page.png); /* HOME MENU */
} .header h2 {
.pager .icon.prev-page { color: var(--text-hover);
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-prev-page.png); background-color: rgba(0, 0, 0, 0.25);
} }
.pager .icon.next-page {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-next-page.png); .connection .icon.vnc,
} .connection .icon.rdp {
.pager .icon.last-page { background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-monitor.png);
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-last-page.png); }
}
.loading::before{ .connection .icon.ssh,
background-image:url('https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/cog.png'); .connection .icon.telnet {
} background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-text.png);
table.sorted th.sort-primary.sort-descending:after { }
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/up.png);
} .user-menu .menu-dropdown .menu-title {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-user.png);
.menu-dropdown .menu-indicator { background-color: transparent;
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/down.png); }
}
.menu-dropdown .menu-indicator:hover { .user-menu .menu-dropdown .menu-contents li a[href="#/"] {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/down.png); background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-home-dark.png);
color: #f9be03; }
}
table.sorted th.sort-primary:after { .user-menu .menu-dropdown .menu-contents li a[href="#/settings/users"],
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/down.png); .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"] {
thead { background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/guac-config-dark.png);
color: var(--text-hover); }
}
table.sorted th, table.sorted td { .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%); border: 1px solid rgb(255 255 255 / 15%);
} }
.settings table.session-list tr.session:hover { .settings table.session-list tr.session:hover {
background: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.15);
} }
.menu-dropdown.open, .menu-dropdown.open:hover {
background: rgba(0, 0, 0, 0.25); .menu-dropdown.open,
} .menu-dropdown.open:hover {
.menu-dropdown { background: rgba(0, 0, 0, 0.25);
border-left: none; }
background: rgba(0, 0, 0, 0.25);
} .menu-dropdown {
.menu-dropdown .menu-contents li a { border-left: none;
display: block; background: rgba(0, 0, 0, 0.25);
cursor: pointer; }
color: var(--text);
text-decoration: none; .menu-dropdown .menu-contents li a {
padding: .75em; display: block;
} cursor: pointer;
.menu-dropdown .menu-contents li a.current, .menu-dropdown .menu-contents li a.current:hover { color: var(--text);
background-color: rgba(0,0,0,.25); text-decoration: none;
color:var(--text-hover) padding: .75em;
} }
.menu-dropdown .menu-contents li a:hover {
background-color: rgba(0,0,0,.25); .menu-dropdown .menu-contents li a.current,
color: var(--text-hover); .menu-dropdown .menu-contents li a.current:hover {
} background-color: rgba(0, 0, 0, .25);
.menu-dropdown:hover { color: var(--text-hover)
background: rgba(0, 0, 0, 0.25); }
color: var(--text-hover);
} .menu-dropdown .menu-contents li a:hover {
background-color: rgba(0, 0, 0, .25);
.menu-dropdown .menu-contents { 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); background: var(--drop-down-menu-bg);
} }
.header .filter input {
-moz-border-radius: 0; .header .filter input {
-webkit-border-radius: 0; -moz-border-radius: 0;
-khtml-border-radius: 0; -webkit-border-radius: 0;
border-radius: 0; -khtml-border-radius: 0;
border: 0; border-radius: 0;
border-left: 1px solid rgba(0,0,0,0.125); border: 0;
background-color: transparent; border-left: 1px solid rgba(0, 0, 0, 0.125);
color: var(--text-hover); background-color: transparent;
} color: var(--text-hover);
.header .filter { }
background-color: rgba(0, 0, 0, 0.25);
} .header .filter {
.filter .search-string { 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-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/magnifier.png) !important;
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
background-size: 1.75em !important; background-size: 1.75em !important;
@ -274,34 +348,46 @@ input:focus:-ms-input-placeholder {
max-width: none; max-width: none;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: 0; border: 0;
} }
div.location, input[type=text], input[type=email], input[type=number], input[type=password], textarea {
color: var(--text-hover); div.location,
} input[type=text],
input[type=email],
input[type=number],
.user a:visited, .connection a:visited, .connection-group a:visited { input[type=password],
text-decoration: none; textarea {
color: var(--link-color-hover); color: var(--text-hover);
} }
.recent-connections .connection:hover {
background: hsla(0, 0%, 100%, 0.08);
color: var(--link-color-hover); .user a:visited,
} .connection a:visited,
.list-item:not(.selected) .caption:hover { .connection-group a:visited {
background: hsla(0, 0%, 100%, 0.07); text-decoration: none;
color: var(--link-color-hover); color: var(--link-color-hover);
} }
.list-item .name {
color: var(--link-color); .recent-connections .connection:hover {
} background: hsla(0, 0%, 100%, 0.08);
.list-item:not(.selected) .caption:hover .name {
color: var(--link-color-hover); color: var(--link-color-hover);
} }
/* SIDE MENU */ .list-item:not(.selected) .caption:hover {
.menu, .menu .header { 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: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -309,10 +395,13 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
box-shadow: none; box-shadow: none;
} }
.menu-content, .menu-content .header, .menu-body {
.menu-content,
.menu-content .header,
.menu-body {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -320,135 +409,184 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.clipboard, .clipboard-service-target {
background: rgba(0, 0, 0, 0.25); .clipboard,
color: white; .clipboard-service-target {
} background: rgba(0, 0, 0, 0.25);
/* NOTIFICATION BOX */ color: white;
.notification.error { }
background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; /* NOTIFICATION BOX */
background-attachment: fixed, fixed; .notification.error {
background-position: center center, center center; background: var(--modal-bg-color);
background-size: auto, cover; background-repeat: repeat, no-repeat;
-webkit-background-size: auto, cover; background-attachment: fixed, fixed;
-moz-background-size: auto, cover; background-position: center center, center center;
-o-background-size: auto, cover; background-size: auto, cover;
color: white; -webkit-background-size: auto, cover;
} -moz-background-size: auto, cover;
.notification { -o-background-size: auto, cover;
background: var(--modal-bg-color); color: white;
background-repeat: repeat, no-repeat; }
background-attachment: fixed, fixed;
background-position: center center, center center; .notification {
background-size: auto, cover; background: var(--modal-bg-color);
-webkit-background-size: auto, cover; background-repeat: repeat, no-repeat;
-moz-background-size: auto, cover; background-attachment: fixed, fixed;
-o-background-size: auto, cover; background-position: center center, center center;
color: white; background-size: auto, cover;
} -webkit-background-size: auto, cover;
-moz-background-size: auto, cover;
/* SETTINGS */ -o-background-size: auto, cover;
.page-tabs .page-list li a[href]:visited { color: white;
color: white; }
}
.page-tabs .page-list li a[href] { /* SETTINGS */
color: white; .page-tabs .page-list li a[href]:visited {
} color: white;
.page-tabs .page-list li a[href]:hover { }
background-color: rgba(0, 0, 0, 0.25);
} .page-tabs .page-list li a[href] {
.user a:visited, .connection a:visited, .connection-group a:visited { color: white;
text-decoration: none; }
color: var(--link-color);
} .page-tabs .page-list li a[href]:hover {
.user a:hover, .user-group a:hover, .connection a:hover, .connection-group a:hover, a.ng-binding:hover:not(.add-user):not(.button) { 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; color: var(--link-color-hover) !important;
} }
.user a, .connection a, .connection-group a, a.ng-binding:not(.add-user):not(.button){
text-decoration: none; .user a,
color: var(--link-color); .connection a,
} .connection-group a,
div.location, input[type=text], input[type=email], input[type=number], input[type=password], textarea { a.ng-binding:not(.add-user):not(.button) {
border: 0; text-decoration: none;
background: rgba(0, 0, 0, .25); color: var(--link-color);
} }
.location-chooser .dropdown {
background: #666; div.location,
} input[type=text],
/* USER SETTINGS */ input[type=email],
.page-tabs .page-list li a[href], .section-tabs li a { input[type=number],
color: var(--text) !important; input[type=password],
} textarea {
.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 { border: 0;
background: rgba(0,0,0,0.25); 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; cursor: default;
color: rgb(var(--accent-color)) !important; 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); .page-tabs .page-list li a[href]:hover,
color: var(--text-hover) !important; .section-tabs li a:hover {
} background-color: hsla(0, 0%, 100%, 0.07);
.manage-user .page-tabs .page-list li.linked a[href]:before { color: var(--text-hover) !important;
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 { .manage-user .page-tabs .page-list li.linked a[href]:before {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/lock.png); background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/guacamole/checkmark.png);
} }
.manage-user .notice.read-only {
background: hsla(0, 0%, 100%, 0.07); .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);
/* DUA 2FA PAGE */ }
.duo-signature-response-field {
background: var(--modal-bg-color) !important; .manage-user .notice.read-only {
background-repeat: repeat, no-repeat; background: hsla(0, 0%, 100%, 0.07);
background-attachment: fixed, fixed; }
background-position: center center, center center;
background-size: auto, cover; /* DUA 2FA PAGE */
-webkit-background-size: auto, cover; .duo-signature-response-field {
-moz-background-size: auto, cover; background: var(--modal-bg-color) !important;
-o-background-size: auto, cover; background-repeat: repeat, no-repeat;
} background-attachment: fixed, fixed;
.base-wrapper { background-position: center center, center center;
border: 1px solid transparent !important; background-size: auto, cover;
background: var(--modal-bg-color) !important; -webkit-background-size: auto, cover;
background-repeat: repeat, no-repeat; -moz-background-size: auto, cover;
background-attachment: fixed, fixed; -o-background-size: auto, cover;
background-position: center center, center center; }
background-size: auto, cover;
-webkit-background-size: auto, cover; .base-wrapper {
-moz-background-size: auto, cover; border: 1px solid transparent !important;
-o-background-size: auto, cover; background: var(--modal-bg-color) !important;
} background-repeat: repeat, no-repeat;
.base-body { background-attachment: fixed, fixed;
background-color: #333 !important; background-position: center center, center center;
} background-size: auto, cover;
h1.spacious-frame-view { -webkit-background-size: auto, cover;
color: var(--text-hover) !important; -moz-background-size: auto, cover;
} -o-background-size: auto, cover;
@media screen and (-webkit-max-device-pixel-ratio: 1.25), screen and (max-resolution: 120dpi) { }
h1, .h1 {
color: var(--text-hover) !important; .base-body {
} background-color: #333 !important;
} }
.white-wrapper {
background-color: #333 !important; h1.spacious-frame-view {
color: var(--text) !important; color: var(--text-hover) !important;
} }
form:not(.inline) fieldset {
background-color: #333 !important; @media screen and (-webkit-max-device-pixel-ratio: 1.25),
} screen and (max-resolution: 120dpi) {
label span {
color: white !important; h1,
} .h1 {
input[type=radio] { color: var(--text-hover) !important;
border: 1px solid var(--text-hover) !important; }
} }
/* Connection */
.white-wrapper {
#connection-warning { 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: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -456,9 +594,10 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
/* File Transfer */ /* File Transfer */
#file-transfer-dialog .transfer-manager { #file-transfer-dialog .transfer-manager {
background: var(--modal-bg-color); background: var(--modal-bg-color);
@ -468,14 +607,17 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.transfer.error { .transfer.error {
background: rgba(244, 67, 54, 0.5) ; background: rgba(244, 67, 54, 0.5);
} }
.transfer-manager .header h2 { .transfer-manager .header h2 {
background-color: transparent ; background-color: transparent;
} }
.transfer .in-progress .progress { .transfer .in-progress .progress {
background-color: var(--modal-bg-color); background-color: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -484,7 +626,7 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.related-objects .abbreviated-related-objects ul li { .related-objects .abbreviated-related-objects ul li {
@ -494,6 +636,7 @@ input:focus:-ms-input-placeholder {
border: 1px solid rgb(var(--accent-color)); border: 1px solid rgb(var(--accent-color));
background: rgb(var(--accent-color)); background: rgb(var(--accent-color));
} }
.related-objects .abbreviated-related-objects ul li label span { .related-objects .abbreviated-related-objects ul li label span {
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }

230
CSS/themes/jellyfin/jellyfin-base.css
View File

@ -1,18 +1,22 @@
/*TP CUSTOM */ /*TP CUSTOM */
h1,h2, h3, h4, h5, h6, h1,
h2,
h3,
h4,
h5,
h6,
.inputLabel { .inputLabel {
color: var(--text-hover); color: var(--text-hover);
} }
a:not(.emby-button), a:not(.emby-button),
.cardText.cardTextCentered.cardText-first > button, .cardText.cardTextCentered.cardText-first>button,
.emby-linkbutton>a { .emby-linkbutton>a {
color: var(--link-color) !important; color: var(--link-color) !important;
} }
a:hover:not(.emby-button), a:hover:not(.emby-button),
.cardText.cardTextCentered.cardText-first > button:hover, .cardText.cardTextCentered.cardText-first>button:hover,
.emby-linkbutton>a:hover { .emby-linkbutton>a:hover {
color: var(--link-color-hover) !important; color: var(--link-color-hover) !important;
} }
@ -25,7 +29,7 @@ html {
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: var(--line-background)!important border-color: var(--line-background) !important
} }
.skinHeader-withBackground.skinHeader-withfulldrawer { .skinHeader-withBackground.skinHeader-withfulldrawer {
@ -43,7 +47,8 @@ html {
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.appfooter,.formDialogFooter:not(.formDialogFooter-clear) { .appfooter,
.formDialogFooter:not(.formDialogFooter-clear) {
background: var(--footer-background); background: var(--footer-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -53,6 +58,7 @@ html {
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.formDialogHeader:not(.formDialogHeader-clear) { .formDialogHeader:not(.formDialogHeader-clear) {
background: var(--modal-header-color); background: var(--modal-header-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -77,7 +83,7 @@ html {
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) { @supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
.skinHeader-withBackground { .skinHeader-withBackground {
background:var(--header-blur-background); background: var(--header-blur-background);
-webkit-backdrop-filter: saturate(1.8) blur(1.5em); -webkit-backdrop-filter: saturate(1.8) blur(1.5em);
backdrop-filter: saturate(1.8) blur(1.5em) backdrop-filter: saturate(1.8) blur(1.5em)
} }
@ -90,21 +96,22 @@ html {
} }
.skinHeader.semiTransparent { .skinHeader.semiTransparent {
-webkit-backdrop-filter: none!important; -webkit-backdrop-filter: none !important;
backdrop-filter: none!important; backdrop-filter: none !important;
background-color: rgba(0,0,0,.3); 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-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: -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: -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)); background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
-webkit-box-shadow: none!important; -webkit-box-shadow: none !important;
box-shadow: none!important; box-shadow: none !important;
border-bottom: 0; border-bottom: 0;
color: rgba(255,255,255,.87) color: rgba(255, 255, 255, .87)
} }
.backgroundContainer,html { .backgroundContainer,
html {
background: var(--theme-background); background: var(--theme-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -112,46 +119,48 @@ html {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
background-color: rgba(0,0,0,.83) background-color: rgba(0, 0, 0, .83)
} }
@media not all and (min-width: 50em) { @media not all and (min-width: 50em) {
.itemBackgroundContainer.withBackdrop { .itemBackgroundContainer.withBackdrop {
background :var(--theme-background); background: var(--theme-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
.paper-icon-button-light-tv:focus,.paper-icon-button-light:active { .paper-icon-button-light-tv:focus,
.paper-icon-button-light:active {
color: rgb(var(--theme-primary-color)); color: rgb(var(--theme-primary-color));
background-color: var(--theme-icon-focus-background) background-color: var(--theme-icon-focus-background)
} }
@media(hover: hover) and (pointer:fine) { @media(hover: hover) and (pointer:fine) {
.paper-icon-button-light:focus { .paper-icon-button-light:focus {
color:rgb(var(--theme-primary-color)); color: rgb(var(--theme-primary-color));
background-color: var(--theme-icon-focus-background) background-color: var(--theme-icon-focus-background)
} }
} }
.fab,.raised { .fab,
.raised {
background: var(--button-background); background: var(--button-background);
color: var(--theme-text-color) color: var(--theme-text-color)
} }
.detailButton-icon { .detailButton-icon {
background: none !important; background: none !important;
border-color: rgba(255,255,255,.3) border-color: rgba(255, 255, 255, .3)
} }
.emby-select-withcolor { .emby-select-withcolor {
@ -164,33 +173,41 @@ html {
background: var(--button-background); background: var(--button-background);
color: var(--theme-text-color) color: var(--theme-text-color)
} }
.dialog-blur, .toast {
.dialog-blur,
.toast {
background: var(--button-background) !important; background: var(--button-background) !important;
color: var(--theme-text-color) !important; color: var(--theme-text-color) !important;
} }
@supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) { @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); .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); -webkit-backdrop-filter: saturate(1.8) blur(1.5em);
backdrop-filter: saturate(1.8) blur(1.5em) backdrop-filter: saturate(1.8) blur(1.5em)
} }
.dialog-blur,.toast { .dialog-blur,
.toast {
color: #fff; color: #fff;
background: rgba(56,56,56,.76); background: rgba(56, 56, 56, .76);
-webkit-backdrop-filter: blur(2.5em) saturate(1.8); -webkit-backdrop-filter: blur(2.5em) saturate(1.8);
backdrop-filter: blur(2.5em) saturate(1.8); backdrop-filter: blur(2.5em) saturate(1.8);
-webkit-box-shadow: none!important; -webkit-box-shadow: none !important;
box-shadow: none!important box-shadow: none !important
} }
.toast-large { .toast-large {
color: rgba(255,255,255,.87) color: rgba(255, 255, 255, .87)
} }
} }
.fab:focus,.raised:focus { .fab:focus,
.raised:focus {
background: var(--button-color-hover); background: var(--button-color-hover);
color: var(--button-text-hover); color: var(--button-text-hover);
} }
@ -211,12 +228,12 @@ html {
} }
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: rgb(var(--theme-primary-color))!important border-color: rgb(var(--theme-primary-color)) !important
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: rgb(var(--theme-primary-color))!important; background-color: rgb(var(--theme-primary-color)) !important;
color: var(--label-text-color)!important color: var(--label-text-color) !important
} }
.checkboxLabel { .checkboxLabel {
@ -227,7 +244,9 @@ html {
background-color: var(--theme-icon-focus-background) background-color: var(--theme-icon-focus-background)
} }
.inputLabelFocused,.selectLabelFocused,.textareaLabelFocused { .inputLabelFocused,
.selectLabelFocused,
.textareaLabelFocused {
color: rgb(var(--accent-color)) color: rgb(var(--accent-color))
} }
@ -243,7 +262,8 @@ html {
color: rgb(var(--accent-color)) color: rgb(var(--accent-color))
} }
.paperList,.visualCardBox { .paperList,
.visualCardBox {
background-color: var(--card-background) background-color: var(--card-background)
} }
@ -251,12 +271,16 @@ html {
border: var(--line-size) solid var(--line-background) border: var(--line-size) solid var(--line-background)
} }
.fieldDescription,.listItemBodyText-secondary,.secondaryText { .fieldDescription,
.listItemBodyText-secondary,
.secondaryText {
color: var(--theme-body-secondary-text-color) color: var(--theme-body-secondary-text-color)
} }
.cardText-secondary { .cardText-secondary {
color: var(--text) color: var(--text)
} }
.cardText-first { .cardText-first {
color: var(--theme-text-color-opaque) color: var(--theme-text-color-opaque)
} }
@ -267,7 +291,7 @@ html {
@media(hover: hover) and (pointer:fine) { @media(hover: hover) and (pointer:fine) {
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color:rgba(255,255,255,.2); background-color: rgba(255, 255, 255, .2);
color: var(--text-hover); color: var(--text-hover);
} }
} }
@ -276,8 +300,9 @@ html {
background: rgb(rgb(var(--theme-primary-color))); background: rgb(rgb(var(--theme-primary-color)));
color: var(--label-text-color); color: var(--label-text-color);
} }
.itemSelectionCount { .itemSelectionCount {
color: var(--label-text-color)!important; color: var(--label-text-color) !important;
} }
@ -296,20 +321,20 @@ html {
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: rgb(var(--theme-primary-color)); background-color: rgb(var(--theme-primary-color));
color: var(--label-text-color)!important color: var(--label-text-color) !important
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c; background: #1c1c1c;
background: rgba(30,30,30,.9) background: rgba(30, 30, 30, .9)
} }
.listItem-border { .listItem-border {
border-color: var(--line-background)!important border-color: var(--line-background) !important
} }
.listItem-focusscale:focus { .listItem-focusscale:focus {
background: rgba(54,54,54,.8) background: rgba(54, 54, 54, .8)
} }
.listItemIcon:not(.listItemIcon-transparent) { .listItemIcon:not(.listItemIcon-transparent) {
@ -333,13 +358,15 @@ html {
color: #cb272a color: #cb272a
} }
.emby-input,.emby-textarea { .emby-input,
.emby-textarea {
color: inherit; color: inherit;
background: rgb(0 0 0 / 25%); background: rgb(0 0 0 / 25%);
border: var(--line-size) solid rgba(255, 255, 255, 0.1) border: var(--line-size) solid rgba(255, 255, 255, 0.1)
} }
.emby-input:focus,.emby-textarea:focus { .emby-input:focus,
.emby-textarea:focus {
border-color: rgb(var(--theme-primary-color)) border-color: rgb(var(--theme-primary-color))
} }
@ -350,9 +377,11 @@ html {
.emby-checkbox:checked+span:before { .emby-checkbox:checked+span:before {
border-color: rgb(var(--theme-primary-color)) !important; border-color: rgb(var(--theme-primary-color)) !important;
background-color: rgb(var(--theme-primary-color)) !important; background-color: rgb(var(--theme-primary-color)) !important;
} }
.checkboxLabel::after,.checkboxIcon {
.checkboxLabel::after,
.checkboxIcon {
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -384,16 +413,17 @@ html {
@media(hover: hover) and (pointer:fine) { @media(hover: hover) and (pointer:fine) {
.navMenuOption:hover { .navMenuOption:hover {
background:#303030 background: #303030
} }
} }
.navMenuOption-selected { .navMenuOption-selected {
background-color: var(--theme-icon-focus-background)!important; background-color: var(--theme-icon-focus-background) !important;
color: rgb(var(--accent-color)) color: rgb(var(--accent-color))
} }
.emby-button-focusscale:focus,.emby-button-focusscale:focus .detailButton-icon { .emby-button-focusscale:focus,
.emby-button-focusscale:focus .detailButton-icon {
background: rgb(var(--theme-primary-color)); background: rgb(var(--theme-primary-color));
color: var(--label-text-color) color: var(--label-text-color)
} }
@ -419,7 +449,9 @@ html {
outline-color: rgb(var(--theme-primary-color)) outline-color: rgb(var(--theme-primary-color))
} }
.channelCell,.guide-headerTimeslots,.timeslotHeaders { .channelCell,
.guide-headerTimeslots,
.timeslotHeaders {
background: var(--theme-background); background: var(--theme-background);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -427,46 +459,48 @@ html {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
@media (pointer: coarse) { @media (pointer: coarse) {
.channelCell-mobilefocus { .channelCell-mobilefocus {
background:var(--theme-background)!important; background: var(--theme-background) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
.channelCell-mobilefocus:not(:focus-visible) { .channelCell-mobilefocus:not(:focus-visible) {
background: var(--theme-background)!important; background: var(--theme-background) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.channelCell-mobilefocus:not(:-moz-focusring) { .channelCell-mobilefocus:not(:-moz-focusring) {
background: var(--theme-background)!important; background: var(--theme-background) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.channelCell,.epgRow,.programCell { .channelCell,
border-color: rgba(255,255,255,.05) .epgRow,
.programCell {
border-color: rgba(255, 255, 255, .05)
} }
.guide-currentTimeIndicatorDot { .guide-currentTimeIndicatorDot {
@ -482,22 +516,23 @@ html {
} }
.programCell-sports { .programCell-sports {
background: #3949ab!important background: #3949ab !important
} }
.programCell-movie { .programCell-movie {
background: #5e35b1!important background: #5e35b1 !important
} }
.programCell-kids { .programCell-kids {
background: #039be5!important background: #039be5 !important
} }
.programCell-news { .programCell-news {
background: #43a047!important background: #43a047 !important
} }
.channelCell:focus,.programCell:focus { .channelCell:focus,
.programCell:focus {
background-color: rgb(var(--theme-primary-color)); background-color: rgb(var(--theme-primary-color));
color: var(--label-text-color) color: var(--label-text-color)
} }
@ -515,7 +550,7 @@ html {
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33!important color: #c33 !important
} }
.downloadbutton-icon-on { .downloadbutton-icon-on {
@ -527,7 +562,7 @@ html {
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33!important color: #c33 !important
} }
.repeatButton-active { .repeatButton-active {
@ -573,7 +608,8 @@ html {
.cardOverlayButtonIcon { .cardOverlayButtonIcon {
background-color: rgb(var(--theme-primary-color)) background-color: rgb(var(--theme-primary-color))
} }
.cardScalable.cardPadder-portrait > div > button > i{
.cardScalable.cardPadder-portrait>div>button>i {
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -619,11 +655,11 @@ html {
.scrollbuttoncontainer { .scrollbuttoncontainer {
color: #fff; color: #fff;
background: rgba(20,20,20,.5) background: rgba(20, 20, 20, .5)
} }
.recordingIcon-active { .recordingIcon-active {
color: #c33!important color: #c33 !important
} }
.searchTabsContainer { .searchTabsContainer {
@ -631,16 +667,16 @@ html {
} }
.emby-search-tab-button.emby-tab-button-active { .emby-search-tab-button.emby-tab-button-active {
background: rgb(var(--accent-color))!important background: rgb(var(--accent-color)) !important
} }
.textActionButton.dragging { .textActionButton.dragging {
background: var(--button-background)!important background: var(--button-background) !important
} }
.dragging-over.full-drop-target { .dragging-over.full-drop-target {
background: rgb(var(--theme-primary-color))!important; background: rgb(var(--theme-primary-color)) !important;
color: var(--label-text-color)!important color: var(--label-text-color) !important
} }
.dragging-over-top:before { .dragging-over-top:before {
@ -658,24 +694,24 @@ html {
background: 0 !important; background: 0 !important;
color: var(--accent-color-hover); 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;
}
.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 { .cardImageIcon {
color: #fff; color: #fff;
} }
.dialog .inputLabelFocused, .dialog .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
@ -762,16 +798,16 @@ html {
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
.emby-checkbox:checked + span + .checkboxOutline { .emby-checkbox:checked+span+.checkboxOutline {
border-color: rgb(var(--theme-accent-text-color)); border-color: rgb(var(--theme-accent-text-color));
} }
.emby-checkbox:checked + span + .checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground { .itemProgressBarForeground {
background-color: rgb(var(--theme-accent-text-color)); background-color: rgb(var(--theme-accent-text-color));
} }
.emby-checkbox:focus:not(:checked) + span + .checkboxOutline { .emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
border-color: rgb(var(--theme-accent-text-color)); border-color: rgb(var(--theme-accent-text-color));
} }
@ -836,4 +872,4 @@ html {
.layout-tv .emby-button.detailFloatingButton:focus { .layout-tv .emby-button.detailFloatingButton:focus {
background-color: #f2f2f2; background-color: #f2f2f2;
color: rgb(var(--theme-accent-text-color)); color: rgb(var(--theme-accent-text-color));
} }

67
CSS/themes/librespeed/librespeed-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -11,20 +10,29 @@
/* Made by @gilbN */ /* Made by @gilbN */
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
html, body { html,
background: var(--main-bg-color) !important; body {
background-repeat: repeat, no-repeat; background: var(--main-bg-color) !important;
background-attachment: fixed, fixed; background-repeat: repeat, no-repeat;
background-position: center center, center center; background-attachment: fixed, fixed;
background-size: auto, cover; background-position: center center, center center;
-webkit-background-size: auto, cover; background-size: auto, cover;
-moz-background-size: auto, cover; -webkit-background-size: auto, cover;
-o-background-size: auto, cover; -moz-background-size: auto, cover;
color: var(--text) !important; -o-background-size: auto, cover;
color: var(--text) !important;
} }
h1,h2,h3,h4,h5,h6, label {
h1,
h2,
h3,
h4,
h5,
h6,
label {
color: var(--text-hover); color: var(--text-hover);
} }
div.meterText:empty:before { div.meterText:empty:before {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }
@ -32,39 +40,51 @@ div.meterText:empty:before {
#dlText { #dlText {
color: #F44336; color: #F44336;
} }
#ulText { #ulText {
color: #4CAF50; color: #4CAF50;
} }
#pingText, #jitText {
#pingText,
#jitText {
color: #2cabe3; color: #2cabe3;
} }
#startStopBtn { #startStopBtn {
color: var(--button-text); color: var(--button-text);
background: var(--button-color); background: var(--button-color);
border: 0.15em solid var(--button-color); border: 0.15em solid var(--button-color);
} }
#startStopBtn:hover { #startStopBtn:hover {
border: 0.15em solid var(--button-color-hover); border: 0.15em solid var(--button-color-hover);
background: var(--button-color-hover); background: var(--button-color-hover);
} }
#startStopBtn.running { #startStopBtn.running {
background: #FF3030 !important; background: #FF3030 !important;
border-color: #FF6060; border-color: #FF6060;
color: #FFFFFF; color: #FFFFFF;
} }
#startStopBtn.running:hover { #startStopBtn.running:hover {
background: #FF3030; background: #FF3030;
border-color: #FF6060; border-color: #FF6060;
color: #FFFFFF; color: #FFFFFF;
} }
a,a:-webkit-any-link {
color: var(--link-color); a,
a:-webkit-any-link {
color: var(--link-color);
} }
a:hover,a:-webkit-any-link:hover {
color: var(--link-color-hover); a:hover,
a:-webkit-any-link:hover {
color: var(--link-color-hover);
} }
#ip,.unit { #ip,
.unit {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
@ -76,10 +96,11 @@ a:hover,a:-webkit-any-link:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
input { input {
font-family: "Roboto",sans-serif; font-family: "Roboto", sans-serif;
color: white; color: white;
background-color: rgba(0, 0, 0, 0.25) !important; background-color: rgba(0, 0, 0, 0.25) !important;
-webkit-rtl-ordering: logical; -webkit-rtl-ordering: logical;
@ -95,4 +116,4 @@ input {
.testName { .testName {
color: var(--text-hover) !important; color: var(--text-hover) !important;
} }

37
CSS/themes/lidarr/lidarr-base.css
View File

@ -116,7 +116,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text-hover); color: var(--text-hover);
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
@ -131,7 +131,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -143,7 +143,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff; color: #fff;
border-top: 1px solid rgb(var(--accent-color)); border-top: 1px solid rgb(var(--accent-color));
} }
@ -180,8 +180,8 @@ a:hover {
} }
[class*="CheckInput-primaryIsChecked-"] { [class*="CheckInput-primaryIsChecked-"] {
border-color: rgb(var(--accent-color))!important; border-color: rgb(var(--accent-color)) !important;
background-color: rgb(var(--accent-color))!important; background-color: rgb(var(--accent-color)) !important;
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -215,7 +215,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff !important; color: #fff !important;
box-shadow: 0 0 10px 1px transparent !important; box-shadow: 0 0 10px 1px transparent !important;
} }
@ -253,7 +253,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -287,9 +287,9 @@ a:hover {
} }
[class*="PageSidebarItem-isActiveLink-"], [class*="PageSidebarItem-isActiveLink-"],
[class*="PageSidebarItem-isActiveLink-"]:hover, [class*="PageSidebarItem-isActiveLink-"]:hover,
[class*="PageSidebarItem-link-"]:focus { [class*="PageSidebarItem-link-"]:focus {
color: rgb(var(--accent-color))!important; color: rgb(var(--accent-color)) !important;
} }
[class*="PageSidebarItem-isActiveParentLink-"] { [class*="PageSidebarItem-isActiveParentLink-"] {
@ -305,7 +305,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -316,7 +316,7 @@ a:hover {
/* LIBRARY PAGE */ /* LIBRARY PAGE */
/* LIDARR SPECIFIC */ /* LIDARR SPECIFIC */
[class*="ArtistIndexPoster-controls-"] { [class*="ArtistIndexPoster-controls-"] {
background-color: rgb(var(--accent-color))!important; background-color: rgb(var(--accent-color)) !important;
} }
/* OVERVIEW PAGE */ /* OVERVIEW PAGE */
@ -441,7 +441,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
[class*="Tooltip-tooltipContainer-"] { [class*="Tooltip-tooltipContainer-"] {
@ -567,7 +567,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -673,7 +673,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #FFF; color: #FFF;
border: 1px solid transparent; border: 1px solid transparent;
} }
@ -690,6 +690,7 @@ a:hover {
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -698,6 +699,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -706,6 +708,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -714,6 +717,7 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -1053,12 +1057,14 @@ input[type=password] {
background-color: var(--button-color); background-color: var(--button-color);
cursor: pointer; cursor: pointer;
} }
.button:hover { .button:hover {
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
.form-input:focus { .form-input:focus {
outline: 0; outline: 0;
border-color: #fff; border-color: #fff;
@ -1121,5 +1127,4 @@ input[type=password] {
[class*="Label-danger-"][class*="Label-outline-"] { [class*="Label-danger-"][class*="Label-outline-"] {
color: #FFF; color: #FFF;
background-color: #f05050; background-color: #f05050;
} }

401
CSS/themes/logarr/logarr-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -12,27 +11,28 @@
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
body { body {
font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif; font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif;
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
background-color: var(--main-bg-color)!important; background-color: var(--main-bg-color) !important;
color:#FFFFFF !important; color: #FFFFFF !important;
} }
/* Scrollbar */ /* Scrollbar */
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
html { html {
height: 100%; height: 100%;
width: 100%; width: 100%;
overflow: auto; overflow: auto;
} }
body { body {
overflow-y: auto; overflow-y: auto;
background: var(--main-bg-color); background: var(--main-bg-color);
@ -42,51 +42,61 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
.expand::-webkit-scrollbar-track {
background-color: transparent !important; .expand::-webkit-scrollbar-track {
-webkit-box-shadow: none !important; background-color: transparent !important;
box-shadow: none !important; -webkit-box-shadow: none !important;
} box-shadow: none !important;
.expand::-webkit-scrollbar { }
background-color: transparent !important;
} .expand::-webkit-scrollbar {
.expand::-webkit-scrollbar-thumb { background-color: transparent !important;
background-color: hsla(0,0%,100%,.2) !important; }
-webkit-box-shadow: none !important;
box-shadow: none !important; .expand::-webkit-scrollbar-thumb {
} background-color: hsla(0, 0%, 100%, .2) !important;
.expand::-webkit-scrollbar-thumb:hover { -webkit-box-shadow: none !important;
background-color: hsla(0,0%,100%,.5) !important; box-shadow: none !important;
} }
body::-webkit-scrollbar-track { .expand::-webkit-scrollbar-thumb:hover {
background-color: transparent !important; background-color: hsla(0, 0%, 100%, .5) !important;
-webkit-box-shadow: none !important; }
box-shadow: none !important;
} body::-webkit-scrollbar-track {
body::-webkit-scrollbar { background-color: transparent !important;
background-color: transparent !important; -webkit-box-shadow: none !important;
} box-shadow: none !important;
body::-webkit-scrollbar-thumb { }
background-color: hsla(0,0%,100%,.2) !important;
-webkit-box-shadow: none !important; body::-webkit-scrollbar {
box-shadow: none !important; background-color: transparent !important;
} }
body::-webkit-scrollbar-thumb:hover {
background-color: hsla(0,0%,100%,.5) !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 { .flex-child {
border-radius: 0px; border-radius: 0px;
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15); box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.15);
} }
#includedContent { #includedContent {
background-color: transparent; background-color: transparent;
background: transparent; background: transparent;
} }
body { body {
opacity: 1; opacity: 1;
transition: 1s opacity; transition: 1s opacity;
@ -96,25 +106,38 @@ body {
color: #FFFFFF; color: #FFFFFF;
padding: 10px 10px 0; padding: 10px 10px 0;
} }
.btn { .btn {
font-weight: 600 !important; font-weight: 600 !important;
} }
body.fade-out { body.fade-out {
opacity: 0; opacity: 0;
transition: none; transition: none;
} }
.left, .right, .category-filter-item, .nav-item, .filesize, .path {
.left,
.right,
.category-filter-item,
.nav-item,
.filesize,
.path {
color: #ffffff; color: #ffffff;
} }
#username:hover, #password:hover {
#username:hover,
#password:hover {
text-shadow: 0 0 1rem transparent; text-shadow: 0 0 1rem transparent;
} }
#categoryFilter, #auto-update {
#categoryFilter,
#auto-update {
color: white !important; color: white !important;
background-color: transparent !important; background-color: transparent !important;
box-shadow: none; box-shadow: none;
border-radius: 0px; border-radius: 0px;
} }
#markform { #markform {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -123,18 +146,22 @@ body.fade-out {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.slide { .slide {
border: 1px solid transparent; border: 1px solid transparent;
} }
.expandtoggle { .expandtoggle {
background-color: transparent !important; background-color: transparent !important;
} }
.expandtoggle:hover { .expandtoggle:hover {
background-color: rgba(255, 255, 255, 0.08) !important; background-color: rgba(255, 255, 255, 0.08) !important;
} }
.expandtoggle:checked~.expandtoggle::before { .expandtoggle:checked~.expandtoggle::before {
content: ""; content: "";
background: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/logarr/increase.png) no-repeat; background: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/logarr/increase.png) no-repeat;
@ -144,6 +171,7 @@ body.fade-out {
height: 2em; height: 2em;
cursor: row-resize; cursor: row-resize;
} }
.expandtoggle::before { .expandtoggle::before {
background: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/logarr/decrease.png) no-repeat; background: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/logarr/decrease.png) no-repeat;
background-size: 2em; background-size: 2em;
@ -156,6 +184,7 @@ body.fade-out {
transition: .5s; transition: .5s;
cursor: pointer; cursor: pointer;
} }
.expand { .expand {
height: 43rem; height: 43rem;
width: auto; width: auto;
@ -166,93 +195,125 @@ body.fade-out {
word-wrap: break-word; word-wrap: break-word;
padding: 0 10px 0 10px; padding: 0 10px 0 10px;
} }
.header-brand, .logheader {
.header-brand,
.logheader {
text-shadow: none !important; text-shadow: none !important;
} }
/* Settings */ /* Settings */
/* Text Color */ /* Text Color */
.alpaca-control-label, .alpaca-control.radio { .alpaca-control-label,
.alpaca-control.radio {
color: white !important; color: white !important;
} }
.alpaca-form-buttons-container { .alpaca-form-buttons-container {
background-color: transparent !important; background-color: transparent !important;
} }
.Rtable-cell { .Rtable-cell {
color: white !important; color: white !important;
} }
#colorkey { #colorkey {
color: white !important; color: white !important;
} }
.settingstitle { .settingstitle {
text-shadow: none !important; text-shadow: none !important;
} }
#reginfo { #reginfo {
color: white !important; color: white !important;
} }
#infodata { #infodata {
background-color: transparent !important; background-color: transparent !important;
box-shadow: none !important; box-shadow: none !important;
} }
.input_icon { .input_icon {
color: var(--button-color) !important; color: var(--button-color) !important;
} }
.input_icon:hover { .input_icon:hover {
color: var(--button-color-hover) !important; color: var(--button-color-hover) !important;
} }
.input:hover, input.form-control:hover, select.form-control:hover {
.input:hover,
input.form-control:hover,
select.form-control:hover {
border: .2rem solid transparent; border: .2rem solid transparent;
} }
.input:focus, input.form-control:focus, select.form-control:focus {
.input:focus,
input.form-control:focus,
select.form-control:focus {
border: .2rem solid transparent; border: .2rem solid transparent;
} }
input:invalid { input:invalid {
border: .2rem solid transparent; border: .2rem solid transparent;
} }
input:valid { input:valid {
border: .2rem solid transparent; border: .2rem solid transparent;
} }
/* Sidebar */ /* Sidebar */
#sidebar-wrapper { #sidebar-wrapper {
box-shadow: none !important; box-shadow: none !important;
background-color: rgba(0, 0, 0, 0.07); background-color: rgba(0, 0, 0, 0.07);
} }
.sidebar-nav li:hover:before { .sidebar-nav li:hover:before {
-webkit-transition: none !important; -webkit-transition: none !important;
transition: none !important; transition: none !important;
background-color: rgba(0, 0, 0, 0.07); background-color: rgba(0, 0, 0, 0.07);
} }
.sidebar-nav li:before { .sidebar-nav li:before {
background-color: rgba(0, 0, 0, 0.07); background-color: rgba(0, 0, 0, 0.07);
transition: none !important; transition: none !important;
-webkit-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);
} }
.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 { #modalloading {
background: var(--main-bg-color); background: var(--main-bg-color);
@ -262,12 +323,14 @@ input:valid {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: white !important; color: white !important;
border: 1px solid transparent !important; border: 1px solid transparent !important;
box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important; box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important;
} }
.modaltextloading, .modalloadingspinner {
.modaltextloading,
.modalloadingspinner {
color: #FFF !important; color: #FFF !important;
} }
@ -275,87 +338,117 @@ input:valid {
max-width: 100% !important; max-width: 100% !important;
padding-right: 2rem !important; padding-right: 2rem !important;
} }
#stats { #stats {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
padding-left: .0rem !important; padding-left: .0rem !important;
padding-right: 1.11rem !important; padding-right: 1.11rem !important;
box-shadow: none; box-shadow: none;
} }
#hd { #hd {
padding-left: 0.8rem !important; padding-left: 0.8rem !important;
} }
.double-val-label>span.success { .double-val-label>span.success {
background-color: #28a745 !important; background-color: #28a745 !important;
} }
.servicetile:hover, .servicetile:focus {
text-shadow: 0 0 20px #000; .servicetile:hover,
.servicetile:focus {
text-shadow: 0 0 20px #000;
} }
#servicetitle:hover, #servicetitle:focus {
#servicetitle:hover,
#servicetitle:focus {
text-shadow: 0 0 20px #000; text-shadow: 0 0 20px #000;
} }
#servicetitle { #servicetitle {
color: #fff !important; color: #fff !important;
} }
.btnoffline, .btnunknown, .btnonline {
.btnoffline,
.btnunknown,
.btnonline {
box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important; 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; -webkit-box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
} }
.btnonline { .btnonline {
background-color: #28a745 !important; background-color: #28a745 !important;
} }
.btn { .btn {
background-color: var(--button-color) !important; background-color: var(--button-color) !important;
border: none !important; border: none !important;
} }
.btn:hover { .btn:hover {
background-color: var(--button-color-hover) !important; background-color: var(--button-color-hover) !important;
border: none !important; border: none !important;
} }
.btn-primary,.btn-primary:hover {
.btn-primary,
.btn-primary:hover {
border-color: transparent; border-color: transparent;
} }
.btn-group>.btn-group:not(:first-child)>.btn, .btn-group>.btn:not(:first-child) {
.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:not(:first-child) {
color: white !important; color: white !important;
} }
.btn-group>.btn:first-child { .btn-group>.btn:first-child {
color: white !important; color: white !important;
} }
#time { #time {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
#slidertable { #slidertable {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
box-shadow: none; box-shadow: none;
} }
#textslider { #textslider {
color: #fff !important; color: #fff !important;
} }
.dtg { .dtg {
color: #fff !important; color: #fff !important;
} }
.datemin { .datemin {
color: #fff !important; color: #fff !important;
} }
#center { #center {
background-color: rgba(0,0,0,.0) !important; 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; 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*/ /*Service tile*/
.col-lg-4 { .col-lg-4 {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
margin: 1rem .1rem 1.5rem 1rem !important; margin: 1rem .1rem 1.5rem 1rem !important;
width: 9rem !important; width: 9rem !important;
box-shadow: none; box-shadow: none;
} }
.col-lg-4:hover { .col-lg-4:hover {
background-color: hsla(0,0%,100%,.08) !important; background-color: hsla(0, 0%, 100%, .08) !important;
margin: 1rem .1rem 1.5rem 1rem !important; margin: 1rem .1rem 1.5rem 1rem !important;
width: 9rem !important; width: 9rem !important;
box-shadow: none; box-shadow: none;
} }
.servicetile, .servicetile:hover, .servicetile:focus {
.servicetile,
.servicetile:hover,
.servicetile:focus {
color: #ffffff; color: #ffffff;
text-shadow: none !important; text-shadow: none !important;
text-decoration: none !important; text-decoration: none !important;
@ -367,6 +460,7 @@ box-shadow: none;
-o-transition: none !important; -o-transition: none !important;
transition: none !important; transition: none !important;
} }
.servicetile { .servicetile {
color: #ffffff; color: #ffffff;
text-shadow: none !important; text-shadow: none !important;
@ -379,53 +473,68 @@ box-shadow: none;
-o-transition: none !important; -o-transition: none !important;
transition: none !important; transition: none !important;
} }
#servicetitle:hover, #servicetitle:focus {
#servicetitle:hover,
#servicetitle:focus {
text-shadow: none !important; text-shadow: none !important;
font-weight: inherit !important; font-weight: inherit !important;
} }
#clock { #clock {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
.date { .date {
color: #fff !important; color: #fff !important;
} }
#summary { #summary {
background-color: #e84242 !important; background-color: #e84242 !important;
border-radius: 23px 22px 22px 23px/23px 23px 22px 22px; border-radius: 23px 22px 22px 23px/23px 23px 22px 22px;
box-shadow: 0px 2px 5px rgb(15, 15, 15) !important; box-shadow: 0px 2px 5px rgb(15, 15, 15) !important;
} }
.pace, .pace-progress {
background: rgba(0,0,0,.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-progress-inner {
box-shadow: 0 0 10px rgba(0, 0, 0, .15), 0 0 5px rgba(0, 0, 0, .15) !important;
} }
.pace .pace-activity { .pace .pace-activity {
border-top-color: #FFF !important; border-top-color: #FFF !important;
border-left-color: #FFF !important; border-left-color: #FFF !important;
} }
.footer { .footer {
color: white !important; color: white !important;
} }
.footer:hover { .footer:hover {
text-shadow: 0 0 15px transparent !important; text-shadow: 0 0 15px transparent !important;
} }
#footer { #footer {
color: transparent !important; color: transparent !important;
} }
.navbar-brand { .navbar-brand {
text-shadow: 0 0 15px #000000 !important; text-shadow: 0 0 15px #000000 !important;
} }
/* ButtonShadow */ /* ButtonShadow */
.btnoffline, .btnunknown, .btnonline { .btnoffline,
.btnunknown,
.btnonline {
box-shadow: none !important; box-shadow: none !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
} }
.logrollmodal { .logrollmodal {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -434,21 +543,26 @@ box-shadow: none;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid transparent !important; border: 1px solid transparent !important;
} }
.modalimgpath, .modaltext, #uploadbutton { .modalimgpath,
.modaltext,
#uploadbutton {
color: #fff !important; color: #fff !important;
} }
.file-upload { .file-upload {
background-color: var(--button-color) !important; background-color: var(--button-color) !important;
color: white !important; color: white !important;
} }
.file-upload:hover { .file-upload:hover {
background-color: var(--button-color-hover) !important; background-color: var(--button-color-hover) !important;
color: white !important; color: white !important;
} }
@media only screen and (max-width: 775px) { @media only screen and (max-width: 775px) {
#slidertable { #slidertable {
display: none !important; display: none !important;
@ -458,10 +572,11 @@ box-shadow: none;
display: none !important; display: none !important;
} }
} }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
#dateRight { #dateRight {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
} }

333
CSS/themes/monitorr/monitorr-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -18,134 +17,164 @@
} }
body { body {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color:#FFFFFF !important; color: #FFFFFF !important;
} }
/* Scrollbar */
/* Scrollbar */
body::-webkit-scrollbar-track {
background-color: transparent !important; body::-webkit-scrollbar-track {
-webkit-box-shadow: none !important; background-color: transparent !important;
box-shadow: none !important; -webkit-box-shadow: none !important;
} box-shadow: none !important;
body::-webkit-scrollbar { }
background-color: transparent !important;
} body::-webkit-scrollbar {
body::-webkit-scrollbar-thumb { background-color: transparent !important;
background-color: hsla(0,0%,100%,.2) !important; }
-webkit-box-shadow: none !important;
box-shadow: none !important; body::-webkit-scrollbar-thumb {
} background-color: hsla(0, 0%, 100%, .2) !important;
body::-webkit-scrollbar-thumb:hover { -webkit-box-shadow: none !important;
background-color: hsla(0,0%,100%,.5) !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-track {
#myModal3::-webkit-scrollbar { background-color: transparent !important;
background-color: transparent !important; -webkit-box-shadow: none !important;
} box-shadow: none !important;
#myModal3::-webkit-scrollbar-thumb { }
background-color: hsla(0,0%,100%,.2) !important;
-webkit-box-shadow: none !important; #myModal3::-webkit-scrollbar {
box-shadow: none !important; background-color: transparent !important;
} }
#myModal3::-webkit-scrollbar-thumb:hover {
background-color: hsla(0,0%,100%,.5) !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 { #includedContent {
background-color: transparent; background-color: transparent;
background: transparent; background: transparent;
} }
#username:hover, #password:hover {
#username:hover,
#password:hover {
text-shadow: 0 0 1rem transparent; text-shadow: 0 0 1rem transparent;
} }
/* Settings */ /* Settings */
/* Text Color */ /* Text Color */
.alpaca-control-label, .alpaca-control.radio { .alpaca-control-label,
.alpaca-control.radio {
color: white !important; color: white !important;
} }
.alpaca-form-buttons-container { .alpaca-form-buttons-container {
background-color: transparent !important; background-color: transparent !important;
} }
.Rtable-cell { .Rtable-cell {
color: white !important; color: white !important;
} }
#colorkey { #colorkey {
color: white !important; color: white !important;
} }
.settingstitle { .settingstitle {
text-shadow: none !important; text-shadow: none !important;
} }
#reginfo { #reginfo {
color: white !important; color: white !important;
} }
#infodata { #infodata {
background-color: transparent !important; background-color: transparent !important;
box-shadow: none !important; box-shadow: none !important;
} }
.input_icon { .input_icon {
color: var(--button-color) !important; color: var(--button-color) !important;
} }
.input_icon:hover { .input_icon:hover {
color: var(--button-color-hover) !important; color: var(--button-color-hover) !important;
} }
/* Sidebar */ /* Sidebar */
#sidebar-wrapper { #sidebar-wrapper {
box-shadow: none !important; box-shadow: none !important;
background-color: rgba(0, 0, 0, 0.07); background-color: rgba(0, 0, 0, 0.07);
} }
.sidebar-nav li:hover:before { .sidebar-nav li:hover:before {
-webkit-transition: none !important; -webkit-transition: none !important;
transition: none !important; transition: none !important;
background-color: rgba(0, 0, 0, 0.07); background-color: rgba(0, 0, 0, 0.07);
} }
.sidebar-nav li:before { .sidebar-nav li:before {
background-color: rgba(0, 0, 0, 0.07); background-color: rgba(0, 0, 0, 0.07);
transition: none !important; transition: none !important;
-webkit-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);
} }
.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 { #modalloading {
background: var(--main-bg-color); background: var(--main-bg-color);
@ -155,12 +184,14 @@ background: transparent;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: white !important; color: white !important;
border: 1px solid transparent !important; border: 1px solid transparent !important;
box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important; box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important;
} }
.modaltextloading, .modalloadingspinner {
.modaltextloading,
.modalloadingspinner {
color: #FFF !important; color: #FFF !important;
} }
@ -168,85 +199,115 @@ background: transparent;
max-width: 100% !important; max-width: 100% !important;
padding-right: 2rem !important; padding-right: 2rem !important;
} }
#stats { #stats {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
padding-left: .0rem !important; padding-left: .0rem !important;
padding-right: 1.11rem !important; padding-right: 1.11rem !important;
box-shadow: none; box-shadow: none;
} }
#hd { #hd {
padding-left: 0.8rem !important; padding-left: 0.8rem !important;
} }
.double-val-label>span.success { .double-val-label>span.success {
background-color: #28a745 !important; background-color: #28a745 !important;
} }
.servicetile:hover, .servicetile:focus {
text-shadow: 0 0 20px #000; .servicetile:hover,
.servicetile:focus {
text-shadow: 0 0 20px #000;
} }
#servicetitle:hover, #servicetitle:focus {
#servicetitle:hover,
#servicetitle:focus {
text-shadow: 0 0 20px #000; text-shadow: 0 0 20px #000;
} }
#servicetitle { #servicetitle {
color: #fff !important; color: #fff !important;
} }
.btnoffline, .btnunknown, .btnonline {
.btnoffline,
.btnunknown,
.btnonline {
box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important; 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; -webkit-box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
} }
.btnonline { .btnonline {
background-color: #28a745 !important; background-color: #28a745 !important;
} }
.btn { .btn {
background-color: var(--button-color) !important; background-color: var(--button-color) !important;
} }
.btn:hover { .btn:hover {
background-color: var(--button-color-hover) !important; background-color: var(--button-color-hover) !important;
} }
.btn-primary,.btn-primary:hover {
.btn-primary,
.btn-primary:hover {
border-color: transparent; border-color: transparent;
} }
.btn-group>.btn-group:not(:first-child)>.btn, .btn-group>.btn:not(:first-child) {
.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:not(:first-child) {
color: white !important; color: white !important;
} }
.btn-group>.btn:first-child { .btn-group>.btn:first-child {
color: white !important; color: white !important;
} }
#time { #time {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
#slidertable { #slidertable {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
box-shadow: none; box-shadow: none;
} }
#textslider { #textslider {
color: #fff !important; color: #fff !important;
} }
.dtg { .dtg {
color: #fff !important; color: #fff !important;
} }
.datemin { .datemin {
color: #fff !important; color: #fff !important;
} }
#center { #center {
background-color: rgba(0,0,0,.0) !important; 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; 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*/ /*Service tile*/
.col-lg-4 { .col-lg-4 {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
margin: 1rem .1rem 1.5rem 1rem !important; margin: 1rem .1rem 1.5rem 1rem !important;
width: 9rem !important; width: 9rem !important;
box-shadow: none; box-shadow: none;
} }
.col-lg-4:hover { .col-lg-4:hover {
background-color: hsla(0,0%,100%,.08) !important; background-color: hsla(0, 0%, 100%, .08) !important;
margin: 1rem .1rem 1.5rem 1rem !important; margin: 1rem .1rem 1.5rem 1rem !important;
width: 9rem !important; width: 9rem !important;
box-shadow: none; box-shadow: none;
} }
.servicetile, .servicetile:hover, .servicetile:focus {
.servicetile,
.servicetile:hover,
.servicetile:focus {
color: #ffffff; color: #ffffff;
text-shadow: none !important; text-shadow: none !important;
text-decoration: none !important; text-decoration: none !important;
@ -258,6 +319,7 @@ box-shadow: none;
-o-transition: none !important; -o-transition: none !important;
transition: none !important; transition: none !important;
} }
.servicetile { .servicetile {
color: #ffffff; color: #ffffff;
text-shadow: none !important; text-shadow: none !important;
@ -270,53 +332,68 @@ box-shadow: none;
-o-transition: none !important; -o-transition: none !important;
transition: none !important; transition: none !important;
} }
#servicetitle:hover, #servicetitle:focus {
#servicetitle:hover,
#servicetitle:focus {
text-shadow: none !important; text-shadow: none !important;
font-weight: inherit !important; font-weight: inherit !important;
} }
#clock { #clock {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
.date { .date {
color: #fff !important; color: #fff !important;
} }
#summary { #summary {
background-color: #e84242 !important; background-color: #e84242 !important;
border-radius: 23px 22px 22px 23px/23px 23px 22px 22px; border-radius: 23px 22px 22px 23px/23px 23px 22px 22px;
box-shadow: 0px 2px 5px rgb(15, 15, 15) !important; box-shadow: 0px 2px 5px rgb(15, 15, 15) !important;
} }
.pace, .pace-progress {
background: rgba(0,0,0,.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-progress-inner {
box-shadow: 0 0 10px rgba(0, 0, 0, .15), 0 0 5px rgba(0, 0, 0, .15) !important;
} }
.pace .pace-activity { .pace .pace-activity {
border-top-color: #FFF !important; border-top-color: #FFF !important;
border-left-color: #FFF !important; border-left-color: #FFF !important;
} }
.footer { .footer {
color: white !important; color: white !important;
} }
.footer:hover { .footer:hover {
text-shadow: 0 0 15px transparent !important; text-shadow: 0 0 15px transparent !important;
} }
#footer { #footer {
color: transparent !important; color: transparent !important;
} }
.navbar-brand { .navbar-brand {
text-shadow: 0 0 15px #000000 !important; text-shadow: 0 0 15px #000000 !important;
} }
/* ButtonShadow */ /* ButtonShadow */
.btnoffline, .btnunknown, .btnonline { .btnoffline,
.btnunknown,
.btnonline {
box-shadow: none !important; box-shadow: none !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
} }
#myModal3 { #myModal3 {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -325,20 +402,26 @@ box-shadow: none;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid transparent !important; border: 1px solid transparent !important;
} }
.modalimgpath, .modaltext, #uploadbutton {
.modalimgpath,
.modaltext,
#uploadbutton {
color: #fff !important; color: #fff !important;
} }
.file-upload { .file-upload {
background-color: var(--button-color) !important; background-color: var(--button-color) !important;
color: white !important; color: white !important;
} }
.file-upload:hover { .file-upload:hover {
background-color: var(--button-color-hover) !important; background-color: var(--button-color-hover) !important;
color: white !important; color: white !important;
} }
@media only screen and (max-width: 775px) { @media only screen and (max-width: 775px) {
#slidertable { #slidertable {
display: none !important; display: none !important;
@ -347,4 +430,4 @@ box-shadow: none;
#time { #time {
display: none !important; display: none !important;
} }
} }

103
CSS/themes/monitorr/organizr-dashboard.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -19,70 +18,93 @@ body {
max-width: 100% !important; max-width: 100% !important;
padding-right: 2rem !important; padding-right: 2rem !important;
} }
#stats { #stats {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
padding-left: .0rem !important; padding-left: .0rem !important;
padding-right: 1.11rem !important; padding-right: 1.11rem !important;
box-shadow: none; box-shadow: none;
} }
#hd { #hd {
padding-left: 0.8rem !important; padding-left: 0.8rem !important;
} }
.double-val-label>span.success { .double-val-label>span.success {
background-color: #28a745 !important; background-color: #28a745 !important;
} }
.servicetile:hover, .servicetile:focus {
text-shadow: 0 0 20px #000; .servicetile:hover,
.servicetile:focus {
text-shadow: 0 0 20px #000;
} }
#servicetitle:hover, #servicetitle:focus {
#servicetitle:hover,
#servicetitle:focus {
text-shadow: 0 0 20px #000; text-shadow: 0 0 20px #000;
} }
#servicetitle { #servicetitle {
color: #fff !important; color: #fff !important;
} }
.btnoffline, .btnunknown, .btnonline {
.btnoffline,
.btnunknown,
.btnonline {
box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important; 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; -webkit-box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.9) !important;
} }
.btnonline { .btnonline {
background-color: #28a745 !important; background-color: #28a745 !important;
} }
#time { #time {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
#slidertable { #slidertable {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
box-shadow: none; box-shadow: none;
} }
#textslider { #textslider {
color: #fff !important; color: #fff !important;
} }
.dtg { .dtg {
color: #fff !important; color: #fff !important;
} }
.datemin { .datemin {
color: #fff !important; color: #fff !important;
} }
#center { #center {
background-color: rgba(0,0,0,.0) !important; 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; 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*/ /*Service tile*/
.col-lg-4 { .col-lg-4 {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
margin: 1rem .1rem 1.5rem 1rem !important; margin: 1rem .1rem 1.5rem 1rem !important;
width: 9rem !important; width: 9rem !important;
box-shadow: none; box-shadow: none;
} }
.col-lg-4:hover { .col-lg-4:hover {
background-color: hsla(0,0%,100%,.08) !important; background-color: hsla(0, 0%, 100%, .08) !important;
margin: 1rem .1rem 1.5rem 1rem !important; margin: 1rem .1rem 1.5rem 1rem !important;
width: 9rem !important; width: 9rem !important;
box-shadow: none; box-shadow: none;
} }
.servicetile, .servicetile:hover, .servicetile:focus {
.servicetile,
.servicetile:hover,
.servicetile:focus {
color: #ffffff; color: #ffffff;
text-shadow: none !important; text-shadow: none !important;
text-decoration: none !important; text-decoration: none !important;
@ -94,6 +116,7 @@ box-shadow: none;
-o-transition: none !important; -o-transition: none !important;
transition: none !important; transition: none !important;
} }
.servicetile { .servicetile {
color: #ffffff; color: #ffffff;
text-shadow: none !important; text-shadow: none !important;
@ -106,54 +129,72 @@ box-shadow: none;
-o-transition: none !important; -o-transition: none !important;
transition: none !important; transition: none !important;
} }
#servicetitle:hover, #servicetitle:focus {
#servicetitle:hover,
#servicetitle:focus {
text-shadow: none !important; text-shadow: none !important;
font-weight: inherit !important; font-weight: inherit !important;
} }
#clock { #clock {
background-color: rgba(0,0,0,.15) !important; background-color: rgba(0, 0, 0, .15) !important;
color: #fff !important; color: #fff !important;
box-shadow: none; box-shadow: none;
} }
.date { .date {
color: #fff !important; color: #fff !important;
} }
#summary { #summary {
background-color: #e84242 !important; background-color: #e84242 !important;
border-radius: 23px 22px 22px 23px/23px 23px 22px 22px; border-radius: 23px 22px 22px 23px/23px 23px 22px 22px;
box-shadow: 0px 2px 5px rgb(15, 15, 15) !important; box-shadow: 0px 2px 5px rgb(15, 15, 15) !important;
} }
.pace, .pace-progress {
background: rgba(0,0,0,.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-progress-inner {
box-shadow: 0 0 10px rgba(0, 0, 0, .15), 0 0 5px rgba(0, 0, 0, .15) !important;
} }
.footer { .footer {
color: transparent !important; color: transparent !important;
} }
.footer:hover { .footer:hover {
text-shadow: 0 0 15px transparent !important; text-shadow: 0 0 15px transparent !important;
} }
#footer { #footer {
color: transparent !important; color: transparent !important;
} }
.alpaca-control-label, .alpaca-control.radio {
.alpaca-control-label,
.alpaca-control.radio {
color: black !important; color: black !important;
} }
.navbar-brand { .navbar-brand {
text-shadow: 0 0 15px #000000 !important; text-shadow: 0 0 15px #000000 !important;
} }
.Rtable-cell { .Rtable-cell {
color: #000000 !important; color: #000000 !important;
} }
#colorkey { #colorkey {
color: #000000 !important; color: #000000 !important;
} }
/* ButtonShadow */ /* ButtonShadow */
.btnoffline, .btnunknown, .btnonline { .btnoffline,
.btnunknown,
.btnonline {
box-shadow: none !important; box-shadow: none !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
} }
@ -166,4 +207,4 @@ box-shadow: none;
#time { #time {
display: none !important; display: none !important;
} }
} }

8
CSS/themes/moviematch/moviematch-base.css
View File

@ -23,7 +23,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text) color: var(--text)
} }
@ -93,8 +93,7 @@ input:focus {
.login-form .room-code-container .generate-button:hover, .login-form .room-code-container .generate-button:hover,
.login-form .submit-button:hover, .login-form .submit-button:hover,
.ButtonPrimary:hover, .ButtonPrimary:hover,
.ButtonPrimary:active .ButtonPrimary:active .ButtonSecondary:hover,
.ButtonSecondary:hover,
.ButtonSecondary:active, .ButtonSecondary:active,
.ButtonTertiary:hover, .ButtonTertiary:hover,
.ButtonTertiary:active, .ButtonTertiary:active,
@ -106,6 +105,7 @@ input:focus {
color: var(--button-text-hover); color: var(--button-text-hover);
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
} }
@media (hover: hover) { @media (hover: hover) {
.ButtonSecondary:hover { .ButtonSecondary:hover {
color: var(--button-text-hover); color: var(--button-text-hover);
@ -135,9 +135,11 @@ input:focus {
.Card_MoreInfoButton:hover { .Card_MoreInfoButton:hover {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
.RoomInfoBar { .RoomInfoBar {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
/* MENUS POPOVER */ /* MENUS POPOVER */
.PopoverMenuButton:hover { .PopoverMenuButton:hover {
background: rgb(255 255 255 / 15%) !important; background: rgb(255 255 255 / 15%) !important;

433
CSS/themes/nzbget/nzbget-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -12,45 +11,49 @@
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
body { body {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
background-color: rgba(0,0,0,.0); background-color: rgba(0, 0, 0, .0);
color:#FFFFFF !important; color: #FFFFFF !important;
} }
/* scroller */ /* scroller */
::-webkit-scrollbar-corner { ::-webkit-scrollbar-corner {
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 10px; width: 10px;
height: 10px; height: 10px;
background: #0c1218; background: #0c1218;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
border-radius: 2px; border-radius: 2px;
background-color: hsla(0,0%,100%,.08); background-color: hsla(0, 0%, 100%, .08);
} }
.modal { .modal {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
background-color: var(--modal-bg-color) !important; background-color: var(--modal-bg-color) !important;
color:#FFFFFF !important; color: #FFFFFF !important;
} }
.modal-footer { .modal-footer {
background-color: transparent; background-color: transparent;
border-top: none; border-top: none;
@ -60,63 +63,90 @@ body {
.table a { .table a {
color: #ffffff; color: #ffffff;
} }
.table a:hover { .table a:hover {
color: #e5a00d; color: #e5a00d;
} }
.table-striped tbody tr:nth-child(odd) { .table-striped tbody tr:nth-child(odd) {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
.table-striped tbody tr:nth-child(odd) td, .table-striped tbody tr:nth-child(odd) th {
.table-striped tbody tr:nth-child(odd) td,
.table-striped tbody tr:nth-child(odd) th {
background-color: transparent; background-color: transparent;
} }
.table-striped tbody tr:nth-child(even) { .table-striped tbody tr:nth-child(even) {
background-color: rgba(0, 0, 0, 0.08); background-color: rgba(0, 0, 0, 0.08);
} }
.table tbody tr:hover, .table tbody tr:hover td, .table tbody tr:hover a {
.table tbody tr:hover,
.table tbody tr:hover td,
.table tbody tr:hover a {
color: white; color: white;
background-color: hsla(0,0%,100%,.08); 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); .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); 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 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.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 {
.table th,
.table td {
border-top: none; border-top: none;
} }
.table-bordered { .table-bordered {
border-left: none; border-left: none;
border: none; border: none;
} }
.pagination a { .pagination a {
border: none; border: none;
background: rgba(0, 0, 0, .25); background: rgba(0, 0, 0, .25);
} }
.pagination a:hover, .pagination .active a {
background-color: hsla(0,0%,100%,.08); .pagination a:hover,
.pagination .active a {
background-color: hsla(0, 0%, 100%, .08);
} }
.pagination .active a { .pagination .active a {
color: #ffffff; color: #ffffff;
} }
/* PROGRESS BAR */ /* PROGRESS BAR */
.progress { .progress {
background: hsla(0,0%,100%,.08); background: hsla(0, 0%, 100%, .08);
} }
.progress-warning.progress-striped .bar { .progress-warning.progress-striped .bar {
background-color: #cc7b19; background-color: #cc7b19;
} }
.progress-success.progress-striped .bar { .progress-success.progress-striped .bar {
background-color: #51a351; background-color: #51a351;
} }
@ -125,10 +155,12 @@ tr.checked, tr.checked td, tr.checked:nth-child(odd) .progress {
.navbar-fixed-top .navbar-inner { .navbar-fixed-top .navbar-inner {
color: #fff !important; color: #fff !important;
} }
.navbar-inner {
background-image: none; .navbar-inner {
background-color: transparent; background-image: none;
background-color: transparent;
} }
.navbar-container { .navbar-container {
background: var(--main-bg-color); background: var(--main-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -137,155 +169,184 @@ tr.checked, tr.checked td, tr.checked:nth-child(odd) .progress {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.navbar .nav > li > a:hover {
.navbar .nav>li>a:hover {
color: var(--accent-color); color: var(--accent-color);
} }
.navbar .nav .active > a, .navbar .nav .active > a:hover {
background: hsla(0,0%,100%,.08); .navbar .nav .active>a,
.navbar .nav .active>a:hover {
background: hsla(0, 0%, 100%, .08);
color: var(--accent-color); color: var(--accent-color);
} }
[class^="icon-"], [class*=" icon-"], [class^="img-"], [class*=" img-"] { [class^="icon-"],
[class*=" icon-"],
[class^="img-"],
[class*=" img-"] {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/nzbget/icons.png); background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/nzbget/icons.png);
} }
.navbar-search .search-query { .navbar-search .search-query {
color: #ffffff; color: #ffffff;
background-color: rgba(0, 0, 0, 0.25) !important; background-color: rgba(0, 0, 0, 0.25) !important;
border: 0px solid #151515; border: 0px solid #151515;
} }
.navbar-search .search-query:focus, .navbar-search .search-query.focused {
.navbar-search .search-query:focus,
.navbar-search .search-query.focused {
color: #000 !important; color: #000 !important;
text-shadow: none; text-shadow: none;
background-color: white !important; background-color: white !important;
} }
.search-caret-button { .search-caret-button {
outline: none; outline: none;
} }
.menu-header { .menu-header {
color: #ffffff; color: #ffffff;
} }
.dropdown-menu { .dropdown-menu {
background-color: #191a1c; background-color: #191a1c;
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #FFF; color: #FFF;
} }
.dropdown-menu a { .dropdown-menu a {
color: #ffffff; color: #ffffff;
} }
.dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover {
.dropdown-menu li>a:hover,
.dropdown-menu .active>a,
.dropdown-menu .active>a:hover {
color: #ffffff; color: #ffffff;
background-color: hsla(0,0%,100%,.05); background-color: hsla(0, 0%, 100%, .05);
} }
.dropdown-menu .divider { .dropdown-menu .divider {
height: 0px; height: 0px;
border-bottom: none; border-bottom: none;
} }
/* BUTTONS */ /* BUTTONS */
.btn-group > .dropdown-toggle { .btn-group>.dropdown-toggle {
box-shadow: none; box-shadow: none;
} }
.config-header .btn{ .config-header .btn {
background:#FFF; background: #FFF;
color:#adb1b1; color: #adb1b1;
text-shadow:unset; text-shadow: unset;
} }
#ConfigData > div > button.btn{ #ConfigData>div>button.btn {
background: rgba(0, 0, 0, .25) !important; background: rgba(0, 0, 0, .25) !important;
color: #FFF !important; color: #FFF !important;
font-weight:bold; font-weight: bold;
text-shadow:unset; text-shadow: unset;
} }
#ConfigData > div > button.btn:hover{
background: hsla(0,0%,100%,.08) !important; #ConfigData>div>button.btn:hover {
color: #FFF !important; background: hsla(0, 0%, 100%, .08) !important;
font-weight:bold; color: #FFF !important;
text-shadow:unset; font-weight: bold;
text-shadow: unset;
} }
#ConfigData > div > div > table > tbody > tr > td>.btn{ #ConfigData>div>div>table>tbody>tr>td>.btn {
background:#414141; background: #414141;
color:#adb1b1; color: #adb1b1;
text-shadow:unset; text-shadow: unset;
font-weight:bold; font-weight: bold;
} }
#Config_Save:hover{
background-color:#51a351; #Config_Save:hover {
color:#FFF; background-color: #51a351;
color: #FFF;
} }
#Config_Save { #Config_Save {
background:rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
color:#FFF; color: #FFF;
margin:auto; margin: auto;
} }
#ConfigData > div> div > button.btn.btn-danger {
background:#ad292c; #ConfigData>div>div>button.btn.btn-danger {
text-shadow:unset; background: #ad292c;
} text-shadow: unset;
#ConfigData > div> div > button.btn.btn-danger:hover { }
background:#d33a3e;
text-shadow:unset; #ConfigData>div>div>button.btn.btn-danger:hover {
} background: #d33a3e;
#ConfigData > div:nth-child(3) > div > button, text-shadow: unset;
#ConfigData > div:nth-child(4) > div > button, }
#ConfigData > div:nth-child(5) > div > button {
text-shadow:unset; #ConfigData>div:nth-child(3)>div>button,
background: rgba(0, 0, 0, 0.25); #ConfigData>div:nth-child(4)>div>button,
color:white; #ConfigData>div:nth-child(5)>div>button {
} text-shadow: unset;
#ConfigData > div:nth-child(3) > div > button:hover, background: rgba(0, 0, 0, 0.25);
#ConfigData > div:nth-child(4) > div > button:hover, color: white;
#ConfigData > div:nth-child(5) > div > button:hover { }
text-shadow:unset;
background: hsla(0,0%,100%,.08); #ConfigData>div:nth-child(3)>div>button:hover,
color:white; #ConfigData>div:nth-child(4)>div>button:hover,
} #ConfigData>div:nth-child(5)>div>button:hover {
#ConfigData input.btn.btn-primary{ text-shadow: unset;
background: var(--button-color) !important; background: hsla(0, 0%, 100%, .08);
text-shadow:unset; color: white;
color:white; }
}
#ConfigData input.btn{ #ConfigData input.btn.btn-primary {
background: rgba(0, 0, 0, 0.25) !important; background: var(--button-color) !important;
text-shadow:unset; text-shadow: unset;
color:#a8a8a8; color: white;
} }
#Config_ViewButton{
background:rgba(0, 0, 0, 0.25); #ConfigData input.btn {
color:#FFF; background: rgba(0, 0, 0, 0.25) !important;
} text-shadow: unset;
color: #a8a8a8;
#Config_ViewButton:hover{ }
background: hsla(0,0%,100%,.08);
color:#FFF; #Config_ViewButton {
} background: rgba(0, 0, 0, 0.25);
#DownloadsEditDialog input.btn.btn-primary{ color: #FFF;
}
#Config_ViewButton:hover {
background: hsla(0, 0%, 100%, .08);
color: #FFF;
}
#DownloadsEditDialog input.btn.btn-primary {
background: var(--button-color) !important; background: var(--button-color) !important;
text-shadow:unset; text-shadow: unset;
color:white; color: white;
} }
#HistoryEdit_ParamData input.btn.btn-primary{
#HistoryEdit_ParamData input.btn.btn-primary {
background: var(--button-color) !important; background: var(--button-color) !important;
text-shadow:unset; text-shadow: unset;
color:white; color: white;
} }
.btn { .btn {
color: #ffffff; color: #ffffff;
text-shadow: none; text-shadow: none;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
background-image: none; background-image: none;
border-color: transparent; border-color: transparent;
@ -294,9 +355,10 @@ tr.checked, tr.checked td, tr.checked:nth-child(odd) .progress {
-moz-box-shadow: none; -moz-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
.btn:hover { .btn:hover {
color: #FFF; color: #FFF;
background-color: hsla(0,0%,100%,.08); background-color: hsla(0, 0%, 100%, .08);
} }
@ -306,21 +368,25 @@ tr.checked, tr.checked td, tr.checked:nth-child(odd) .progress {
.btn-group.open .btn.dropdown-toggle { .btn-group.open .btn.dropdown-toggle {
background-color: #FFF; background-color: #FFF;
background-color: hsla(0,0%,100%,.08); background-color: hsla(0, 0%, 100%, .08);
} }
#ConfigData > div > div > table > tbody > tr > td>.btn{ #ConfigData>div>div>table>tbody>tr>td>.btn {
background:rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
color:#FFF; color: #FFF;
text-shadow:unset; text-shadow: unset;
font-weight:bold; font-weight: bold;
} }
#ConfigData > div > div > table > tbody > tr > td>.btn:hover{
background: hsla(0,0%,100%,.08); #ConfigData>div>div>table>tbody>tr>td>.btn:hover {
color:#FFF; background: hsla(0, 0%, 100%, .08);
color: #FFF;
} }
input, textarea, select, .uneditable-input { input,
textarea,
select,
.uneditable-input {
color: #ffffff; color: #ffffff;
background-color: rgb(0, 0, 0); background-color: rgb(0, 0, 0);
background-image: var(main-bg-color) !important; background-image: var(main-bg-color) !important;
@ -335,11 +401,16 @@ input, textarea, select, .uneditable-input {
color: #FFFFFF !important; color: #FFFFFF !important;
border: none; border: none;
} }
select:focus { select:focus {
background: #191a1c !important; background: #191a1c !important;
color: #FFF !important; color: #FFF !important;
} }
input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus, select:focus {
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus,
select:focus {
outline: thin dotted #333; outline: thin dotted #333;
outline: none; outline: none;
outline-offset: -2px; outline-offset: -2px;
@ -347,24 +418,28 @@ input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focu
-moz-box-shadow: none; -moz-box-shadow: none;
box-shadow: none; box-shadow: none;
} }
input:focus, textarea:focus {
input:focus,
textarea:focus {
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.6); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.6); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(0, 0, 0, 0.6);
} }
.alert-info { .alert-info {
font-weight: bold; font-weight: bold;
border-radius: unset; border-radius: unset;
border-bottom-left-radius: 0px; border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px; border-bottom-right-radius: 0px;
border:0px; border: 0px;
background-color:hsla(0,0%,100%,.05); background-color: hsla(0, 0%, 100%, .05);
text-shadow:unset; text-shadow: unset;
color:#FFF; color: #FFF;
text-transform:capitalize; text-transform: capitalize;
} }
.alert-inverse { .alert-inverse {
background-color: #414141; background-color: #414141;
background-image: var(--main-bg-color) !important; background-image: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -374,7 +449,7 @@ input:focus, textarea:focus {
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-color: transparent; border-color: transparent;
opacity: 1; opacity: 1;
} }
@ -385,41 +460,55 @@ label {
} }
#ConfigNav { #ConfigNav {
border: 1px solid rgba(0, 0, 0, .25); border: 1px solid rgba(0, 0, 0, .25);
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
} }
#ConfigNav.nav-list a { #ConfigNav.nav-list a {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
.nav-list > li > a, .nav-list .nav-header {
.nav-list>li>a,
.nav-list .nav-header {
text-shadow: none; text-shadow: none;
} }
.nav-list > .active > a, .nav-list > .active > a:hover {
.nav-list>.active>a,
.nav-list>.active>a:hover {
color: #ffffff; color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
background-color: #0088cc; background-color: #0088cc;
} }
.nav-list > .active > a, .nav-list > .active > a:hover {
.nav-list>.active>a,
.nav-list>.active>a:hover {
color: var(--accent-color) !important; color: var(--accent-color) !important;
background-color: transparent; background-color: transparent;
} }
.nav > li > a:hover {
background-color: hsla(0,0%,100%,.08); .nav>li>a:hover {
background-color: hsla(0, 0%, 100%, .08);
} }
span.help-option-title { span.help-option-title {
color: #eee; color: #eee;
} }
.help-block, .help-inline {
.help-block,
.help-inline {
color: #eee; color: #eee;
} }
.confirm-help-block { .confirm-help-block {
color: #eee; color: #eee;
font-size: 13px; font-size: 13px;
line-height: 16px; line-height: 16px;
margin-bottom: 0; margin-bottom: 0;
} }
.input-prepend .add-on, .input-append .add-on {
.input-prepend .add-on,
.input-append .add-on {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
background-image: var(--main-bg-color) !important; background-image: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -433,21 +522,27 @@ span.help-option-title {
color: #FFFFFF !important; color: #FFFFFF !important;
border: none; border: none;
} }
.config-settitle { .config-settitle {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border-bottom: none; border-bottom: none;
} }
a { a {
color: var(--accent-color); color: var(--accent-color);
text-decoration: none; text-decoration: none;
} }
a:hover { a:hover {
color: #fff; color: #fff;
text-decoration: underline; text-decoration: underline;
} }
.label-warning, .badge-warning {
.label-warning,
.badge-warning {
background-color: var(--button-color); background-color: var(--button-color);
} }
.caret { .caret {
border-top: 4px solid #ffffff; border-top: 4px solid #ffffff;
} }

172
CSS/themes/nzbhydra2/nzbhydra-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -11,7 +10,8 @@
/* Made by @gilbN */ /* Made by @gilbN */
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
body, html { body,
html {
height: 100%; height: 100%;
background: var(--main-bg-color); background: var(--main-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -20,29 +20,37 @@
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
font-family: Open Sans Semibold, Helvetica Neue, Helvetica, Arial, sans-serif; font-family: Open Sans Semibold, Helvetica Neue, Helvetica, Arial, sans-serif;
} }
.navbar-default { .navbar-default {
background-color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.6);
border-color: transparent; border-color: transparent;
} }
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
color: #fff; color: #fff;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover {
color: #fff; color: #fff;
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
} }
.growl-container>.alert-info.icon { .growl-container>.alert-info.icon {
background: var(--accent-color); background: var(--accent-color);
} }
.alert-info { .alert-info {
background: var(--accent-color); background: var(--accent-color);
border-color: transparent; border-color: transparent;
color: #fff; color: #fff;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
outline: none; outline: none;
} }
@ -50,25 +58,34 @@
.nav-tabs { .nav-tabs {
border-bottom: 1px solid rgba(255, 255, 255, 0.15); 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 {
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
color: #fff; color: #fff;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: 1px solid #1a1f2000; border: 1px solid #1a1f2000;
border-bottom-color: transparent; border-bottom-color: transparent;
} }
.nav-tabs>li>a:hover { .nav-tabs>li>a:hover {
border-color: transparent; border-color: transparent;
} }
.nav>li>a:focus, .nav>li>a:hover {
.nav>li>a:focus,
.nav>li>a:hover {
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
} }
.formly>.formly-field-group { .formly>.formly-field-group {
background-color: transparent; background-color: transparent;
border: 1px solid transparent; border: 1px solid transparent;
} }
legend { legend {
border-bottom: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08);
} }
.panel-default>.panel-heading h3 { .panel-default>.panel-heading h3 {
color: #ffffff; color: #ffffff;
} }
@ -79,62 +96,137 @@ legend {
background: var(--default-button-color); background: var(--default-button-color);
border-color: var(--default-button-color); border-color: var(--default-button-color);
} }
.btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open>.dropdown-toggle.btn-primary {
.btn-primary.active,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.open>.dropdown-toggle.btn-primary {
color: #fff; color: #fff;
background: var(--default-button-color-hover); background: var(--default-button-color-hover);
border-color: var(--default-button-color-hover); border-color: var(--default-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 {
.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: #fff; color: #fff;
background: var(--default-button-color-hover); background: var(--default-button-color-hover);
border-color: var(--default-button-color-hover); border-color: var(--default-button-color-hover);
} }
.btn-info { .btn-info {
color: #fff; color: #fff;
background: var(--default-button-color); background: var(--default-button-color);
border-color: transparent; border-color: transparent;
} }
.btn-info.active, .btn-info.focus, .btn-info:active, .btn-info:focus, .btn-info:hover, .open>.dropdown-toggle.btn-info {
.btn-info.active,
.btn-info.focus,
.btn-info:active,
.btn-info:focus,
.btn-info:hover,
.open>.dropdown-toggle.btn-info {
color: #fff; color: #fff;
background: var(--default-button-color-hover); background: var(--default-button-color-hover);
border-color: transparent; border-color: transparent;
} }
.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 {
.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: #fff; color: #fff;
background: var(--default-button-color-active); background: var(--default-button-color-active);
border-color: transparent; border-color: transparent;
outline: none; outline: none;
} }
.btn-default { .btn-default {
color: #fff; color: #fff;
background: var(--default-button-color); background: var(--default-button-color);
border-color: transparent !important; border-color: transparent !important;
outline: none; outline: none;
} }
.btn-default.active, .btn-default.focus, .btn-default:active, .btn-default:focus, .btn-default:hover, .open>.dropdown-toggle.btn-default {
.btn-default.active,
.btn-default.focus,
.btn-default:active,
.btn-default:focus,
.btn-default:hover,
.open>.dropdown-toggle.btn-default {
color: #fff; color: #fff;
background: var(--default-button-color-hover); background: var(--default-button-color-hover);
border-color: transparent !important; border-color: transparent !important;
outline: none; outline: none;
} }
.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 {
.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: #fff; color: #fff;
background: var(--default-button-color-hover); background: var(--default-button-color-hover);
border-color: transparent !important; border-color: transparent !important;
outline: none; outline: none;
} }
.config-button { .config-button {
border: 1px solid transparent; border: 1px solid transparent;
outline: none; outline: none;
} }
.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 {
.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; outline: none !important;
border-color: transparent; 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-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 {
.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; outline: none;
} }
@ -142,26 +234,34 @@ outline: none;
.bootstrap-switch { .bootstrap-switch {
border: 1px solid rgba(255, 255, 255, .08); 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 {
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default {
color: #fff; color: #fff;
background: rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.25);
} }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary { .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
background-color: var(--default-button-color); background-color: var(--default-button-color);
color: #ffffff; color: #ffffff;
} }
.input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group {
.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group {
margin-left: -1px; margin-left: -1px;
background: #f0f8ff00; background: #f0f8ff00;
} }
.input-group-btn2 { .input-group-btn2 {
border: none; border: none;
background: var(--default-button-color); background: var(--default-button-color);
} }
.input-group-btn1 { .input-group-btn1 {
border: 1px solid var(--default-button-color); border: 1px solid var(--default-button-color);
background: var(--default-button-color); background: var(--default-button-color);
} }
/* Form Control */ /* Form Control */
.form-control { .form-control {
@ -169,14 +269,16 @@ outline: none;
background-color: #151515; background-color: #151515;
} }
.form-control:focus { .form-control:focus {
border-color: #fff0; border-color: #fff0;
outline: 0; outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 0, 0, 0.6);
} }
.input-group-addon { .input-group-addon {
outline: none; outline: none;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: 1px solid transparent; border: 1px solid transparent;
@ -187,10 +289,12 @@ outline: none;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: 1px solid transparent; border: 1px solid transparent;
} }
.repeatsection { .repeatsection {
background: rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
box-shadow: 0 0 4px 1px transparent; box-shadow: 0 0 4px 1px transparent;
} }
hr { hr {
border-top: 1px solid rgba(255, 255, 255, 0.25); border-top: 1px solid rgba(255, 255, 255, 0.25);
} }
@ -204,8 +308,9 @@ hr {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.modal-header { .modal-header {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -214,12 +319,14 @@ hr {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-bottom: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08);
} }
.modal-content { .modal-content {
border: 1px solid transparent; border: 1px solid transparent;
} }
.modal-footer { .modal-footer {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -228,7 +335,7 @@ hr {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-top: 1px solid rgba(255, 255, 255, 0.08); border-top: 1px solid rgba(255, 255, 255, 0.08);
} }
@ -238,6 +345,7 @@ hr {
border-color: transparent; border-color: transparent;
color: #fff; color: #fff;
} }
.panel-default>.panel-heading { .panel-default>.panel-heading {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
@ -246,6 +354,7 @@ hr {
color: #c8c8c8; color: #c8c8c8;
border-color: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.08);
} }
.list-group-item { .list-group-item {
background-color: rgba(0, 0, 0, 0.08); background-color: rgba(0, 0, 0, 0.08);
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
@ -255,16 +364,25 @@ hr {
table { table {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
.table>thead>tr>th { .table>thead>tr>th {
vertical-align: bottom; vertical-align: bottom;
border-bottom: 2px solid rgba(255, 255, 255, 0.25); 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 {
.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); border-top: 1px solid rgba(255, 255, 255, 0.15);
} }
.table-hover>tbody>tr:hover { .table-hover>tbody>tr:hover {
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
} }
pre { pre {
background-color: rgba(0, 0, 0, 0.45); background-color: rgba(0, 0, 0, 0.45);
border: 1px solid transparent; border: 1px solid transparent;

57
CSS/themes/ombi/ombi-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -30,9 +29,22 @@ body,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, legend {
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6,
legend {
color: var(--text-hover); color: var(--text-hover);
} }
@ -50,11 +62,12 @@ a:hover {
.forgot-password:hover { .forgot-password:hover {
color: var(--link-color-hover) !important; color: var(--link-color-hover) !important;
} }
/* SCROLLBAR */ /* SCROLLBAR */
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
border-radius: 3px; border-radius: 3px;
background: rgb(255 255 255 / 30%); background: rgb(255 255 255 / 30%);
} }
/* TOP NAV */ /* TOP NAV */
.top-search-bar .mat-form-field-flex { .top-search-bar .mat-form-field-flex {
@ -72,7 +85,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) { .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
@ -135,6 +148,7 @@ a:hover {
height: auto; height: auto;
width: 16rem !important; width: 16rem !important;
} }
[id*="nav-"] { [id*="nav-"] {
color: var(--text) !important; color: var(--text) !important;
} }
@ -257,11 +271,13 @@ a:hover {
max-height: 290px; max-height: 290px;
max-width: 12rem; max-width: 12rem;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.section h2 { .section h2 {
margin-left: 5px !important; margin-left: 5px !important;
} }
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.section h2 { .section h2 {
margin-left: 63px !important; margin-left: 63px !important;
@ -314,21 +330,24 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#info-wrapper .mat-card.mat-card-flat:not([class*=mat-elevation-z]) { #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%); 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; background: transparent;
} }
#info-wrapper .mat-card .label, #info-wrapper .mat-card .label,
#info-wrapper .mat-card .mat-card-header { #info-wrapper .mat-card .mat-card-header {
color: var(--text-hover); color: var(--text-hover);
} }
#info-wrapper .mat-card,#info-wrapper .mat-card-content { #info-wrapper .mat-card,
#info-wrapper .mat-card-content {
color: var(--text); color: var(--text);
} }
.btn-ombi { .btn-ombi {
background-color: rgba(0, 0, 0, 0.85) !important; background-color: rgba(0, 0, 0, 0.85) !important;
/* backdrop-filter: blur(10px) !important; /* backdrop-filter: blur(10px) !important;
@ -434,6 +453,7 @@ small.important {
color: var(--button-text) !important; color: var(--button-text) !important;
background-color: var(--button-color) !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) { .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%); 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); background: var(--button-color);
@ -468,7 +488,7 @@ button#sign-in {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
button.admin-cog { button.admin-cog {
@ -542,7 +562,7 @@ button.admin-cog {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-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) 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)
} }
@ -606,13 +626,15 @@ hr {
} }
.full-screenshot.enabled.overlay { .full-screenshot.enabled.overlay {
background-image: linear-gradient(180deg,transparent,50%,rgb(var(--accent-color), 0.1)); background-image: linear-gradient(180deg, transparent, 50%, rgb(var(--accent-color), 0.1));
} }
.social-icons-container { .social-icons-container {
background-color: hsl(0deg 0% 0% / 85%) !important; background-color: hsl(0deg 0% 0% / 85%) !important;
backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important; -webkit-backdrop-filter: blur(10px) !important;
} }
/* MODAL */ /* MODAL */
.mat-autocomplete-panel, .mat-autocomplete-panel,
.mat-dialog-container { .mat-dialog-container {
@ -623,7 +645,7 @@ hr {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.mat-bottom-sheet-container { .mat-bottom-sheet-container {
@ -634,7 +656,7 @@ hr {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* OTHER */ /* OTHER */
@ -646,9 +668,10 @@ hr {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.mat-progress-spinner.mat-accent circle,.mat-spinner.mat-accent circle { .mat-progress-spinner.mat-accent circle,
.mat-spinner.mat-accent circle {
stroke: rgb(var(--accent-color)); stroke: rgb(var(--accent-color));
} }

726
CSS/themes/ombi/ombiv3-base.css
View File

File diff suppressed because it is too large

1703
CSS/themes/organizr/organizr-base-old.css
View File

File diff suppressed because it is too large

170
CSS/themes/organizr/organizr-base.css
View File

@ -15,7 +15,7 @@
background-size: auto, cover !important; background-size: auto, cover !important;
-webkit-background-size: auto, cover !important; -webkit-background-size: auto, cover !important;
-moz-background-size: auto, cover !important; -moz-background-size: auto, cover !important;
-o-background-size: auto, cover !important; -o-background-size: auto, cover !important;
} }
.panel-footer { .panel-footer {
@ -26,7 +26,7 @@
background-size: auto, cover !important; background-size: auto, cover !important;
-webkit-background-size: auto, cover !important; -webkit-background-size: auto, cover !important;
-moz-background-size: auto, cover !important; -moz-background-size: auto, cover !important;
-o-background-size: auto, cover !important; -o-background-size: auto, cover !important;
} }
.panel-default .panel-body, .panel-default .panel-body,
@ -180,8 +180,9 @@ h6 {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.panel-body:not(.unifiCards .panel-body) { .panel-body:not(.unifiCards .panel-body) {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -190,7 +191,7 @@ h6 {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.bg-plex { .bg-plex {
@ -220,7 +221,7 @@ h6 {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
border-bottom: transparent border-bottom: transparent
} }
@ -234,7 +235,7 @@ h6 {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.css-bar-lg:after { .css-bar-lg:after {
@ -259,7 +260,7 @@ h6 {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* forms */ /* forms */
@ -405,7 +406,7 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -442,7 +443,7 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
th.text-center, th.text-center,
@ -548,7 +549,7 @@ th.fc-day-header.fc-widget-header.fc-today {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* loginpage sidemenu */ /* loginpage sidemenu */
@ -587,25 +588,30 @@ th.fc-day-header.fc-widget-header.fc-today {
background: rgba(0, 0, 0, 0.9) !important; background: rgba(0, 0, 0, 0.9) !important;
border: none !important; border: none !important;
} }
#organizr-login-heading > a,
#plex-login-heading > a, #organizr-login-heading>a,
#recoverform > div:nth-child(1) > div > h3, #plex-login-heading>a,
#recoverform > div:nth-child(1) > div > p { #recoverform>div:nth-child(1)>div>h3,
#recoverform>div:nth-child(1)>div>p {
color: #fff !important; color: #fff !important;
} }
#login-username-Input::placeholder, #login-username-Input::placeholder,
#login-password-Input::placeholder, #login-password-Input::placeholder,
#recover-input::placeholder { #recover-input::placeholder {
color: var(--text-muted) !important; color: var(--text-muted) !important;
} }
#to-recover, #to-recover,
label[for="checkbox-login"] { label[for="checkbox-login"] {
color: var(--link-color) !important; color: var(--link-color) !important;
} }
#to-recover:hover, #to-recover:hover,
label[for="checkbox-login"]:hover { label[for="checkbox-login"]:hover {
color: var(--link-color-hover) !important; color: var(--link-color-hover) !important;
} }
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) { @supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
.login-register>.login-box>.white-box { .login-register>.login-box>.white-box {
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.6); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
@ -1003,7 +1009,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* Homepage headers */ /* Homepage headers */
@ -1023,7 +1029,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* Homepage buttons */ /* Homepage buttons */
@ -1162,14 +1168,13 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-bottom: transparent; border-bottom: transparent;
} }
.iziToast.update-notify>.iziToast-body .iziToast-icon, .iziToast.update-notify>.iziToast-body .iziToast-icon,
.iziToast.success-notify>.iziToast-body .iziToast-icon .iziToast.success-notify>.iziToast-body .iziToast-icon .iziToast.warning-notify>.iziToast-body .iziToast-icon,
.iziToast.warning-notify>.iziToast-body .iziToast-icon, .iziToast.warning-notify>.iziToast-body .iziToast-icon {
.iziToast.warning-notify > .iziToast-body .iziToast-icon{
color: var(--link-color) !important; color: var(--link-color) !important;
} }
@ -1181,7 +1186,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.update-notify .iziToast-progressbar div, .update-notify .iziToast-progressbar div,
@ -1204,7 +1209,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-color: transparent; border-color: transparent;
} }
@ -1217,7 +1222,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-color: transparent; border-color: transparent;
} }
@ -1230,7 +1235,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-color: transparent; border-color: transparent;
} }
@ -1243,7 +1248,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-color: transparent; border-color: transparent;
} }
@ -1256,7 +1261,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #f44336; color: #f44336;
border: 1px solid transparent; border: 1px solid transparent;
border-bottom: transparent; border-bottom: transparent;
@ -1270,7 +1275,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #ffeb3b; color: #ffeb3b;
border: 1px solid transparent; border: 1px solid transparent;
border-bottom: transparent; border-bottom: transparent;
@ -1284,7 +1289,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #3a83f0; color: #3a83f0;
border: 1px solid transparent; border: 1px solid transparent;
border-bottom: transparent; border-bottom: transparent;
@ -1298,7 +1303,7 @@ label[for="checkbox-login"]:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #00ffb8; color: #00ffb8;
border: 1px solid transparent; border: 1px solid transparent;
border-bottom: transparent; border-bottom: transparent;
@ -1358,7 +1363,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-radius: 3px; border-radius: 3px;
} }
} }
@ -1488,7 +1493,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text-hover); color: var(--text-hover);
} }
@ -1518,7 +1523,7 @@ html {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -1530,7 +1535,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -1542,7 +1547,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/*Top Header Part*/ /*Top Header Part*/
@ -1552,8 +1557,9 @@ body {
@-moz-document url-prefix() { @-moz-document url-prefix() {
.navbar-header { .navbar-header {
background: transparent !important; background: transparent !important;
} }
.dropdown-menu { .dropdown-menu {
background: transparent !important; background: transparent !important;
} }
@ -1567,7 +1573,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.navbar-top-links>li>a { .navbar-top-links>li>a {
@ -1584,7 +1590,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/*Right panel*/ /*Right panel*/
@ -1596,7 +1602,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/*Bread Crumb*/ /*Bread Crumb*/
@ -1606,19 +1612,21 @@ body {
/*Sidebar*/ /*Sidebar*/
@media (max-width: 767px){ @media (max-width: 767px) {
.show-sidebar .sidebar,
.sidebar .sidebar-head { .show-sidebar .sidebar,
background: var(--modal-bg-color) !important; .sidebar .sidebar-head {
background-repeat: repeat, no-repeat; background: var(--modal-bg-color) !important;
background-attachment: fixed, fixed; background-repeat: repeat, no-repeat;
background-position: center center, center center; background-attachment: fixed, fixed;
background-size: auto, cover; background-position: center center, center center;
-webkit-background-size: auto, cover; background-size: auto, cover;
-moz-background-size: auto, cover; -webkit-background-size: auto, cover;
-o-background-size: auto, cover; -moz-background-size: auto, cover;
} -o-background-size: auto, cover;
}
} }
.sidebar { .sidebar {
background: rgba(0, 0, 0, 0.26) !important; background: rgba(0, 0, 0, 0.26) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -1627,9 +1635,9 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
box-shadow: 1px 0px 20px rgba(0, 0, 0, 0.08); box-shadow: 1px 0px 20px rgba(0, 0, 0, 0.08);
transition: max-width .2s cubic-bezier(.4,0,.2,1),background-color .2s ease-out; transition: max-width .2s cubic-bezier(.4, 0, .2, 1), background-color .2s ease-out;
} }
@ -1638,7 +1646,7 @@ body {
background: transparent; background: transparent;
} }
.sidebar:hover{ .sidebar:hover {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat !important; background-repeat: repeat, no-repeat !important;
background-attachment: fixed, fixed !important; background-attachment: fixed, fixed !important;
@ -1646,8 +1654,8 @@ body {
background-size: auto, cover !important; background-size: auto, cover !important;
-webkit-background-size: auto, cover !important; -webkit-background-size: auto, cover !important;
-moz-background-size: auto, cover !important; -moz-background-size: auto, cover !important;
-o-background-size: auto, cover !important; -o-background-size: auto, cover !important;
transition: max-width .2s cubic-bezier(.4,0,.2,1),background-color .2s ease-out; transition: max-width .2s cubic-bezier(.4, 0, .2, 1), background-color .2s ease-out;
} }
.sidebar .label-custom { .sidebar .label-custom {
@ -1695,6 +1703,7 @@ body {
.user-profile .user-pro-body .u-dropdown { .user-profile .user-pro-body .u-dropdown {
color: var(--text); color: var(--text);
} }
.drop-title { .drop-title {
color: var(--text-hover); color: var(--text-hover);
} }
@ -1730,10 +1739,11 @@ body {
} }
.bg-org:not([id="menu-"]div):not(.panel-heading) { .bg-org:not([id="menu-"]div):not(.panel-heading) {
background: var(--main-bg-color) !important;; background: var(--main-bg-color) !important;
;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/*Button*/ /*Button*/
@ -1791,7 +1801,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.table tbody tr.advance-table-row.active, .table tbody tr.advance-table-row.active,
@ -1845,7 +1855,7 @@ body {
.login-box, .login-box,
.white-box, .white-box,
body > div.mfp-wrap.mfp-auto-cursor.mfp-zoom-out.mfp-ready > div > div.mfp-content > div > div > div:nth-child(2) { body>div.mfp-wrap.mfp-auto-cursor.mfp-zoom-out.mfp-ready>div>div.mfp-content>div>div>div:nth-child(2) {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -1853,25 +1863,27 @@ body > div.mfp-wrap.mfp-auto-cursor.mfp-zoom-out.mfp-ready > div > div.mfp-conte
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
body > div.mfp-wrap.mfp-auto-cursor.mfp-zoom-out.mfp-ready > div > div.mfp-content > div > div > div.white-box.m-b-0.bg-info > h3 {
body>div.mfp-wrap.mfp-auto-cursor.mfp-zoom-out.mfp-ready>div>div.mfp-content>div>div>div.white-box.m-b-0.bg-info>h3 {
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.orgErrorAlert { .orgErrorAlert {
min-width: 478px; min-width: 478px;
width: calc(100% - 40px); width: calc(100% - 40px);
max-width: 1200px; max-width: 1200px;
background-color: var(--modal-bg-color) !important; background-color: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
/* #mediaSearch-area>div>div, /* #mediaSearch-area>div>div,
@ -1888,7 +1900,7 @@ body>div.mfp-wrap.mfp-auto-cursor.mfp-zoom-out.mfp-ready>div>div.mfp-content>div
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.panel { .panel {
@ -1921,7 +1933,7 @@ input,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.tabs-style-flip nav li.tab-current a { .tabs-style-flip nav li.tab-current a {
@ -1957,7 +1969,7 @@ input,
} }
#account-area > div > div > div > div > div.panel-wrapper.collapse.in.main-email-panel > div { #account-area>div>div>div>div>div.panel-wrapper.collapse.in.main-email-panel>div {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -1965,7 +1977,7 @@ input,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.tab-content .panel .panel-body, .tab-content .panel .panel-body,
@ -2021,7 +2033,7 @@ a.mytooltip {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
padding: 20px 30px; padding: 20px 30px;
text-align: left; text-align: left;
max-width: 75%; max-width: 75%;

39
CSS/themes/petio/petio-base.css
View File

@ -22,7 +22,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text) color: var(--text)
} }
@ -45,17 +45,19 @@ h4,
h5, h5,
h6, h6,
.person--details p, .person--details p,
.text-wrap > p, .text-wrap>p,
.card .text-wrap .title, .card .text-wrap .title,
.main-title, .main-title,
.media-details .media-title, .single-title, .media-details .media-title,
.single-title,
.sub-title, .sub-title,
.sub-title, .widget--title, .sub-title,
.widget--title,
.settings--menu--item p { .settings--menu--item p {
color: var(--text-hover); color: var(--text-hover);
} }
.card .text-wrap > p { .card .text-wrap>p {
color: var(--text-hover); color: var(--text-hover);
} }
@ -66,6 +68,7 @@ h6,
.settings--menu--item.active { .settings--menu--item.active {
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
.settings--menu--item:hover { .settings--menu--item:hover {
border-bottom: 1px solid var(--text-hover); border-bottom: 1px solid var(--text-hover);
} }
@ -90,7 +93,7 @@ h6,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -101,7 +104,7 @@ h6,
} }
@media (max-width: 991.98px) { @media (max-width: 991.98px) {
.menu { .menu {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -109,7 +112,7 @@ h6,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -121,7 +124,7 @@ h6,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.menu--item.active { .menu--item.active {
@ -166,8 +169,8 @@ h6,
.sidebar--item:hover .icon svg path, .sidebar--item:hover .icon svg path,
.menu--item:hover p, .menu--item:hover p,
.menu--item:hover .icon svg path { .menu--item:hover .icon svg path {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
fill: rgb(var(--accent-color)); fill: rgb(var(--accent-color));
} }
.sidebar--item .icon svg path, .sidebar--item .icon svg path,
@ -202,6 +205,7 @@ p a:hover,
.widget--item hr { .widget--item hr {
background: rgb(255 255 255 / 50%); background: rgb(255 255 255 / 50%);
} }
.widget--item--inner, .widget--item--inner,
.sr--instance--inner { .sr--instance--inner {
background: hsl(0deg 0% 0% / 15%); background: hsl(0deg 0% 0% / 15%);
@ -321,14 +325,15 @@ code {
} }
/* Keep Plex Button Color*/ /* Keep Plex Button Color*/
#root > div > div.login-wrap > div.login--inner > form > div:nth-child(7) > button, #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) { #root>div>div.view>div>div>div.settings--content>section:nth-child(2)>button:nth-child(3) {
background: #d79b23; background: #d79b23;
border: 2px solid #d79b23; border: 2px solid #d79b23;
color: #000; 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 { #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; background: #ab7b1c;
border-color: #ab7b1c; border-color: #ab7b1c;
} }
@ -418,7 +423,7 @@ thead {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.modal--top, .modal--top,
@ -431,7 +436,7 @@ thead {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* FORMS & INPUTS */ /* FORMS & INPUTS */

914
CSS/themes/pihole/pihole-base.css
View File

@ -1,125 +1,161 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* 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 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. */ /* 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 */ /* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
/* 88 */ /* 88 */
/* dP */ /* dP */
/* Made by @gilbN */ /* Made by @gilbN */
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
body { body {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #eee !important; color: #eee !important;
} }
a {
color: var(--link-color); a {
} color: var(--link-color);
a:hover, a:active, a:focus, }
.treeview-menu > li.active > a, .treeview-menu > li > a:hover {
color: var(--accent-color) !important; a:hover,
} a:active,
h4 { a:focus,
color: var(--accent-color); .treeview-menu>li.active>a,
} .treeview-menu>li>a:hover {
/* Donate dropdown */ color: var(--accent-color) !important;
.skin-blue .main-header li.user-header { }
background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; h4 {
background-attachment: fixed, fixed; color: var(--accent-color);
background-position: center center, center center; }
background-size: auto, cover;
-webkit-background-size: auto, cover; /* Donate dropdown */
-moz-background-size: auto, cover; .skin-blue .main-header li.user-header {
-o-background-size: auto, cover; background: var(--modal-bg-color);
} background-repeat: repeat, no-repeat;
.dropdown-menu { background-attachment: fixed, fixed;
box-shadow: none; background-position: center center, center center;
border-color: rgba(0, 0, 0, .25); background-size: auto, cover;
background: var(--modal-bg-color); -webkit-background-size: auto, cover;
background-repeat: repeat, no-repeat; -moz-background-size: auto, cover;
background-attachment: fixed, fixed; -o-background-size: auto, cover;
background-position: center center, center center; }
background-size: auto, cover;
-webkit-background-size: auto, cover; .dropdown-menu {
-moz-background-size: auto, cover; box-shadow: none;
-o-background-size: auto, cover; border-color: rgba(0, 0, 0, .25);
} background: var(--modal-bg-color);
.navbar-nav>.user-menu>.dropdown-menu>.user-body { background-repeat: repeat, no-repeat;
padding: 15px; background-attachment: fixed, fixed;
border-bottom: 1px solid rgba(255, 255, 255, .25); background-position: center center, center center;
border-top: 1px solid rgba(255, 255, 255, .25); background-size: auto, cover;
background-color: rgba(255, 255, 255, .2) !important; -webkit-background-size: auto, cover;
} -moz-background-size: auto, cover;
.navbar-nav>.user-menu>.dropdown-menu>.user-body a { -o-background-size: auto, cover;
color: white !important; }
}
.navbar-nav>.user-menu>.dropdown-menu>.user-footer { .navbar-nav>.user-menu>.dropdown-menu>.user-body {
background-color: transparent; padding: 15px;
} border-bottom: 1px solid rgba(255, 255, 255, .25);
/* Header */ border-top: 1px solid rgba(255, 255, 255, .25);
.skin-blue .main-header .navbar, .skin-blue .main-header .logo, background-color: rgba(255, 255, 255, .2) !important;
.main-header .navbar,.main-header .logo { }
background-color: rgba(0, 0, 0, .25);
} .navbar-nav>.user-menu>.dropdown-menu>.user-body a {
.skin-blue .main-header .logo:hover, .skin-blue .main-header .navbar .sidebar-toggle:hover, color: white !important;
.sidebar-menu > li:hover > a, .sidebar-menu > li.active > a { }
background-color: rgba(255, 255, 255, .05);
color: white !important; .navbar-nav>.user-menu>.dropdown-menu>.user-footer {
} background-color: transparent;
/* Footer */ }
.main-footer {
background: rgba(0, 0, 0, .25); /* Header */
color: #eee; .skin-blue .main-header .navbar,
border-top: 1px solid rgb(255 255 255 / 20%); .skin-blue .main-header .logo,
} .main-header .navbar,
/* Side bar */ .main-header .logo {
.skin-blue .sidebar a { background-color: rgba(0, 0, 0, .25);
color: #eee; }
}
.skin-blue .sidebar a:hover { .skin-blue .main-header .logo:hover,
color: white !important; .skin-blue .main-header .navbar .sidebar-toggle:hover,
} .sidebar-menu>li:hover>a,
.skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side, .sidebar-menu>li.active>a {
.wrapper, .main-sidebar, .left-side { background-color: rgba(255, 255, 255, .05);
background-color: rgba(0, 0, 0, .25) !important; color: white !important;
} }
.skin-blue .sidebar-menu>li.header,
.sidebar-menu > li.header { /* Footer */
color: white; .main-footer {
background: rgba(0, 0, 0, .2); background: rgba(0, 0, 0, .25);
} color: #eee;
.treeview-menu > li > a { border-top: 1px solid rgb(255 255 255 / 20%);
color: #eee !important; }
}
.sidebar-menu > li > .treeview-menu { /* Side bar */
background-color: rgb(0 0 0 / 25%); .skin-blue .sidebar a {
} color: #eee;
/* 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 { .skin-blue .sidebar a:hover {
color: #fff; color: white !important;
background: rgba(0, 0, 0, .1); }
border-left-color: var(--accent-color);
} .skin-blue .wrapper,
.skin-blue .sidebar-menu>li>.treeview-menu { .skin-blue .main-sidebar,
background: rgba(0, 0, 0, .25); .skin-blue .left-side,
} .wrapper,
.skin-blue .treeview-menu>li>a { .main-sidebar,
color: #eee; .left-side {
} background-color: rgba(0, 0, 0, .25) !important;
/* 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 { .skin-blue .sidebar-menu>li.header,
.sidebar-menu>li.header {
color: white;
background: rgba(0, 0, 0, .2);
}
.treeview-menu>li>a {
color: #eee !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: #fff;
background: rgba(0, 0, 0, .1);
border-left-color: var(--accent-color);
}
.skin-blue .sidebar-menu>li>.treeview-menu {
background: rgba(0, 0, 0, .25);
}
.skin-blue .treeview-menu>li>a {
color: #eee;
}
/* 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(--main-bg-color); background: var(--main-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -127,55 +163,68 @@ a:hover, a:active, a:focus,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #eee; color: #eee;
}
} }
/* Pages */ }
/*Background*/
.content-wrapper, .right-side { /* Pages */
background-color: var(--main-bg-color); /*Background*/
background-repeat: repeat, no-repeat; .content-wrapper,
background-attachment: fixed, fixed; .right-side {
background-position: center center, center center; background-color: var(--main-bg-color);
background-size: auto, cover; background-repeat: repeat, no-repeat;
-webkit-background-size: auto, cover; background-attachment: fixed, fixed;
-moz-background-size: auto, cover; background-position: center center, center center;
-o-background-size: auto, cover; background-size: auto, cover;
} -webkit-background-size: auto, cover;
.page-header>small { -moz-background-size: auto, cover;
color: #ddd; -o-background-size: auto, cover;
} }
.main-footer .nav-tabs, .nav-tabs-custom .nav-tabs {
background-color: rgb(0 0 0 / 0.25); .page-header>small {
border-bottom-color: rgb(255 255 255 / 15%); color: #ddd;
} }
.nav-tabs-custom>.nav-tabs>li:hover {
background-color: rgba(255, 255, 255, .05); .main-footer .nav-tabs,
color: #eee; .nav-tabs-custom .nav-tabs {
border-top-color: var(--accent-color); background-color: rgb(0 0 0 / 0.25);
} border-bottom-color: rgb(255 255 255 / 15%);
.nav-tabs-custom > .nav-tabs > li:hover > a { }
background-color: rgba(255, 255, 255, .05);
} .nav-tabs-custom>.nav-tabs>li:hover {
/* Dashboard */ background-color: rgba(255, 255, 255, .05);
/*Total Queries box */ color: #eee;
.box-header { border-top-color: var(--accent-color);
color: white; }
}
.box { .nav-tabs-custom>.nav-tabs>li:hover>a {
background: rgba(0, 0, 0, .24); background-color: rgba(255, 255, 255, .05);
border-top: 3px solid #0000; }
box-shadow: 0 1px 1px rgba(0,0,0,0.1);
} /* Dashboard */
.box-solid > .box-header, .box > .box-header { /*Total Queries box */
color: #eee; .box-header {
background-color: rgba(0, 0, 0, .25); color: white;
} }
.box.box-warning {
border-top-color: var(--accent-color); .box {
} background: rgba(0, 0, 0, .24);
/* border-top: 3px solid #0000;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
.box-solid>.box-header,
.box>.box-header {
color: #eee;
background-color: rgba(0, 0, 0, .25);
}
.box.box-warning {
border-top-color: var(--accent-color);
}
/*
.chart svg, .chart canvas, .chartjs-render-monitor, .chart-legend { .chart svg, .chart canvas, .chartjs-render-monitor, .chart-legend {
-webkit-filter: invert(100%); -webkit-filter: invert(100%);
filter: invert(100%); filter: invert(100%);
@ -188,228 +237,311 @@ a:hover, a:active, a:focus,
filter: invert(100%); filter: invert(100%);
} }
*/ */
/* Total queries box*/ /* Total queries box*/
.small-box.bg-green { .small-box.bg-green {
background-color: rgba(0, 166, 90, .45) !important; background-color: rgba(0, 166, 90, .45) !important;
border-top: 3px solid var(--accent-color); border-top: 3px solid var(--accent-color);
} }
/* Queries blocked box*/
.small-box.bg-aqua {
background-color: rgba(0, 192, 239, .45) !important;
border-top: 3px solid var(--accent-color);
}
/* Percent blocked box */
.small-box.bg-yellow {
background-color: rgba(243, 156, 18, .45) !important;
border-top: 3px solid var(--accent-color);
}
/*Blocklist box*/
.small-box.bg-red {
background-color: rgba(221, 75, 57, .45) !important;
border-top: 3px solid var(--accent-color);
}
.table-bordered {
border: 1px solid #f4f4f41a !important;
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>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover,
.dataTables_paginate .pagination li > a{
color: rgba(238, 238, 238, .5);
background-color: rgba(255, 255, 255, .1);
border-color: #ddd0;
}
.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: #fff;
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: #fff !important;
background-color: var(--button-color-hover);
border-color: var(--button-color-hover);
}
.pagination>li>a {
background: rgba(0, 0, 0, 0.25);
color: #eee;
border: 1px solid rgba(255, 255, 255, 0.07);
}
.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover {
color: rgb(255, 255, 255) !important;
background-color: rgba(255, 255, 255, .25);
border-color: rgba(255, 255, 255, 0.07);
}
/* Login */
.panel-default {
border-color: transparent;
background: rgba(0, 0, 0, 0.25);
}
.panel-default>.panel-heading {
color: #eee;
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: #bec5cb;
}
/* Blacklist */ /* Queries blocked box*/
.nav-tabs-custom { .small-box.bg-aqua {
background: rgba(0, 0, 0, 0.25); background-color: rgba(0, 192, 239, .45) !important;
} border-top: 3px solid var(--accent-color);
.nav-tabs-custom>.tab-content { }
background: transparent;
}
.nav-tabs-custom>.nav-tabs>li.active {
border-top-color: 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: #eee !important;
}
.nav-tabs-custom>.nav-tabs>li>a {
color: #eee !important;
border-radius: 0;
}
.input-group .input-group-addon {
border-radius: 0;
border-color: #d2d6de00;
background-color: var(--accent-color);
color: #eee;
}
/* Network */ /* Percent blocked box */
.table-striped>tbody>tr:nth-of-type(odd) { .small-box.bg-yellow {
background-color:rgba(0, 0, 0, .25) !important; background-color: rgba(243, 156, 18, .45) !important;
} border-top: 3px solid var(--accent-color);
.table-striped>tbody>tr:nth-of-type(even) { }
background-color:rgba(0, 0, 0, .5) !important;
} /*Blocklist box*/
#network-entries_wrapper.text-center { .small-box.bg-red {
text-align: center; background-color: rgba(221, 75, 57, .45) !important;
color: #eee !important; border-top: 3px solid var(--accent-color);
} }
/* Buttons */
button,.btn-default { .table-bordered {
background-color:var(--button-color) !important; border: 1px solid #f4f4f41a !important;
border:1px solid var(--button-color) !important; background: rgba(0, 0, 0, .1);
color: white !important; }
}
.btn-primary:hover, .btn-primary:active, .btn-primary.hover { .table-bordered>thead>tr>th,
background-color: var(--button-color-hover) !important; .table-bordered>tbody>tr>th,
} .table-bordered>tfoot>tr>th,
.btn-default:hover, .btn-default:active, .btn-default.hover { .table-bordered>thead>tr>td,
background-color: var(--button-color-hover) !important; .table-bordered>tbody>tr>td,
} .table-bordered>tfoot>tr>td {
.box.box-solid>.box-header .btn:hover, .box.box-solid>.box-header a:hover { border: 1px solid rgba(255, 255, 255, 0.15);
background: var(--button-color-hover) !important; }
border: 1px solid transparent !important
} .table-striped>tbody>tr:nth-of-type(odd) {
.box.box-solid.box-info>.box-header, .box.box-solid.box-info { background-color: rgba(255, 255, 255, .1);
color: #fff; }
background: var(--button-color) !important;
border: 1px solid var(--button-color) !important; /* Query Log */
} .text-black {
.btn-danger { color: #eee !important;
background-color: #dd4b39 !important; }
border-color: #d73925 !important;
} .pagination>.disabled>a,
.btn-danger:hover, .btn-danger:active, .btn-danger.hover { .pagination>.disabled>a:focus,
background-color: #d73925 !important; .pagination>.disabled>a:hover,
} .pagination>.disabled>span,
.btn-warning { .pagination>.disabled>span:focus,
background-color: #f39c12 !important; .pagination>.disabled>span:hover,
border-color: #e08e0b !important; .dataTables_paginate .pagination li>a {
} color: rgba(238, 238, 238, .5);
.btn-warning:hover { background-color: rgba(255, 255, 255, .1);
color: #fff; border-color: #ddd0;
background-color: #ec971f !important; }
border-color: #d58512 !important;
} .pagination>.active>a,
.icheck-primary>input:first-child:checked+input[type=hidden]+label::before, .icheck-primary>input:first-child:checked+label::before { .pagination>.active>a:focus,
background-color: var(--button-color) !important; .pagination>.active>a:hover,
border-color: var(--button-color) !important; .pagination>.active>span,
} .pagination>.active>span:focus,
.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 { .pagination>.active>span:hover,
border-color: var(--button-color) !important; .paginate_button .active #all-queries_wrapper .pagination>li>a {
} color: #fff;
/* Input */ background-color: var(--button-color);
input,.form-control,pre,.box-footer,.datatables_processing { border-color: var(--button-color);
background:#080909; }
border:1px solid #666;
color:#b2b2b2; .pagination>.active>a,
} .pagination>.active>a:focus,
.dataTables_wrapper input[type="search"] { .pagination>.active>a:hover,
background-color: #ffffff; .pagination>.active>span,
color: #000000; .pagination>.active>span:focus,
} .pagination>.active>span:hover {
input, color: #fff !important;
select, background-color: var(--button-color-hover);
select.form-control, border-color: var(--button-color-hover);
.form-group .input-group-addon, }
.input-group .input-group-addon,
.form-group input, .pagination>li>a {
.input-group input, background: rgba(0, 0, 0, 0.25);
.form-group textarea, color: #eee;
.input-group textarea, border: 1px solid rgba(255, 255, 255, 0.07);
.daterangepicker select.hourselect, }
.daterangepicker select.minuteselect,
.daterangepicker select.secondselect, .pagination>li>a:focus,
.daterangepicker select.ampmselect, .pagination>li>a:hover,
.form-control, .pagination>li>span:focus,
div.dataTables_wrapper div.dataTables_length select { .pagination>li>span:hover {
background-color: rgb(0 0 0 / 0.25); color: rgb(255, 255, 255) !important;
color: #eee; background-color: rgba(255, 255, 255, .25);
border: 1px solid rgb(255 255 255 / 15%); border-color: rgba(255, 255, 255, 0.07);
} }
.form-control:focus {
border-color: rgb(255 255 255 / 0.25); /* Login */
box-shadow: none; .panel-default {
} border-color: transparent;
/* Scrollbar */ background: rgba(0, 0, 0, 0.25);
}
::-webkit-scrollbar {
width: 0px; .panel-default>.panel-heading {
} color: #eee;
::-webkit-scrollbar-thumb { background-color: inherit;
min-height: 50px; border-color: transparent;
border: 3px solid transparent; }
border-radius: 8px;
background-color: hsla(0,0%,100%,.2); .panel,
background-clip: padding-box; .panel-body,
} .panel-default>.panel-heading {
::-webkit-scrollbar-track { background-color: rgb(0 0 0 / 25%);
background: var(--main-bg-color); border-radius: 0px;
background-repeat: repeat, no-repeat; border: 1px solid transparent;
background-attachment: fixed, fixed; color: #bec5cb;
background-position: center center, center center; }
background-size: auto, cover;
-webkit-background-size: auto, cover; /* Blacklist */
-moz-background-size: auto, cover; .nav-tabs-custom {
-o-background-size: auto, cover; background: rgba(0, 0, 0, 0.25);
} }
::-webkit-scrollbar-thumb:hover {
min-height: 50px; .nav-tabs-custom>.tab-content {
border: 3px solid transparent; background: transparent;
border-radius: 8px; }
background-color: hsla(0,0%,100%,.5);
background-clip: padding-box; .nav-tabs-custom>.nav-tabs>li.active {
} border-top-color: 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: #eee !important;
}
.nav-tabs-custom>.nav-tabs>li>a {
color: #eee !important;
border-radius: 0;
}
.input-group .input-group-addon {
border-radius: 0;
border-color: #d2d6de00;
background-color: var(--accent-color);
color: #eee;
}
/* 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: #eee !important;
}
/* Buttons */
button,
.btn-default {
background-color: var(--button-color) !important;
border: 1px solid var(--button-color) !important;
color: white !important;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.hover {
background-color: var(--button-color-hover) !important;
}
.btn-default:hover,
.btn-default:active,
.btn-default.hover {
background-color: var(--button-color-hover) !important;
}
.box.box-solid>.box-header .btn:hover,
.box.box-solid>.box-header a:hover {
background: var(--button-color-hover) !important;
border: 1px solid transparent !important
}
.box.box-solid.box-info>.box-header,
.box.box-solid.box-info {
color: #fff;
background: var(--button-color) !important;
border: 1px solid var(--button-color) !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;
}
.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: #080909;
border: 1px solid #666;
color: #b2b2b2;
}
.dataTables_wrapper input[type="search"] {
background-color: #ffffff;
color: #000000;
}
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: #eee;
border: 1px solid rgb(255 255 255 / 15%);
}
.form-control:focus {
border-color: rgb(255 255 255 / 0.25);
box-shadow: none;
}
/* 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;
}

5
CSS/themes/plex/plex-base.css
View File

@ -178,17 +178,20 @@ a[class*="MetadataTableRow-title-"]:hover {
} }
[class*="NavBarActivityButton-isHighlighted-"] [class*="NavBarActivityButton-activityIcon-"] { [class*="NavBarActivityButton-isHighlighted-"] [class*="NavBarActivityButton-activityIcon-"] {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
/* old plex web */ /* old plex web */
.NavBarActivityButton-isHighlighted-2YqjDs .NavBarActivityButton-activityIcon-3gF_TD { .NavBarActivityButton-isHighlighted-2YqjDs .NavBarActivityButton-activityIcon-3gF_TD {
background-color: rgb(var(--accent-color)); background-color: rgb(var(--accent-color));
color: var(--label-text-color); color: var(--label-text-color);
} }
.NavBarActivityButton-isHighlighted-2YqjDs:hover .NavBarActivityButton-activityIcon-3gF_TD { .NavBarActivityButton-isHighlighted-2YqjDs:hover .NavBarActivityButton-activityIcon-3gF_TD {
background-color: var(--accent-color-hover); background-color: var(--accent-color-hover);
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
/* /old plex web */ /* /old plex web */
[class*="NavBarActivityButton-isHighlighted-"]:hover [class*="NavBarActivityButton-activityIcon-"] { [class*="NavBarActivityButton-isHighlighted-"]:hover [class*="NavBarActivityButton-activityIcon-"] {

266
CSS/themes/plpp/plpp-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -12,28 +11,30 @@
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
body { body {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
background-color: transparent; background-color: transparent;
color:hsla(0,0%,100%,.7)!important; color: hsla(0, 0%, 100%, .7) !important;
font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif !important; font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif !important;
font-size: 1.4em !important; font-size: 1.4em !important;
overflow-y: auto; overflow-y: auto;
height: 100%; height: 100%;
} }
/* Scrollbar */
@media only screen and (min-width: 768px) { /* Scrollbar */
@media only screen and (min-width: 768px) {
html { html {
height: 100%; height: 100%;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
} }
body { body {
overflow-y: auto; overflow-y: auto;
height: 100%; height: 100%;
@ -44,29 +45,34 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
::-webkit-scrollbar {
width: 14px; ::-webkit-scrollbar {
} width: 14px;
::-webkit-scrollbar-thumb { }
min-height: 50px;
border: 3px solid transparent; ::-webkit-scrollbar-thumb {
border-radius: 8px; min-height: 50px;
background-color: hsla(0,0%,100%,.2); border: 3px solid transparent;
background-clip: padding-box; border-radius: 8px;
} background-color: hsla(0, 0%, 100%, .2);
::-webkit-scrollbar-track { background-clip: padding-box;
background-color: transparent; }
}
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-track {
min-height: 50px; background-color: transparent;
border: 3px solid transparent; }
border-radius: 8px;
background-color: hsla(0,0%,100%,.5); ::-webkit-scrollbar-thumb:hover {
background-clip: padding-box; min-height: 50px;
} border: 3px solid transparent;
border-radius: 8px;
background-color: hsla(0, 0%, 100%, .5);
background-clip: padding-box;
}
legend { legend {
border-bottom: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08);
} }
@ -75,134 +81,204 @@ legend {
background-color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.6);
border-color: transparent; border-color: transparent;
} }
.side-nav { .side-nav {
background-color: rgba(0, 0, 0, 0.15); 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 {
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); .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 {
.nav>li.selected>a {
background-color: transparent; background-color: transparent;
color: #f9be03 !important; color: #f9be03 !important;
} }
@media only screen and (max-width: 768px) {
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { @media only screen and (max-width: 768px) {
border-color: transparent;
background: var(--modal-bg-color); .navbar-inverse .navbar-collapse,
background-repeat: repeat, no-repeat; .navbar-inverse .navbar-form {
background-attachment: fixed, fixed; border-color: transparent;
background-position: center center, center center; background: var(--modal-bg-color);
background-size: auto, cover; background-repeat: repeat, no-repeat;
-webkit-background-size: auto, cover; background-attachment: fixed, fixed;
-moz-background-size: auto, cover; background-position: center center, center center;
-o-background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover;
-moz-background-size: auto, cover;
-o-background-size: auto, cover;
}
} }
}
.breadcrumb > .active { .breadcrumb>.active {
text-transform: uppercase; text-transform: uppercase;
text-transform: bold; text-transform: bold;
} }
.panel, .panel-default > .panel-heading, .breadcrumb > .active {
.panel,
.panel-default>.panel-heading,
.breadcrumb>.active {
background-color: transparent; background-color: transparent;
border: transparent; border: transparent;
color: inherit; color: inherit;
font-size: 15px; font-size: 15px;
font-family: Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif !important; font-family: Open Sans Bold, Helvetica Neue, Helvetica, Arial, sans-serif !important;
line-height: 24px; line-height: 24px;
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0); 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; .plpp_table.even:hover,
.plpp_table.odd:hover {
background-color: hsla(0, 0%, 100%, .08) !important;
} }
.panel-heading {
font-weight: bold; .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_Title:hover,
.plpp_thumbs_Show_Title:hover, .plpp_slider_Show_Title:hover, .plpp_thumbs_Artist:hover, .plpp_slider_Artist:hover, .plpp_slider_Title:hover,
.plpp_thumbs_Year:hover, .plpp_thumbs_Episode_No:hover, .plpp_slider_Year:hover, .plpp_slider_Episode_no:hover, .plpp_thumbs_Episode_Title:hover,
.plpp_thumbs_Track_no:hover, .plpp_slider_Track_no:hover, .plpp_thumbs_Episode_Count:hover, .plpp_slider_Episode_Count:hover, .plpp_slider_Episode_Title:hover,
.plpp_thumbs_Track_Count:hover, .plpp_slider_Track_Count:hover, .plpp_thumbs_Dimensions:hover, .plpp_slider_Dimensions:hover, .plpp_thumbs_Season_Title:hover,
.plpp_thumbs_Duration:hover, .plpp_slider_Duration:hover { .plpp_slider_Season_Title:hover,
text-decoration: underline; .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 { .img-rounded {
border-radius: 0px; border-radius: 0px;
} }
.img-rounded:hover { .img-rounded:hover {
border-radius: 0px; border-radius: 0px;
box-shadow: 0 0 0 2px #cc7b19; box-shadow: 0 0 0 2px #cc7b19;
background: radial-gradient(farthest-corner at 50% 50%,rgba(50,50,50,.5) 50%,#323232 100%); background: radial-gradient(farthest-corner at 50% 50%, rgba(50, 50, 50, .5) 50%, #323232 100%);
opacity: .7; opacity: .7;
transition: linear .2s; transition: linear .2s;
} }
.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
.img-responsive,
.thumbnail>img,
.thumbnail a>img,
.carousel-inner>.item>img,
.carousel-inner>.item>a>img {
width: 100%; width: 100%;
} }
div.modal-content > div.modal-body > div.plpp_details_container > div.plpp_details_Thumbnail, div.plpp_details_Poster > .img-rounded {
div.modal-content>div.modal-body>div.plpp_details_container>div.plpp_details_Thumbnail,
div.plpp_details_Poster>.img-rounded {
box-shadow: none; box-shadow: none;
opacity: 1; opacity: 1;
} }
div.plpp_slider { div.plpp_slider {
margin: 2px 15px 10px 2px; margin: 2px 15px 10px 2px;
} }
table { table {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
table, .table {
color: hsla(0,0%,100%,.7); 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,
.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 {
.table>thead>tr>th {
vertical-align: bottom; vertical-align: bottom;
border-bottom: 2px solid rgba(255,255,255,.15); border-bottom: 2px solid rgba(255, 255, 255, .15);
} }
.pagination > li > a, .pagination > li > span {
.pagination>li>a,
.pagination>li>span {
color: #ffffff; color: #ffffff;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: transparent; border: transparent;
} }
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
.pagination>.disabled>span,
.pagination>.disabled>span:hover,
.pagination>.disabled>span:focus,
.pagination>.disabled>a,
.pagination>.disabled>a:hover,
.pagination>.disabled>a:focus {
color: #BDBDBD; color: #BDBDBD;
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: transparent; border: transparent;
cursor: not-allowed; cursor: not-allowed;
} }
/* Modal */ /* Modal */
.modal-header, div.modal-body, .modal-footer { .modal-header,
border-bottom: 1px solid rgba(255,255,255,.15); div.modal-body,
background: var(--modal-bg-color); .modal-footer {
border-bottom: 1px solid rgba(255, 255, 255, .15);
background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* Buttons */ /* Buttons */
.btn-default { .btn-default {
background-color: var(--button-color); background-color: var(--button-color);
border-color: transparent; border-color: transparent;
} }
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
border-color: transparent; border-color: transparent;
} }
.modal-header .close { .modal-header .close {
color: #dadada; color: #dadada;
} }
.modal-header .close:hover { .modal-header .close:hover {
color: #fff; color: #fff;
} }

35
CSS/themes/prowlarr/prowlarr-base.css
View File

@ -116,7 +116,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text-hover); color: var(--text-hover);
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
@ -129,7 +129,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -141,7 +141,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff; color: #fff;
border-top: 1px solid rgb(var(--accent-color)); border-top: 1px solid rgb(var(--accent-color));
} }
@ -214,7 +214,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff !important; color: #fff !important;
box-shadow: 0 0 10px 1px transparent !important; box-shadow: 0 0 10px 1px transparent !important;
} }
@ -242,7 +242,7 @@ a:hover {
} }
[class*="PageSidebarItem-isActiveLink-"], [class*="PageSidebarItem-isActiveLink-"],
[class*="PageSidebarItem-isActiveLink-"]:hover, [class*="PageSidebarItem-isActiveLink-"]:hover,
[class*="PageSidebarItem-link-"]:focus { [class*="PageSidebarItem-link-"]:focus {
color: rgb(var(--accent-color)) !important; color: rgb(var(--accent-color)) !important;
} }
@ -260,7 +260,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -380,7 +380,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
[class*="Tooltip-tooltipContainer-"] { [class*="Tooltip-tooltipContainer-"] {
@ -516,7 +516,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -563,9 +563,10 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
[class*="EnhancedSelectInputOption-isSelected-"], [class*="EnhancedSelectInputOption-isSelected-"],
[class*="EnhancedSelectInputOption-isSelected-"]:hover { [class*="EnhancedSelectInputOption-isSelected-"]:hover {
background-color: rgba(255, 255, 255, 0.20) !important; background-color: rgba(255, 255, 255, 0.20) !important;
@ -656,6 +657,7 @@ a:hover {
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -664,6 +666,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -672,6 +675,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -680,6 +684,7 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -711,7 +716,7 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: white; color: white;
} }
@ -1057,12 +1062,14 @@ input[type=password] {
background-color: var(--button-color); background-color: var(--button-color);
cursor: pointer; cursor: pointer;
} }
.button:hover { .button:hover {
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
.form-input:focus { .form-input:focus {
outline: 0; outline: 0;
border-color: #fff; border-color: #fff;
@ -1085,10 +1092,10 @@ input[type=password] {
/* ChartJS */ /* ChartJS */
[class*="Stats-fullWidthChart-"], [class*="Stats-fullWidthChart-"],
[class*="Stats-halfWidthChart-"]{ [class*="Stats-halfWidthChart-"] {
background: rgba(0, 0, 0, .25) !important; background: rgba(0, 0, 0, .25) !important;
} }
canvas { canvas {
filter: invert(1) filter: invert(1)
} }

33
CSS/themes/qbittorrent/qbittorrent-base.css
View File

@ -41,7 +41,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#desktop { #desktop {
@ -52,7 +52,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
input:disabled { input:disabled {
@ -236,7 +236,7 @@ label {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#desktopNavbar li ul li a { #desktopNavbar li ul li a {
@ -251,7 +251,7 @@ label {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#desktopFooter { #desktopFooter {
@ -300,19 +300,22 @@ label {
} }
.dynamicTable tbody tr.selected { .dynamicTable tbody tr.selected {
background-color: rgba(var(--accent-color),0.6) !important; background-color: rgba(var(--accent-color), 0.6) !important;
color: var(--label-text-color); color: var(--label-text-color);
} }
.dynamicTable th.sorted.reverse { .dynamicTable th.sorted.reverse {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/qbittorrent/go-down.png) !important; background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/qbittorrent/go-down.png) !important;
} }
.dynamicTable th.sorted { .dynamicTable th.sorted {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/qbittorrent/go-up.png) !important; background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/qbittorrent/go-up.png) !important;
background-size: 9px !important; background-size: 9px !important;
background-position: right !important; background-position: right !important;
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
} }
.panel { .panel {
background: var(--main-bg-color); background: var(--main-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -321,7 +324,7 @@ label {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border-bottom: 1px solid transparent; border-bottom: 1px solid transparent;
} }
@ -403,7 +406,7 @@ li.divider {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.contextMenu li a { .contextMenu li a {
@ -414,9 +417,8 @@ li.divider {
background-color: rgba(255, 255, 255, .08) !important; background-color: rgba(255, 255, 255, .08) !important;
color: var(--text-hover); color: var(--text-hover);
} }
.contextMenu li a:hover {
} .contextMenu li a:hover {}
.contextMenu li ul { .contextMenu li ul {
border: 1px solid transparent; border: 1px solid transparent;
@ -427,7 +429,7 @@ li.divider {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.contextMenu .separator { .contextMenu .separator {
@ -436,7 +438,7 @@ li.divider {
/* Sidemenu */ /* Sidemenu */
.selectedFilter { .selectedFilter {
background-color: rgba(var(--accent-color),0.6); background-color: rgba(var(--accent-color), 0.6);
color: #eee; color: #eee;
} }
@ -445,7 +447,7 @@ li.divider {
} }
ul.filterList li:hover { ul.filterList li:hover {
background-color: rgba(var(--accent-color),0.6); background-color: rgba(var(--accent-color), 0.6);
color: var(--button-color-hover) !important; color: var(--button-color-hover) !important;
} }
@ -567,7 +569,7 @@ fieldset {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.mochaToolbarWrapper { .mochaToolbarWrapper {
@ -1778,7 +1780,8 @@ img[src="icons/checking.svg"] {
.contextMenu li a.arrow-right, .contextMenu li a.arrow-right,
.contextMenu li a:hover.arrow-right, .contextMenu li a:hover.arrow-right,
.contextMenu li a.arrow-right, .contextMenu li a:hover.arrow-right { .contextMenu li a.arrow-right,
.contextMenu li a:hover.arrow-right {
background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/qbittorrent/arrow-right.gif); background-image: url(https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/qbittorrent/arrow-right.gif);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right center; background-position: right center;

34
CSS/themes/radarr/radarr-base.css
View File

@ -116,7 +116,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text-hover); color: var(--text-hover);
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
@ -129,7 +129,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -141,7 +141,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff; color: #fff;
border-top: 1px solid rgb(var(--accent-color)); border-top: 1px solid rgb(var(--accent-color));
} }
@ -213,7 +213,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff !important; color: #fff !important;
box-shadow: 0 0 10px 1px transparent !important; box-shadow: 0 0 10px 1px transparent !important;
} }
@ -241,7 +241,7 @@ a:hover {
} }
[class*="PageSidebarItem-isActiveLink-"], [class*="PageSidebarItem-isActiveLink-"],
[class*="PageSidebarItem-isActiveLink-"]:hover, [class*="PageSidebarItem-isActiveLink-"]:hover,
[class*="PageSidebarItem-link-"]:focus { [class*="PageSidebarItem-link-"]:focus {
color: rgb(var(--accent-color)) !important; color: rgb(var(--accent-color)) !important;
} }
@ -259,7 +259,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -272,6 +272,7 @@ a:hover {
[class*="MovieIndexPoster-controls-"] { [class*="MovieIndexPoster-controls-"] {
background-color: rgb(var(--accent-color)) !important; background-color: rgb(var(--accent-color)) !important;
} }
[class*="MovieTitlesTableContent-blankpad-"], [class*="MovieTitlesTableContent-blankpad-"],
[class*="ExtraFileTableContent-blankpad-"], [class*="ExtraFileTableContent-blankpad-"],
[class*="MovieHistoryTableContent-blankpad-"] { [class*="MovieHistoryTableContent-blankpad-"] {
@ -380,7 +381,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
[class*="Tooltip-tooltipContainer-"] { [class*="Tooltip-tooltipContainer-"] {
@ -405,7 +406,7 @@ a:hover {
} }
[class*="Label-default-"] [class*="IconButton-button-"], [class*="Label-default-"] [class*="IconButton-button-"],
[class*="Label-small-"] [class*="IconButton-button-"]:hover { [class*="Label-small-"] [class*="IconButton-button-"]:hover {
color: var(--label-text-color); color: var(--label-text-color);
} }
@ -521,7 +522,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -568,9 +569,10 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
[class*="EnhancedSelectInputOption-isSelected-"], [class*="EnhancedSelectInputOption-isSelected-"],
[class*="EnhancedSelectInputOption-isSelected-"]:hover { [class*="EnhancedSelectInputOption-isSelected-"]:hover {
background-color: rgba(255, 255, 255, 0.20) !important; background-color: rgba(255, 255, 255, 0.20) !important;
@ -630,7 +632,7 @@ a:hover {
[class*="PageContentBody-innerContentBody-"], [class*="PageContentBody-innerContentBody-"],
[class*="PageContentBody-contentBody-"], [class*="PageContentBody-contentBody-"],
.react-tabs__tab-panel .react-tabs__tab-panel--selected > div { .react-tabs__tab-panel .react-tabs__tab-panel--selected>div {
color: var(--text); color: var(--text);
} }
@ -663,6 +665,7 @@ a:hover {
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -671,6 +674,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -679,6 +683,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -687,6 +692,7 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -718,7 +724,7 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: white; color: white;
} }
@ -1057,12 +1063,14 @@ input[type=password] {
background-color: var(--button-color); background-color: var(--button-color);
cursor: pointer; cursor: pointer;
} }
.button:hover { .button:hover {
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
.form-input:focus { .form-input:focus {
outline: 0; outline: 0;
border-color: #fff; border-color: #fff;
@ -1081,4 +1089,4 @@ input[type=password] {
[class*="SelectMovieModalContent-path-"] { [class*="SelectMovieModalContent-path-"] {
color: var(--text); color: var(--text);
} }

38
CSS/themes/readarr/readarr-base.css
View File

@ -116,7 +116,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text-hover); color: var(--text-hover);
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
@ -131,7 +131,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -143,7 +143,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff; color: #fff;
border-top: 1px solid rgb(var(--accent-color)); border-top: 1px solid rgb(var(--accent-color));
} }
@ -180,8 +180,8 @@ a:hover {
} }
[class*="CheckInput-primaryIsChecked-"] { [class*="CheckInput-primaryIsChecked-"] {
border-color: rgb(var(--accent-color))!important; border-color: rgb(var(--accent-color)) !important;
background-color: rgb(var(--accent-color))!important; background-color: rgb(var(--accent-color)) !important;
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -215,7 +215,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff !important; color: #fff !important;
box-shadow: 0 0 10px 1px transparent !important; box-shadow: 0 0 10px 1px transparent !important;
} }
@ -253,7 +253,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -287,9 +287,9 @@ a:hover {
} }
[class*="PageSidebarItem-isActiveLink-"], [class*="PageSidebarItem-isActiveLink-"],
[class*="PageSidebarItem-isActiveLink-"]:hover, [class*="PageSidebarItem-isActiveLink-"]:hover,
[class*="PageSidebarItem-link-"]:focus { [class*="PageSidebarItem-link-"]:focus {
color: rgb(var(--accent-color))!important; color: rgb(var(--accent-color)) !important;
} }
[class*="PageSidebarItem-isActiveParentLink-"] { [class*="PageSidebarItem-isActiveParentLink-"] {
@ -305,7 +305,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -437,7 +437,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
[class*="Tooltip-tooltipContainer-"] { [class*="Tooltip-tooltipContainer-"] {
@ -462,7 +462,7 @@ a:hover {
} }
[class*="Label-default-"] [class*="IconButton-button-"], [class*="Label-default-"] [class*="IconButton-button-"],
[class*="Label-small-"] [class*="IconButton-button-"]:hover { [class*="Label-small-"] [class*="IconButton-button-"]:hover {
color: var(--label-text-color); color: var(--label-text-color);
} }
@ -571,7 +571,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -675,7 +675,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #FFF; color: #FFF;
border: 1px solid transparent; border: 1px solid transparent;
} }
@ -692,6 +692,7 @@ a:hover {
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -700,6 +701,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -708,6 +710,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -716,6 +719,7 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -860,7 +864,7 @@ input:focus:-ms-input-placeholder {
} }
/* SETTINGS */ /* SETTINGS */
[class*="Settings-link-"]{ [class*="Settings-link-"] {
color: var(--text-hover); color: var(--text-hover);
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
@ -1059,12 +1063,14 @@ input[type=password] {
background-color: var(--button-color); background-color: var(--button-color);
cursor: pointer; cursor: pointer;
} }
.button:hover { .button:hover {
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
.form-input:focus { .form-input:focus {
outline: 0; outline: 0;
border-color: #fff; border-color: #fff;
@ -1186,4 +1192,4 @@ input[type=password] {
/*Specific Book Page*/ /*Specific Book Page*/
[class*="BookDetails-tab-"] { [class*="BookDetails-tab-"] {
color: #FFF; color: #FFF;
} }

311
CSS/themes/requestrr/requestrr-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -21,8 +20,9 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.bg-default { .bg-default {
background-color: var(--main-bg-color) !important; background-color: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -31,79 +31,117 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
color: var(--text-color); color: var(--text-color);
} }
.text-muted, .form-control-label {
.text-muted,
.form-control-label {
color: var(--text-color-faded) !important; color: var(--text-color-faded) !important;
} }
.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 {
.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: white; color: white;
} }
.navbar-light .navbar-nav .nav-link { .navbar-light .navbar-nav .nav-link {
color: var(--text-color); color: var(--text-color);
} }
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
color: var(--text-color-faded); color: var(--text-color-faded);
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.navbar-vertical.navbar-expand-md.fixed-left { .navbar-vertical.navbar-expand-md.fixed-left {
left: 0; left: 0;
border-width: 0 1px 0 0; border-width: 0 1px 0 0;
background: rgba(0, 0, 0, 0.25) !important; background: rgba(0, 0, 0, 0.25) !important;
} }
} }
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
.navbar-collapse.collapsing, .navbar-collapse.show {
background: var(--modal-bg-color); .navbar-collapse.collapsing,
background-repeat: repeat, no-repeat; .navbar-collapse.show {
background-attachment: fixed, fixed; background: var(--modal-bg-color);
background-position: center center, center center; background-repeat: repeat, no-repeat;
background-size: auto, cover; background-attachment: fixed, fixed;
-webkit-background-size: auto, cover; background-position: center center, center center;
-moz-background-size: auto, cover; background-size: auto, cover;
-o-background-size: auto, cover; -webkit-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); -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) { @media (max-width: 767.98px) {
.navbar-nav .nav-link { .navbar-nav .nav-link {
color: var(--text-color) !important; color: var(--text-color) !important;
} }
} }
#sidenav-main > div > div > ul.mb-md-3.navbar-nav > li:nth-child(3) > a > i {
#sidenav-main>div>div>ul.mb-md-3.navbar-nav>li:nth-child(3)>a>i {
color: white !important; color: white !important;
} }
.card-profile-image img, .shadow,.navbar-vertical {
.card-profile-image img,
.shadow,
.navbar-vertical {
box-shadow: none !important; box-shadow: none !important;
} }
.fade { .fade {
-webkit-transition: opacity .15s linear; -webkit-transition: opacity .15s linear;
transition: opacity .15s linear; transition: opacity .15s linear;
background: rgba(0, 0, 0, 0.15) !important; background: rgba(0, 0, 0, 0.15) !important;
} }
.bg-secondary { .bg-secondary {
background-color: rgba(0, 0, 0, 0)!important; background-color: rgba(0, 0, 0, 0) !important;
} }
.bg-gradient-default { .bg-gradient-default {
background: none !important; background: none !important;
} }
.card-profile-image img, .shadow {
box-shadow: 0 0 2rem 0 rgba(0,0,0,.15) !important; .card-profile-image img,
.shadow {
box-shadow: 0 0 2rem 0 rgba(0, 0, 0, .15) !important;
} }
.bg-white,.footer {
.bg-white,
.footer {
background-color: rgba(0, 0, 0, 0.25) !important; background-color: rgba(0, 0, 0, 0.25) !important;
} }
.footer { .footer {
padding-left: 15px; padding-left: 15px;
} }
/* Logo */ /* Logo */
#sidenav-main > div > a::before { #sidenav-main>div>a::before {
content: ""; content: "";
background: url('../static/media/requestrr.1e4722c9.svg') no-repeat; background: url('../static/media/requestrr.1e4722c9.svg') no-repeat;
background-size: 200px; background-size: 200px;
@ -111,82 +149,106 @@ body {
height: 36px; height: 36px;
display: block; display: block;
} }
.navbar-brand-img { .navbar-brand-img {
display: none; display: none;
} }
@media (max-width: 767.98px){
.navbar-collapse .collapse-brand img { @media (max-width: 767.98px) {
display: none; .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 { @media (max-width: 767.98px) {
content: ""; #sidenav-main>div>div>div>div>div.collapse-brand.col-6>a::before {
background: url('../static/media/requestrr.1e4722c9.svg') no-repeat; content: "";
background-size: 200px; background: url('../static/media/requestrr.1e4722c9.svg') no-repeat;
width: 200px; background-size: 200px;
height: 36px; width: 200px;
display: block; height: 36px;
display: block;
} }
} }
/* FORMS */ /* FORMS */
.form-control:disabled, .form-control[readonly] { .form-control:disabled,
.form-control[readonly] {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
opacity: 1; opacity: 1;
border: 1px solid transparent; border: 1px solid transparent;
color: gray; color: gray;
} }
.form-control-alternative, .has-danger .form-control {
.form-control-alternative,
.has-danger .form-control {
background: rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
.form-control-alternative:focus { .form-control-alternative:focus {
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
} }
.form-control:focus { .form-control:focus {
color: #fff; color: #fff;
} }
.has-success .form-control { .has-success .form-control {
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
} }
.form-control { .form-control {
color: var(--text-color); color: var(--text-color);
border: 1px solid transparent; border: 1px solid transparent;
} }
/* Drop down*/
.react-dropdown-select.dropdown .react-dropdown-select-item-selected { /* Drop down*/
.react-dropdown-select.dropdown .react-dropdown-select-item-selected {
background: var(--accent-color) !important; background: var(--accent-color) !important;
color: #fff!important; color: #fff !important;
} }
.react-dropdown-select.dropdown div[role=list] span {
background-color: #fff; .react-dropdown-select.dropdown div[role=list] span {
color: #000000; background-color: #fff;
} color: #000000;
.react-dropdown-select.dropdown div[role=list] span:focus, .react-dropdown-select.dropdown div[role=list] span:hover { }
.react-dropdown-select.dropdown div[role=list] span:focus,
.react-dropdown-select.dropdown div[role=list] span:hover {
color: #000000; color: #000000;
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
} }
.react-dropdown-select.dropdown { .react-dropdown-select.dropdown {
color: var(--text-color); color: var(--text-color);
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: var(--text-color) !important;
} }
::-webkit-input-placeholder:focus { /* Chrome/Opera/Safari */
color: blue !important; ::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: var(--text-color) !important;
} }
::-moz-placeholder { /* Firefox 19+ */
color: var(--text-color) !important; ::-webkit-input-placeholder:focus {
/* Chrome/Opera/Safari */
color: blue !important;
} }
:-ms-input-placeholder { /* IE 10+ */
color: var(--text-color) !important; ::-moz-placeholder {
/* Firefox 19+ */
color: var(--text-color) !important;
} }
:-moz-placeholder { /* Firefox 18- */
color: var(--text-color) !important; :-ms-input-placeholder {
/* IE 10+ */
color: var(--text-color) !important;
}
:-moz-placeholder {
/* Firefox 18- */
color: var(--text-color) !important;
} }
/* Buttons */ /* Buttons */
@ -194,38 +256,54 @@ body {
background-color: var(--accent-color); background-color: var(--accent-color);
border-color: var(--accent-color); border-color: var(--accent-color);
} }
.btn-primary, .btn-primary:hover {
.btn-primary,
.btn-primary:hover {
color: #fff; color: #fff;
background-color: var(--button-color); background-color: var(--button-color);
border-color: var(--button-color); border-color: var(--button-color);
} }
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
color: #fff; color: #fff;
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
} }
.btn-default, .btn-default:hover {
.btn-default,
.btn-default:hover {
color: #fff; color: #fff;
background-color: rgba(255, 255, 255, 0.25); background-color: rgba(255, 255, 255, 0.25);
border-color: transparent; border-color: transparent;
} }
.btn-default:not(:disabled):not(.disabled).active, .btn-default:not(:disabled):not(.disabled):active, .show>.btn-default.dropdown-toggle {
.btn-default:not(:disabled):not(.disabled).active,
.btn-default:not(:disabled):not(.disabled):active,
.show>.btn-default.dropdown-toggle {
color: #fff; color: #fff;
background-color: rgba(0, 0, 0, 0.26); background-color: rgba(0, 0, 0, 0.26);
border-color: transparent; border-color: transparent;
} }
.btn-default.disabled, .btn-default:disabled {
.btn-default.disabled,
.btn-default:disabled {
color: #fff; color: #fff;
background-color: rgba(255, 255, 255, 0.15); background-color: rgba(255, 255, 255, 0.15);
border-color: transparent; border-color: transparent;
opacity: .5; opacity: .5;
} }
.btn-info.disabled, .btn-info:disabled {
.btn-info.disabled,
.btn-info:disabled {
color: #fff; color: #fff;
background-color: var(--button-color); background-color: var(--button-color);
border-color: var(--button-color); border-color: var(--button-color);
} }
.btn-info, .btn-info:hover {
.btn-info,
.btn-info:hover {
color: #fff; color: #fff;
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
@ -241,42 +319,49 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.separator-skew { .separator-skew {
height: 70px; height: 70px;
display: none; display: none;
} }
} }
#root > div > div.mt--8.pb-5.container > div > div > div {
#root>div>div.mt--8.pb-5.container>div>div>div {
background: rgba(0, 0, 0, 0.25) !important; 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(1)>div>input,
#root > div > div.mt--8.pb-5.container > div > div > div > div > form > div:nth-child(3) > 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; background: rgba(0, 0, 0, .25) !important;
border: 10px solid transparent; border: 10px solid transparent;
} }
.input-group-text { .input-group-text {
color: var(--text-color); color: var(--text-color);
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
border: 1px solid transparent !important; border: 1px solid transparent !important;
} }
.input-group-prepend { .input-group-prepend {
margin-right: 0px; 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; #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 */ /* Scrollbar */
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
html { html {
height: 100%; height: 100%;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
} }
body { body {
overflow-y: auto; overflow-y: auto;
height: 100%; height: 100%;
@ -287,26 +372,30 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
::-webkit-scrollbar {
width: 14px; ::-webkit-scrollbar {
} width: 14px;
::-webkit-scrollbar-thumb { }
min-height: 50px;
border: 3px solid transparent; ::-webkit-scrollbar-thumb {
border-radius: 8px; min-height: 50px;
background-color: hsla(0,0%,100%,.2); border: 3px solid transparent;
background-clip: padding-box; border-radius: 8px;
} background-color: hsla(0, 0%, 100%, .2);
::-webkit-scrollbar-track { background-clip: padding-box;
background-color: transparent; }
}
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-track {
min-height: 50px; background-color: transparent;
border: 3px solid transparent; }
border-radius: 8px;
background-color: hsla(0,0%,100%,.5); ::-webkit-scrollbar-thumb:hover {
background-clip: padding-box; min-height: 50px;
} border: 3px solid transparent;
border-radius: 8px;
background-color: hsla(0, 0%, 100%, .5);
background-clip: padding-box;
}

32
CSS/themes/resilio-sync/resilio-base.css
View File

@ -22,7 +22,7 @@ body,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
a { a {
@ -169,7 +169,7 @@ UL.jqueryFileTree A,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.dropdown-menu { .dropdown-menu {
@ -180,7 +180,7 @@ UL.jqueryFileTree A,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid #ccc; border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .15); border: 1px solid rgba(0, 0, 0, .15);
border-radius: 2px; border-radius: 2px;
@ -196,7 +196,7 @@ UL.jqueryFileTree A,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .1);
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .2); -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .2);
box-shadow: 0 6px 12px rgba(0, 0, 0, .2); box-shadow: 0 6px 12px rgba(0, 0, 0, .2);
@ -340,7 +340,7 @@ button.selectpicker.btn-default {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.popout-parent { .popout-parent {
@ -351,7 +351,7 @@ button.selectpicker.btn-default {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.context-menu li a:focus, .context-menu li a:focus,
@ -367,7 +367,7 @@ button.selectpicker.btn-default {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#general-settings #languagedrop { #general-settings #languagedrop {
@ -389,7 +389,7 @@ button.selectpicker.btn-default {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -405,7 +405,7 @@ button.selectpicker.btn-default {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.modal-body .horizontal-separator .horizontal-separator-text { .modal-body .horizontal-separator .horizontal-separator-text {
@ -416,7 +416,7 @@ button.selectpicker.btn-default {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -464,7 +464,7 @@ ul.jqueryFileTree a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#sharing-content .nav-tabs.nav-sub-tabs>li>a { #sharing-content .nav-tabs.nav-sub-tabs>li>a {
@ -492,7 +492,7 @@ ul.jqueryFileTree a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.modal-header .transfer-path .labelContainer { .modal-header .transfer-path .labelContainer {
@ -521,7 +521,7 @@ ul.jqueryFileTree a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -550,7 +550,7 @@ ul.jqueryFileTree a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.status-panel-shown #statusPanel { .status-panel-shown #statusPanel {
@ -591,7 +591,7 @@ ul.jqueryFileTree a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
#statusPanel .chart-c3 .c3-tooltip { #statusPanel .chart-c3 .c3-tooltip {
@ -741,7 +741,7 @@ ul.jqueryFileTree a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* PLACEHOLDER TEXT */ /* PLACEHOLDER TEXT */

2199
CSS/themes/rutorrent/rutorrent-base.css
View File

File diff suppressed because it is too large

40
CSS/themes/sonarr/sonarr-base.css
View File

@ -118,7 +118,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text-hover); color: var(--text-hover);
border-bottom: 1px solid rgb(var(--accent-color)); border-bottom: 1px solid rgb(var(--accent-color));
} }
@ -131,7 +131,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -143,7 +143,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff; color: #fff;
border-top: 1px solid rgb(var(--accent-color)); border-top: 1px solid rgb(var(--accent-color));
} }
@ -188,8 +188,8 @@ a:hover {
} }
[class*="CheckInput-primaryIsChecked-"] { [class*="CheckInput-primaryIsChecked-"] {
border-color: rgb(var(--accent-color))!important; border-color: rgb(var(--accent-color)) !important;
background-color: rgb(var(--accent-color))!important; background-color: rgb(var(--accent-color)) !important;
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -223,7 +223,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: #fff !important; color: #fff !important;
box-shadow: 0 0 10px 1px transparent !important; box-shadow: 0 0 10px 1px transparent !important;
} }
@ -259,9 +259,9 @@ a:hover {
} }
[class*="PageSidebarItem-isActiveLink-"], [class*="PageSidebarItem-isActiveLink-"],
[class*="PageSidebarItem-isActiveLink-"]:hover, [class*="PageSidebarItem-isActiveLink-"]:hover,
[class*="PageSidebarItem-link-"]:focus { [class*="PageSidebarItem-link-"]:focus {
color: rgb(var(--accent-color))!important; color: rgb(var(--accent-color)) !important;
} }
[class*="PageSidebarItem-isActiveParentLink-"] { [class*="PageSidebarItem-isActiveParentLink-"] {
@ -281,7 +281,7 @@ a:hover {
/* SERIES PAGE */ /* SERIES PAGE */
/* SONARR SPECIFIC */ /* SONARR SPECIFIC */
[class*="SeriesIndexPoster-controls-"] { [class*="SeriesIndexPoster-controls-"] {
background-color: rgb(var(--accent-color))!important; background-color: rgb(var(--accent-color)) !important;
} }
/* OVERVIEW PAGE */ /* OVERVIEW PAGE */
@ -327,6 +327,7 @@ a:hover {
[class*="SeriesDetailsSeason-collapseButtonIcon-"] { [class*="SeriesDetailsSeason-collapseButtonIcon-"] {
color: var(--text) !important; color: var(--text) !important;
} }
[class*="SeriesDetailsSeason-actionButton-"]:hover, [class*="SeriesDetailsSeason-actionButton-"]:hover,
[class*="SeriesDetailsSeason-collapseButtonIcon-"]:hover { [class*="SeriesDetailsSeason-collapseButtonIcon-"]:hover {
color: var(--text-hover) !important; color: var(--text-hover) !important;
@ -384,7 +385,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
[class*="Tooltip-tooltipContainer-"] { [class*="Tooltip-tooltipContainer-"] {
@ -399,7 +400,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
} }
@ -424,12 +425,12 @@ a:hover {
} }
[class*="IconButton-button-"]:hover, [class*="IconButton-button-"]:hover,
[class*="Label-small-"] [class*="IconButton-button-"]{ [class*="Label-small-"] [class*="IconButton-button-"] {
background-color: transparent; background-color: transparent;
color: var(--label-text-color); color: var(--label-text-color);
} }
[class*="SeriesIndexPoster-action-"] .fa-search:hover{ [class*="SeriesIndexPoster-action-"] .fa-search:hover {
background-color: transparent; background-color: transparent;
color: var(--label-text-color) !important; color: var(--label-text-color) !important;
} }
@ -539,7 +540,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -585,9 +586,10 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
[class*="EnhancedSelectInputOption-isSelected-"], [class*="EnhancedSelectInputOption-isSelected-"],
[class*="EnhancedSelectInputOption-isSelected-"]:hover { [class*="EnhancedSelectInputOption-isSelected-"]:hover {
background-color: rgba(255, 255, 255, 0.20) !important; background-color: rgba(255, 255, 255, 0.20) !important;
@ -644,6 +646,7 @@ a:hover {
input::-webkit-input-placeholder { input::-webkit-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-webkit-input-placeholder { input:focus::-webkit-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -652,6 +655,7 @@ input:focus::-webkit-input-placeholder {
input:-moz-placeholder { input:-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-moz-placeholder { input:focus:-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -660,6 +664,7 @@ input:focus:-moz-placeholder {
input::-moz-placeholder { input::-moz-placeholder {
color: var(--text); color: var(--text);
} }
input:focus::-moz-placeholder { input:focus::-moz-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -668,6 +673,7 @@ input:focus::-moz-placeholder {
input:-ms-input-placeholder { input:-ms-input-placeholder {
color: var(--text); color: var(--text);
} }
input:focus:-ms-input-placeholder { input:focus:-ms-input-placeholder {
color: var(--text-hover); color: var(--text-hover);
} }
@ -731,7 +737,7 @@ input:focus:-ms-input-placeholder {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: white; color: white;
} }
@ -1030,12 +1036,14 @@ input[type=password] {
background-color: var(--button-color); background-color: var(--button-color);
cursor: pointer; cursor: pointer;
} }
.button:hover { .button:hover {
border-color: var(--button-color-hover); border-color: var(--button-color-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
.form-input:focus { .form-input:focus {
outline: 0; outline: 0;
border-color: #fff; border-color: #fff;

93
CSS/themes/synclounge/synclounge-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -12,70 +11,98 @@
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
main { main {
background: var(--main-bg-color);background-repeat: repeat, no-repeat; background: var(--main-bg-color);
background-attachment: fixed, fixed; background-repeat: repeat, no-repeat;
background-position: center center, center center; background-attachment: fixed, fixed;
background-size: auto, cover; background-position: center center, center center;
-webkit-background-size: auto, cover; background-size: auto, cover;
-moz-background-size: auto, cover; -webkit-background-size: auto, cover;
-o-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover;
} }
h4 { h4 {
color: #ffffff; color: #ffffff;
} }
.v-toolbar { .v-toolbar {
background: transparent !important; background: transparent !important;
box-shadow: none; box-shadow: none;
} }
.v-toolbar__content, .v-toolbar__extension {
.v-toolbar__content,
.v-toolbar__extension {
background-color: rgba(0, 0, 0, 0.6) !important; background-color: rgba(0, 0, 0, 0.6) !important;
} }
p a { p a {
color: var(--accent-color) !important; color: var(--accent-color) !important;
} }
.application .theme--dark.v-card, .theme--dark .v-card .primary--text {
.application .theme--dark.v-card,
.theme--dark .v-card .primary--text {
color: var(--accent-color) !important; color: var(--accent-color) !important;
} }
.application .theme--dark.v-card, .theme--dark .v-card .accent--text {
.application .theme--dark.v-card,
.theme--dark .v-card .accent--text {
color: var(--accent-color) !important; color: var(--accent-color) !important;
} }
.application .theme--dark.v-card, .theme--dark .v-card .primary {
.application .theme--dark.v-card,
.theme--dark .v-card .primary {
color: var(--accent-color) !important; color: var(--accent-color) !important;
} }
.flex.xs12 a { .flex.xs12 a {
color: var(--accent-color); color: var(--accent-color);
} }
.v-list__tile { .v-list__tile {
color: #fff !important; color: #fff !important;
} }
.v-stepper__step__step .primary { .v-stepper__step__step .primary {
background-color: var(--default-button-color) !important; background-color: var(--default-button-color) !important;
border-color: var(--default-button-color) !important; border-color: var(--default-button-color) !important;
} }
.primary { .primary {
background-color: var(--default-button-color) !important; background-color: var(--default-button-color) !important;
border-color: var(--default-button-color) !important; border-color: var(--default-button-color) !important;
} }
.v-input__control .v-input__slot .primary--text input, .primary--text textarea {
.v-input__control .v-input__slot .primary--text input,
.primary--text textarea {
caret-color: var(--accent-color) !important; caret-color: 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: 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: var(--accent-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) { .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) {
background-color: var(--default-button-color) !important; background-color: var(--default-button-color) !important;
} }
.v-btn__content { .v-btn__content {
color: #fff; color: #fff;
} }
.v-btn--active:before, .v-btn:focus:before, .v-btn:hover:before {
.v-btn--active:before,
.v-btn:focus:before,
.v-btn:hover:before {
background-color: white; background-color: white;
} }
.application .theme--dark.v-card, .theme--dark .v-card {
.application .theme--dark.v-card,
.theme--dark .v-card {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -83,25 +110,34 @@ p a {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.flex.md3 .application .theme--dark.v-card, .theme--dark .v-card {
.flex.md3 .application .theme--dark.v-card,
.theme--dark .v-card {
background: rgba(255, 255, 255, 0.10) !important; background: rgba(255, 255, 255, 0.10) !important;
color: #fff; color: #fff;
} }
.theme--dark.v-expansion-panels .v-expansion-panel { .theme--dark.v-expansion-panels .v-expansion-panel {
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
} }
.theme--dark.v-text-field--solo>.v-input__control>.v-input__slot { .theme--dark.v-text-field--solo>.v-input__control>.v-input__slot {
background: rgb(0 0 0 / 0.50); background: rgb(0 0 0 / 0.50);
} }
.flex.md3 .application .theme--dark.v-list, .theme--dark .v-list {
.flex.md3 .application .theme--dark.v-list,
.theme--dark .v-list {
background: rgba(255, 255, 255, 0.10) !important; background: rgba(255, 255, 255, 0.10) !important;
} }
flex xs12 .flex.md3 .application .theme--dark.v-list, .theme--dark .v-list {
flex xs12 .flex.md3 .application .theme--dark.v-list,
.theme--dark .v-list {
background: inherit !important; background: inherit !important;
} }
.v-navigation-drawer { .v-navigation-drawer {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -110,7 +146,7 @@ flex xs12 .flex.md3 .application .theme--dark.v-list, .theme--dark .v-list {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/*popup modal */ /*popup modal */
@ -122,8 +158,9 @@ flex xs12 .flex.md3 .application .theme--dark.v-list, .theme--dark .v-list {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.menuable__content__active { .menuable__content__active {
background: var(--modal-bg-color); background: var(--modal-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -132,5 +169,5 @@ flex xs12 .flex.md3 .application .theme--dark.v-list, .theme--dark .v-list {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }

1056
CSS/themes/tautulli/tautulli-base.css
View File

File diff suppressed because it is too large

94
CSS/themes/thelounge/thelounge-base.css
View File

@ -1,4 +1,3 @@
/* dP dP dP */ /* dP dP dP */
/* 88 88 88 */ /* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ /* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
@ -14,12 +13,14 @@
#chat .userlist .names { #chat .userlist .names {
background: rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
} }
#chat .user-mode:before { #chat .user-mode:before {
background: rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
} }
@media (max-width: 768px) { @media (max-width: 768px) {
#chat .userlist .names { #chat .userlist .names {
box-shadow: 0 0 25px 0 rgba(0,0,0,.5); box-shadow: 0 0 25px 0 rgba(0, 0, 0, .5);
background: var(--window-bg-color); background: var(--window-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -27,17 +28,22 @@
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
}
} }
}
@media (max-width: 768px) { @media (max-width: 768px) {
#viewport.menu-dragging #sidebar, #viewport.menu-open #sidebar {
box-shadow: 0 0 25px 0 rgba(0,0,0,.5); #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); background: rgba(0, 0, 0, 0.85);
} }
} }
#chat .chan .notice .user, #chat .notice .content, #chat .notice .time {
#chat .chan .notice .user,
#chat .notice .content,
#chat .notice .time {
color: var(--date-marker-color) !important; color: var(--date-marker-color) !important;
} }
@ -45,27 +51,39 @@
background: var(--theme-accent); background: var(--theme-accent);
color: #f3f3f3; color: #f3f3f3;
} }
#form { #form {
background-color: rgba(0, 0, 0, 0.45); background-color: rgba(0, 0, 0, 0.45);
border-color: #0086ff00; border-color: #0086ff00;
color: var(--body-color); color: var(--body-color);
} }
#sidebar .active, #sidebar .active:hover {
#sidebar .active,
#sidebar .active:hover {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
#chat .msg.motd .text, code, .irc-monospace {
#chat .msg.motd .text,
code,
.irc-monospace {
background: rgba(0, 0, 0, 0.45); background: rgba(0, 0, 0, 0.45);
color: #f3f3f3; color: #f3f3f3;
} }
#chat .content, #windows #chat .header, #chat .user-mode::before, #chat .userlist {
#chat .content,
#windows #chat .header,
#chat .user-mode::before,
#chat .userlist {
border-color: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.08);
} }
#chat .msg[data-type=motd] .text { #chat .msg[data-type=motd] .text {
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
} }
/* Dropdown menu */ /* Dropdown menu */
#context-menu, .textcomplete-menu { #context-menu,
.textcomplete-menu {
background: var(--body-bg-color); background: var(--body-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -73,48 +91,77 @@
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
/* color: white !important; */ /* color: white !important; */
} }
.context-menu-item, .textcomplete-item {
.context-menu-item,
.textcomplete-item {
color: var(--body-color); 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 {
#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); background-color: rgba(255, 255, 255, 0.08);
transition: none; transition: none;
outline: 0; 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 {
#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; padding: 5px;
vertical-align: top; vertical-align: top;
border-bottom: 1px solid rgba(255, 255, 255, 0.25); border-bottom: 1px solid rgba(255, 255, 255, 0.25);
} }
#chat .userlist .count { #chat .userlist .count {
background-color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.6);
} }
#footer button:hover, #sidebar .chan:hover {
#footer button:hover,
#sidebar .chan:hover {
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
} }
#settings .extra-help:before { #settings .extra-help:before {
content: "\F059"; content: "\F059";
color: var(--body-color); color: var(--body-color);
} }
#windows .window h2 { #windows .window h2 {
color: var(--body-color); color: var(--body-color);
} }
#windows .window h2 { #windows .window h2 {
border-bottom: 1px solid rgba(255, 255, 255, 0.25); border-bottom: 1px solid rgba(255, 255, 255, 0.25);
} }
.input:not(:disabled):focus, .input:not(:disabled):hover {
.input:not(:disabled):focus,
.input:not(:disabled):hover {
border-color: #ffffff; border-color: #ffffff;
} }
.btn:active, .btn:focus, .input:focus {
.btn:active,
.btn:focus,
.input:focus {
outline: 0; outline: 0;
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5); box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5);
} }
.btn { .btn {
color: inherit; color: inherit;
} }
.mentions-popup { .mentions-popup {
background: var(--body-bg-color); background: var(--body-bg-color);
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
@ -123,9 +170,10 @@
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
}
#chat .toggle-content{
background: var(--highlight-bg-color);
} }
#chat .toggle-content {
background: var(--highlight-bg-color);
}

998
CSS/themes/transmission/transmission-base.css
View File

File diff suppressed because it is too large

39
CSS/themes/unraid/unraid-base.css
View File

@ -11,8 +11,9 @@
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
* { * {
outline: none; outline: none;
} }
body { body {
color: var(--text); color: var(--text);
background: var(--main-bg-color); background: var(--main-bg-color);
@ -25,12 +26,18 @@ body {
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
h1,h2,h3,h4,h5,h6,strong { h1,
color: var(--text-hover); h2,
h3,
h4,
h5,
h6,
strong {
color: var(--text-hover);
} }
i.fa.fa-fw { i.fa.fa-fw {
color: var(--text-hover)!important; color: var(--text-hover) !important;
} }
a, a,
@ -131,9 +138,11 @@ span.inner {
width: 137px !important; width: 137px !important;
} }
thead.sortable,thead,table.tablesorter thead tr th { thead.sortable,
color: var(--text-hover); thead,
} table.tablesorter thead tr th {
color: var(--text-hover);
}
.sys, .sys,
.usage-disk, .usage-disk,
@ -145,10 +154,11 @@ thead.sortable,thead,table.tablesorter thead tr th {
background-color: #4caf50 background-color: #4caf50
} }
#db-box3 > tbody.smb.share.share1.sortable > tr > td > a { #db-box3>tbody.smb.share.share1.sortable>tr>td>a {
color: var(--link-color); color: var(--link-color);
} }
#db-box3 > tbody.smb.share.share1.sortable > tr > td > a:hover {
#db-box3>tbody.smb.share.share1.sortable>tr>td>a:hover {
color: var(--link-color-hover); color: var(--link-color-hover);
} }
@ -363,6 +373,7 @@ div.tab [type=radio]+label {
background-color: rgb(0 0 0 / 10%) !important; background-color: rgb(0 0 0 / 10%) !important;
border-color: rgb(0 0 0 / 25%) !important; border-color: rgb(0 0 0 / 25%) !important;
} }
.ca_holderDocker::before { .ca_holderDocker::before {
color: rgb(255 255 255 / 40%) !important; color: rgb(255 255 255 / 40%) !important;
} }
@ -370,17 +381,19 @@ div.tab [type=radio]+label {
.selectedMenu { .selectedMenu {
color: rgb(var(--accent-color)) !important; color: rgb(var(--accent-color)) !important;
} }
.hoverMenu { .hoverMenu {
color: var(--link-color-hover) !important; color: var(--link-color-hover) !important;
} }
.ca_descriptionArea:hover,a.ca_repoPopup:hover { .ca_descriptionArea:hover,
a.ca_repoPopup:hover {
color: var(--button-text-hover) !important; color: var(--button-text-hover) !important;
} }
.ca_templatesDisplay .ca_holderFav { .ca_templatesDisplay .ca_holderFav {
background: rgb(var(--accent-color),.7) !important; background: rgb(var(--accent-color), .7) !important;
color: var( --label-text-color) !important; color: var(--label-text-color) !important;
} }
a.ca_appreadmore:hover { a.ca_appreadmore:hover {
@ -571,7 +584,7 @@ unraid-authed::part(div[data-v-050c892a] > button) {
#contDescription { #contDescription {
background: rgb(0 0 0 / 25%); background: rgb(0 0 0 / 25%);
padding: 1%; padding: 1%;
border-radius: 5px; border-radius: 5px;
} }
dt { dt {

50
CSS/themes/vuetorrent/vuetorrent-base.css
View File

@ -38,7 +38,7 @@ body,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
html { html {
@ -121,7 +121,7 @@ p,
background-color: rgba(0, 0, 0, .25) !important; background-color: rgba(0, 0, 0, .25) !important;
} }
.v-app-bar.v-app-bar--is-scrolled{ .v-app-bar.v-app-bar--is-scrolled {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
@ -129,7 +129,7 @@ p,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.v-navigation-drawer__content .theme--dark.v-card, .v-navigation-drawer__content .theme--dark.v-card,
@ -200,7 +200,7 @@ p,
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
} }
@ -327,53 +327,55 @@ p,
.v-application .torrent-paused-color .caption, .v-application .torrent-paused-color .caption,
.v-application .torrent-seeding-color .caption, .v-application .torrent-seeding-color .caption,
.v-application .torrent-done-color .caption { .v-application .torrent-done-color .caption {
color: #ccc !important; color: #ccc !important;
} }
.v-application .torrent-paused-color { .v-application .torrent-paused-color {
background-color: rgb(156 163 175 / 70%) !important; background-color: rgb(156 163 175 / 70%) !important;
border-color: rgb(156 163 175 / 70%) !important; border-color: rgb(156 163 175 / 70%) !important;
} }
.v-application .torrent-seeding-color { .v-application .torrent-seeding-color {
background-color: rgba(78, 205, 230, .7) !important; background-color: rgba(78, 205, 230, .7) !important;
border-color: rgba(78, 205, 230, .7) !important; border-color: rgba(78, 205, 230, .7) !important;
} }
.v-application .torrent-done-color {
.v-application .torrent-done-color {
background-color: rgba(22, 87, 62, .7) !important; background-color: rgba(22, 87, 62, .7) !important;
border-color: rgba(22, 87, 62, .7) !important; border-color: rgba(22, 87, 62, .7) !important;
} }
.v-application .torrent-downloading-color { .v-application .torrent-downloading-color {
background-color: rgba(91, 185, 116, .7) !important; background-color: rgba(91, 185, 116, .7) !important;
border-color: rgba(91, 185, 116, .7) !important; border-color: rgba(91, 185, 116, .7) !important;
} }
.v-application .torrent-fail-color { .v-application .torrent-fail-color {
background-color: rgba(248, 62, 112, .7) !important; background-color: rgba(248, 62, 112, .7) !important;
border-color: rgba(248, 62, 112, .7) !important; border-color: rgba(248, 62, 112, .7) !important;
} }
.v-application .torrent-queued-color { .v-application .torrent-queued-color {
background-color: rgba(46, 94, 170, .7) !important; background-color: rgba(46, 94, 170, .7) !important;
border-color: rgba(46, 94, 170, .7) !important; border-color: rgba(46, 94, 170, .7) !important;
} }
.v-application .torrent-checking-color { .v-application .torrent-checking-color {
background-color: rgba(255, 112, 67, .7) !important; background-color: rgba(255, 112, 67, .7) !important;
border-color: rgba(255, 112, 67, .7) !important; border-color: rgba(255, 112, 67, .7) !important;
} }
.v-application .torrent-stalled-color { .v-application .torrent-stalled-color {
background-color: rgba(74, 222, 128, .7) !important; background-color: rgba(74, 222, 128, .7) !important;
border-color: rgba(74, 222, 128, .7) !important; border-color: rgba(74, 222, 128, .7) !important;
} }
.v-application .torrent-metadata-color { .v-application .torrent-metadata-color {
background-color: rgba(126, 87, 194, .7) !important; background-color: rgba(126, 87, 194, .7) !important;
border-color: rgba(126, 87, 194, .7) !important; border-color: rgba(126, 87, 194, .7) !important;
} }
.v-application .torrent-moving-color { .v-application .torrent-moving-color {
background-color: rgba(255, 170, 44, .7) !important; background-color: rgba(255, 170, 44, .7) !important;
border-color: rgba(255, 170, 44, .7) !important; border-color: rgba(255, 170, 44, .7) !important;
} }
@ -398,14 +400,14 @@ background-color: rgb(156 163 175 / 70%) !important;
.v-menu__content .theme--dark.theme--dark.v-list, .v-menu__content .theme--dark.theme--dark.v-list,
.v-menu__content .theme--light.theme--light.v-list { .v-menu__content .theme--light.theme--light.v-list {
background: var(--modal-bg-color) !important; background: var(--modal-bg-color) !important;
background-repeat: repeat, no-repeat; background-repeat: repeat, no-repeat;
background-attachment: fixed, fixed; background-attachment: fixed, fixed;
background-position: center center, center center; background-position: center center, center center;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.theme--dark.v-icon, .theme--dark.v-icon,
@ -415,7 +417,7 @@ background-size: auto, cover;
.theme--light.v-divider, .theme--light.v-divider,
.theme--dark.v-divider { .theme--dark.v-divider {
border-color: rgba(255, 255, 255,.2) !important; border-color: rgba(255, 255, 255, .2) !important;
} }
/* TABLE */ /* TABLE */
@ -474,7 +476,7 @@ background-size: auto, cover;
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
border: 1px solid rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .1);
} }

8
CSS/themes/webtools/webtools-base.css
View File

@ -18,7 +18,7 @@ body {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
a, a,
@ -38,7 +38,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
* { * {
@ -114,7 +114,7 @@ content-loading .contentLoading {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text) !important; color: var(--text) !important;
border: #f0505000 5px solid; border: #f0505000 5px solid;
} }
@ -127,7 +127,7 @@ content-loading .contentLoading {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
color: var(--text); color: var(--text);
Border: 1px solid rgba(0, 0, 0, 0.2); Border: 1px solid rgba(0, 0, 0, 0.2);
} }

30
CSS/themes/xbackbone/xbackbone-base.css
View File

@ -18,7 +18,7 @@
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
/* Scrollbar */ /* Scrollbar */
@ -39,7 +39,7 @@
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
} }
@ -82,9 +82,11 @@ body,
.col-form-label { .col-form-label {
color: var(--text-hover); color: var(--text-hover);
} }
.navbar-dark .navbar-nav .nav-link.active { .navbar-dark .navbar-nav .nav-link.active {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
.card-header { .card-header {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
@ -116,10 +118,13 @@ a:hover {
.bg-primary { .bg-primary {
background: rgba(0, 0, 0, .15) !important; background: rgba(0, 0, 0, .15) !important;
} }
.navbar-dark .navbar-brand { .navbar-dark .navbar-brand {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover {
.navbar-dark .navbar-brand:focus,
.navbar-dark .navbar-brand:hover {
color: var(--accent-color-hover); color: var(--accent-color-hover);
} }
@ -132,7 +137,7 @@ a:hover {
background-size: auto, cover; background-size: auto, cover;
-webkit-background-size: auto, cover; -webkit-background-size: auto, cover;
-moz-background-size: auto, cover; -moz-background-size: auto, cover;
-o-background-size: auto, cover; -o-background-size: auto, cover;
} }
.dropdown-item:focus, .dropdown-item:focus,
@ -191,16 +196,23 @@ a:hover {
.btn-primary:hover, .btn-primary:hover,
.btn-outline-dark:hover, .btn-outline-dark:hover,
.btn-outline-secondary:hover, .btn-outline-secondary:hover,
.btn-check:focus+.btn-primary, .btn-primary:focus { .btn-check:focus+.btn-primary,
.btn-primary:focus {
color: var(--button-text-hover); color: var(--button-text-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
border-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:active+.btn-primary:focus,
.btn-check:focus+.btn-primary, .btn-primary:focus { .btn-check:checked+.btn-primary:focus,
box-shadow: 0 0 0 0.25rem rgba(var(--accent-color),.5); .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-primary,
.btn-outline-info { .btn-outline-info {
color: var(--button-color); color: var(--button-color);

Write Preview
Loading…
Cancel
Save