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

sabnzbd dracula

pull/241/head
Marius 4 years ago
parent
b22a08939b
commit
1639efe453
8 changed files with 185 additions and 173 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. 11
      CSS/themes/sabnzbd/aquamarine.css
  2. 10
      CSS/themes/sabnzbd/dark.css
  3. 16
      CSS/themes/sabnzbd/dracula.css
  4. 11
      CSS/themes/sabnzbd/hotline.css
  5. 10
      CSS/themes/sabnzbd/organizr-dark.css
  6. 11
      CSS/themes/sabnzbd/plex.css
  7. 279
      CSS/themes/sabnzbd/sabnzbd-base.css
  8. 10
      CSS/themes/sabnzbd/space-gray.css

11
CSS/themes/sabnzbd/aquamarine.css
View File

@ -13,13 +13,4 @@
/* SABNZBD AQUAMARINE THEME */ /* SABNZBD AQUAMARINE THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css); @import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
:root { @import url(https://theme-park.dev/CSS/variables/aquamarine.css);
--main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
--settings-accent-color: #12afa0;
--nav-button-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
--default-button-color: hsla(0,0%,100%,.25);
--default-button-color-hover: hsla(0,0%,100%,.3);
--default-button-color-active: hsla(0,0%,100%,.3);
}

10
CSS/themes/sabnzbd/dark.css
View File

@ -13,12 +13,4 @@
/* SABNZBD DARK THEME */ /* SABNZBD DARK THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css); @import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
:root { @import url(https://theme-park.dev/CSS/variables/dark.css);
--main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
--settings-accent-color: #f9be03;
--nav-button-color: #cc7b19;
--default-button-color: #cc7b19;
--default-button-color-hover: #e59029;
--default-button-color-active: #e59029;
}

16
CSS/themes/sabnzbd/dracula.css
View File

@ -0,0 +1,16 @@
/* dP dP dP */
/* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */
/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */
/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
/* 88 */
/* dP */
/* Made by @gilbN */
/* https://github.com/gilbN/theme.park */
/* SABNZBD DRACULA THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
@import url(https://theme-park.dev/CSS/variables/dracula.css);

11
CSS/themes/sabnzbd/hotline.css
View File

@ -13,13 +13,4 @@
/* SABNZBD HOTLINE THEME */ /* SABNZBD HOTLINE THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css); @import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
:root { @import url(https://theme-park.dev/CSS/variables/hotline.css);
--main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
--settings-accent-color: #FFEB3B;
--nav-button-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
--default-button-color: hsla(0,0%,100%,.25);
--default-button-color-hover: hsla(0,0%,100%,.3);
--default-button-color-active: hsla(0,0%,100%,.3);
}

10
CSS/themes/sabnzbd/organizr-dark.css
View File

@ -13,12 +13,4 @@
/* SABNZBD ORGANIZR-DARK THEME */ /* SABNZBD ORGANIZR-DARK THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css); @import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
:root { @import url(https://theme-park.dev/CSS/variables/organizr-dark.css);
--main-bg-color: #1f1f1f;
--modal-bg-color: #1b1b1b;
--settings-accent-color: #2cabe3;
--nav-button-color: #2cabe3;
--default-button-color: #2cabe3;
--default-button-color-hover: rgb(44 171 227 / .8);
--default-button-color-active: rgb(44 171 227 / .8);
}

11
CSS/themes/sabnzbd/plex.css
View File

@ -13,13 +13,4 @@
/* SABNZBD PLEX THEME */ /* SABNZBD PLEX THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css); @import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
:root { @import url(https://theme-park.dev/CSS/variables/plex.css);
--main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed;
--modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed;
--settings-accent-color: #f9be03;
--nav-button-color: #cc7b19;
--default-button-color: #cc7b19;
--default-button-color-hover: #e59029;
--default-button-color-active: #e59029;
}

279
CSS/themes/sabnzbd/sabnzbd-base.css
View File

@ -19,12 +19,34 @@ body {
-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;
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;
color: white; color: var(--text);
} }
h1,h2,h3,h4,h5,h6,label:not(.btn),legend {
color: var(--text-hover) !important;
}
p {
color: var(--text);
}
a {
color: var(--link-color);
}
a:active,
a:hover,
a:focus{
color: var(--link-color-hover);
}
#modal-options .modal-header a {
color: var(--link-color) !important;
}
#modal-options .modal-header a:hover {
color: var(--link-color-hover) !important;
}
/* Scrollbar */ /* Scrollbar */
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
html { html {
@ -72,15 +94,40 @@ body {
} }
/* navbar */ /* navbar */
.nav-tabs,hr {
border-bottom: 1px solid rgb(var(--accent-color));
}
#modal-options #options-status hr {
border-top: 1px solid rgb(var(--accent-color));
}
.navbar-inverse { .navbar-inverse {
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
border-color: transparent !important; border-color: transparent !important;
} }
.navbar-nav>li>a {
.navbar-btn { color: rgb(var(--accent-color)) !important;
background: var(--nav-button-color) !important; opacity: 1;
border-color: transparent !important; }
.navbar-nav>li>a:hover, .main-menu-link:hover a {
opacity: 1;
color: var(--accent-color-hover) !important;
} }
.main-menu-link .icon-bar {
display: block;
width: 16px;
height: 3px;
border-radius: 1px !important;
background-color: var(--link-color);
margin-top: 3px;
}
.main-menu-link:hover .icon-bar {
background-color: var(--link-color-hover);
}
/* .navbar-btn {
background: var(--button-color) !important;
border-color: transparent !important;
} */
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.open>a:hover,
@ -90,11 +137,11 @@ body {
.ui-slider-horizontal, .ui-slider-horizontal,
.ui-slider-range-min { .ui-slider-range-min {
background: var(--settings-accent-color) !important; background: rgb(var(--accent-color)) !important;
} }
.ui-slider .ui-slider-handle { .ui-slider .ui-slider-handle {
background-color: var(--settings-accent-color); background-color: rgb(var(--accent-color));
border: 1px solid black; border: 1px solid black;
} }
@ -104,7 +151,7 @@ body {
} }
.dropdown-menu { .dropdown-menu {
background: var(--modal-bg-color); background: var(--drop-down-menu-bg);
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;
@ -115,17 +162,17 @@ body {
} }
.dropdown-menu>li>a { .dropdown-menu>li>a {
color: #fff; color: var(--text-hover);
} }
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus { .dropdown-menu>li>a:focus {
color: #ffffff; color: var(--text-hover);
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
} }
.dropdown-header { .dropdown-header {
color: #fff; color: var(--text-hover);
} }
.menu-options .form-control { .menu-options .form-control {
@ -152,7 +199,7 @@ body {
} }
.form-control:focus { .form-control:focus {
border-color: #ffffff; border-color: var(--text-hover);
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 255, 255, 0.6); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 255, 255, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 255, 255, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 255, 255, 0.6);
} }
@ -162,41 +209,41 @@ body {
} }
svg.peity polygon { svg.peity polygon {
fill: var(--nav-button-color) !important; fill: var(--button-color) !important;
} }
svg.peity polyline { svg.peity polyline {
stroke: var(--nav-button-color) !important; stroke: var(--button-color) !important;
} }
/* BUTTONS */ /* BUTTONS */
.form-signin .btn { .form-signin .btn {
background: var(--default-button-color) !important; background: var(--button-color) !important;
outline: none !important; outline: none !important;
} }
.text-center a { .text-center a {
color: #ffffff; color: var(--text-hover);
} }
.btn-default { .btn-default {
color: #fff; color: var(--button-text);
background: var(--default-button-color); background: var(--button-color);
border-color: #00000000 !important; border-color: var(--button-color);
outline: none !important; outline: none !important;
} }
.btn-default:focus, .btn-default:focus,
.btn-default.focus { .btn-default.focus {
color: #fff; color: var(--button-text-hover);
background: var(--default-button-color-hover); background: var(--button-color-hover);
border-color: #00000000 !important; border-color: var(--button-color-hover);
} }
.btn-default:hover { .btn-default:hover {
color: #fff; color: var(--button-text-hover);
background: var(--default-button-color-hover); background: var(--button-color-hover);
border-color: #00000000 !important; border-color: var(--button-color-hover);
} }
.btn-default:active:hover, .btn-default:active:hover,
@ -208,17 +255,17 @@ svg.peity polyline {
.btn-default:active.focus, .btn-default:active.focus,
.btn-default.active.focus, .btn-default.active.focus,
.open>.dropdown-toggle.btn-default.focus { .open>.dropdown-toggle.btn-default.focus {
color: #fff; color: var(--button-text-hover);
background: var(--default-button-color-active); background: var(--button-color-hover);
border-color: #00000000 !important; border-color: var(--button-color-hover);
} }
.btn-default:active, .btn-default:active,
.btn-default.active, .btn-default.active,
.open>.dropdown-toggle.btn-default { .open>.dropdown-toggle.btn-default {
color: #fff; color: var(--button-text-hover) !important;
background: var(--default-button-color-active); background: var(--button-color-hover) !important;
border-color: #00000000 !important; border-color: var(--button-color-hover) !important;
} }
.btn-group>.btn:hover, .btn-group>.btn:hover,
@ -241,34 +288,34 @@ svg.peity polyline {
.btn-default:active.focus, .btn-default:active.focus,
.btn-default.active.focus, .btn-default.active.focus,
.open>.dropdown-toggle.btn-default.focus { .open>.dropdown-toggle.btn-default.focus {
color: #fff !important; color: var(--button-text-hover);
background-color: var(--default-button-color-active); background-color: var(--button-color-hover);
border-color: #00000000 !important; border-color: var(--button-color-hover);
} }
.btn-default:active, .btn-default:active,
.btn-default.active, .btn-default.active,
.open>.dropdown-toggle.btn-default { .open>.dropdown-toggle.btn-default {
color: #fff; color: var(--button-text-hover) !important ;
background-color: var(--default-button-color-active) !important; background-color: var(--button-color-hover) !important;
border-color: #00000000 !important; border-color: var(--button-color-hover) !important;
} }
/* buttons settings */ /* buttons settings */
.btn-default.sabnzbd_restart { .btn-default.sabnzbd_restart {
color: #fff; color: var(--button-text);
background-color: #a94442; background-color: #a94442;
border-color: transparent; border-color: transparent;
} }
.btn-default.sabnzbd_restart:hover { .btn-default.sabnzbd_restart:hover {
color: #fff; color: var(--button-text-hover);
background-color: #d93935; background-color: #d93935;
border-color: transparent; border-color: transparent;
} }
.btn-default.saveButton { .btn-default.saveButton {
color: #fff; color: var(--button-text);
background-color: #3c763d; background-color: #3c763d;
border-color: transparent; border-color: transparent;
} }
@ -283,20 +330,20 @@ svg.peity polyline {
/* buttons categories */ /* buttons categories */
.btn-default.delCat { .btn-default.delCat {
color: #fff; color: var(--button-text);
background-color: #a94442; background-color: #a94442;
border-color: #2d2c2c; border-color: #2d2c2c;
} }
.btn-default.delCat:hover { .btn-default.delCat:hover {
color: #fff; color: var(--button-text-hover);
background-color: #d93935; background-color: #d93935;
border-color: transparent; border-color: transparent;
} }
.btn-default.fileBrowser { .btn-default.fileBrowser {
color: #fff; color: var(--button-text);
background-color: var(--default-button-color); background-color: var(--button-color);
border-color: transparent; border-color: transparent;
} }
@ -304,20 +351,20 @@ svg.peity polyline {
.btn-default.fileBrowser:focus, .btn-default.fileBrowser:focus,
.btn-default.fileBrowser:active { .btn-default.fileBrowser:active {
color: #fff !important; color: #fff !important;
background-color: var(--default-button-color-hover) !important; background-color: var(--button-color-hover) !important;
border-color: transparent !important; border-color: transparent !important;
} }
/* Button Switches*/ /* Button Switches*/
.btn-default.restoreDefaults { .btn-default.restoreDefaults {
color: #fff; color: var(--button-text);
background-color: #a94442; background-color: #a94442;
border-color: transparent; border-color: transparent;
} }
.btn-default.restoreDefaults:hover, .btn-default.restoreDefaults:hover,
.btn-default.restoreDefaults:focus { .btn-default.restoreDefaults:focus {
color: #fff; color:var(--button-text-hover);
background-color: #d93935; background-color: #d93935;
border-color: transparent; border-color: transparent;
} }
@ -337,20 +384,20 @@ svg.peity polyline {
.btn-default.patternKey { .btn-default.patternKey {
color: #fff !important; color: #fff !important;
background-color: var(--default-button-color); background-color: var(--button-color);
border-color: transparent; border-color: transparent;
} }
.btn-default.patternKey:hover { .btn-default.patternKey:hover {
color: #fff !important; color: #fff !important;
background-color: var(--default-button-color-hover); background-color: var(--button-color-hover);
border-color: transparent; border-color: transparent;
} }
input[type="button"], input[type="button"],
input[type="submit"] { input[type="submit"] {
color: #fff !important; color: #fff !important;
background: var(--default-button-color); background: var(--button-color);
border: 1px solid #00000000 border: 1px solid #00000000
} }
@ -361,14 +408,14 @@ input[type="submit"]:active,
input[type="button"]:focus, input[type="button"]:focus,
input[type="submit"]:focus { input[type="submit"]:focus {
color: #fff !important; color: #fff !important;
background-color: var(--default-button-color-hover) !important; background-color: var(--button-color-hover) !important;
border: 1px solid #00000000 border: 1px solid #00000000
} }
/* file button */ /* file button */
.btn-default.btn-file { .btn-default.btn-file {
color: #fff; color: var(--text-hover);
background-color: var(--default-button-color); background-color: var(--button-color);
border-color: transparent; border-color: transparent;
} }
@ -376,7 +423,7 @@ input[type="submit"]:focus {
.btn-default.btn-file:active, .btn-default.btn-file:active,
.btn-default.btn-file:focus { .btn-default.btn-file:focus {
color: #fff !important; color: #fff !important;
background-color: var(--default-button-color-hover) !important; background-color: var(--button-color-hover) !important;
border-color: transparent !important; border-color: transparent !important;
} }
@ -385,13 +432,6 @@ input[type="submit"]:focus {
border-top-color: white !important; border-top-color: white !important;
} }
a,
a:active,
a:hover,
a:focus {
color: white;
}
.table-striped>tbody>tr:nth-of-type(odd) { .table-striped>tbody>tr:nth-of-type(odd) {
background-color: rgba(0, 0, 0, 0.25); background-color: rgba(0, 0, 0, 0.25);
} }
@ -421,7 +461,8 @@ table:hover {
} }
.table-hover>tbody>tr:hover { .table-hover>tbody>tr:hover {
background-color: rgba(255, 255, 255, 0.07) !important background-color: rgba(255, 255, 255, 0.07) !important;
color: var(--text-hover);
} }
tbody>tr:last-child td { tbody>tr:last-child td {
@ -437,7 +478,7 @@ tr td.row-extra-text,
.history-table tr td.status, .history-table tr td.status,
.history-table tr td.history-completedon, .history-table tr td.history-completedon,
.history-table tr td.row-extra-text { .history-table tr td.row-extra-text {
color: #fff; color: var(--text);
} }
.table-messages .table-messages-remove { .table-messages .table-messages-remove {
@ -461,7 +502,7 @@ tr td.row-extra-text,
.progress-bar-info, .progress-bar-info,
.progress-bar { .progress-bar {
background-color: var(--nav-button-color) !important; background-color: var(--button-color) !important;
} }
.glyphicon-compressed:before { .glyphicon-compressed:before {
@ -483,27 +524,37 @@ tr td.row-extra-text,
} }
#history-options .hover-button { #history-options .hover-button {
color: white; color: rgb(var(--accent-color));
} }
.pagination>li>a, .pagination>li>a,
.pagination>li>span, .pagination>li>span,
.pagination>li>span:hover { .pagination>li>span:hover {
color: white; color: var(--button-text);
background-color: var(--button-color);
border: 1px solid var(--button-color);
} }
.pagination>li>a, .pagination>li>a,
.pagination>li>span { .pagination>li>span {
background-color: rgba(0, 0, 0, 0.25) !important; color: var(--button-text);
border: none !important; background-color: var(--button-color);
border: 1px solid var(--button-color);
} }
.pagination>li>a:hover, .pagination>li>a:hover,
.pagination>li>span:hover, .pagination>li>span:hover,
.pagination>li>a:focus, .pagination>li>a:focus,
.pagination>li>span:focus { .pagination>li>span:focus {
background-color: rgba(255, 255, 255, 0.25); color: var(--button-text-hover);
border-color: transparent; background-color: var(--button-color-hover);
border: 1px solid var(--button-color-hover);
}
.pagination li.active a, .pagination li.active span, .pagination li.active a:hover, .pagination li.active span:hover {
color: var(--button-text-hover);
background-color: var(--button-color-hover);
border: 1px solid var(--button-color-hover);
} }
.pagination>.disabled>span, .pagination>.disabled>span,
@ -512,9 +563,9 @@ tr td.row-extra-text,
.pagination>.disabled>a, .pagination>.disabled>a,
.pagination>.disabled>a:hover, .pagination>.disabled>a:hover,
.pagination>.disabled>a:focus { .pagination>.disabled>a:focus {
color: white; color: var(--text-muted);
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
border-color: transparent; border: 1px solid transparent;
} }
@ -554,8 +605,8 @@ tr td.row-extra-text,
} }
.badge { .badge {
color: #fff; color: var(--label-text-color);
background-color: rgba(0, 0, 0, 0.25); background-color: rgb(var(--accent-color));
} }
/*Settings*/ /*Settings*/
@ -572,7 +623,7 @@ tr td.row-extra-text,
} }
.navbar-default .navbar-nav>li>a { .navbar-default .navbar-nav>li>a {
color: #dddddd !important; color: var(--text) !important;
} }
.navbar-default .navbar-nav>.open>a { .navbar-default .navbar-nav>.open>a {
@ -586,23 +637,25 @@ tr td.row-extra-text,
.navbar-default .navbar-nav>li>a:hover { .navbar-default .navbar-nav>li>a:hover {
background-color: hsla(0, 0%, 100%, .08) !important; background-color: hsla(0, 0%, 100%, .08) !important;
color: white !important; color: var(--text-hover) !important;
} }
.navbar-default .navbar-nav>li>a.active { .navbar-default .navbar-nav>li>a.active {
background-color: hsla(0, 0%, 0%, .15) !important; background-color: hsla(0, 0%, 0%, .15) !important;
color: var(--settings-accent-color) !important; color: rgb(var(--accent-color)) !important;
} }
#content { #content {
color: #fff; color: var(--text-hover);
} }
.colmask { .colmask {
border: none; border: none;
background-color: rgba(0, 0, 0, .25); background-color: rgba(0, 0, 0, .25);
} }
.padTable:not(.ui-sortable) {
background: var(--main-bg-color) !important;
}
table { table {
border-color: transparent !important; border-color: transparent !important;
} }
@ -628,7 +681,7 @@ table {
} }
.info-container { .info-container {
color: #fff; color: var(--text-hover);
} }
.col2 table { .col2 table {
@ -647,7 +700,7 @@ table {
} }
.path { .path {
color: #fff; color: var(--text-hover);
} }
.col2 h3 { .col2 h3 {
@ -655,35 +708,35 @@ table {
} }
.form-control.advanced-button.config-hover { .form-control.advanced-button.config-hover {
color: #fff; color: var(--text-hover);
background-color: rgba(255, 255, 255, 0.25); background-color: rgba(255, 255, 255, 0.25);
border-color: rgba(255, 255, 255, 0.25); border-color: rgba(255, 255, 255, 0.25);
border-radius: 3px !important; border-radius: 3px !important;
} }
.form-control.advanced-button.config-hover:hover { .form-control.advanced-button.config-hover:hover {
color: #fff; color: var(--text-hover);
background-color: rgba(255, 255, 255, 0.3); background-color: rgba(255, 255, 255, 0.3);
border-color: rgba(255, 255, 255, 0.3); border-color: rgba(255, 255, 255, 0.3);
border-radius: 3px !important; border-radius: 3px !important;
} }
.form-control::-moz-placeholder { .form-control::-moz-placeholder {
color: #fff !important; color: var(--text-muted) !important;
opacity: 1 opacity: 1
} }
.form-control:-ms-input-placeholder { .form-control:-ms-input-placeholder {
color: #fff !important; color: var(--text-muted) !important;
} }
.form-control::-webkit-input-placeholder { .form-control::-webkit-input-placeholder {
color: #fff !important; color: var(--text-muted) !important;
} }
.col2 p, .col2 p,
.col2-cats { .col2-cats {
color: #fff; color: var(--text-hover);
} }
/*Input*/ /*Input*/
@ -696,9 +749,9 @@ input[type="date"],
textarea, textarea,
select { select {
border: none; border: none;
background-color: rgba(255, 255, 255, 0.25); background-color: rgba(0, 0, 0, 0.15);
border-radius: 3px !important; border-radius: 3px !important;
color: #fff !important; color: var(--text-hover) !important;
outline: none; outline: none;
} }
@ -744,7 +797,7 @@ input[type="text"]:focus,
input[type="time"]:focus, input[type="time"]:focus,
input[type="url"]:focus, input[type="url"]:focus,
input[type="week"]:focus { input[type="week"]:focus {
background-color: rgba(255, 255, 255, 0.25); background-color: rgba(255, 255, 255, 0.1);
border: none; border: none;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
@ -761,11 +814,11 @@ input[type="week"]:focus {
} }
.Servers .ct-series-a .ct-line { .Servers .ct-series-a .ct-line {
stroke: #ffffff; stroke: var(--text-hover);
} }
.Servers .ct-series-a .ct-area { .Servers .ct-series-a .ct-area {
fill: #ffffff; fill: var(--text-hover);
} }
/*Categories*/ /*Categories*/
@ -832,7 +885,7 @@ select[disabled]:hover {
} }
.modal-header { .modal-header {
background: var(--modal-bg-color); background: var(--modal-header-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;
@ -843,7 +896,7 @@ select[disabled]:hover {
} }
.modal-body>.nav-tabs>li>a { .modal-body>.nav-tabs>li>a {
color: white !important; color: var(--text) !important;
opacity: 1 !important; opacity: 1 !important;
border: transparent; border: transparent;
} }
@ -851,8 +904,8 @@ select[disabled]:hover {
.modal-body>.nav-tabs>li.active>a, .modal-body>.nav-tabs>li.active>a,
.modal-body>.nav-tabs>li.active>a:hover, .modal-body>.nav-tabs>li.active>a:hover,
.modal-body>.nav-tabs>li.active>a:focus { .modal-body>.nav-tabs>li.active>a:focus {
color: #555; color: rgb(var(--accent-color)) !important;
background-color: hsla(0, 0%, 100%, .08); background-color: hsla(0, 0%, 100%, .08) !important;
border: transparent; border: transparent;
border-bottom-color: transparent; border-bottom-color: transparent;
cursor: default; cursor: default;
@ -865,6 +918,7 @@ select[disabled]:hover {
.modal-body>.nav>li>a:hover, .modal-body>.nav>li>a:hover,
.modal-body>.nav>li>a:focus { .modal-body>.nav>li>a:focus {
background-color: hsla(0, 0%, 100%, .08) !important; background-color: hsla(0, 0%, 100%, .08) !important;
color: var(--text-hover) !important;
} }
.modal-body>.tab-content>.active { .modal-body>.tab-content>.active {
@ -889,7 +943,7 @@ select[disabled]:hover {
a.list-group-item, a.list-group-item,
button.list-group-item { button.list-group-item {
color: #fff; color: var(--text-hover);
} }
a.list-group-item:hover, a.list-group-item:hover,
@ -897,22 +951,10 @@ button.list-group-item:hover,
a.list-group-item:focus, a.list-group-item:focus,
button.list-group-item:focus { button.list-group-item:focus {
text-decoration: none; text-decoration: none;
color: #fff; color: var(--text-hover);
background-color: rgba(255, 255, 255, 0.08); background-color: rgba(255, 255, 255, 0.08);
} }
legend {
display: block;
width: 100%;
padding: 0;
margin-bottom: 20px;
font-size: 21px;
line-height: inherit;
color: #fff;
border: 0;
border-bottom: none;
}
.form-control { .form-control {
border: transparent; border: transparent;
} }
@ -936,11 +978,7 @@ fieldset[disabled] .form-control {
/* Scheduling */ /* Scheduling */
.time { .time {
color: #fff; color: var(--text-hover);
}
label {
color: #ffffff;
} }
/* Wizard */ /* Wizard */
@ -978,3 +1016,12 @@ label {
#modal-options .table-server-connections th:last-child { #modal-options .table-server-connections th:last-child {
border-right: none; border-right: none;
} }
.main-helplink {
display: block;
position: static;
float: right;
color: rgb(var(--accent-color)) !important;
padding: 0px;
font-size: 1.2em;
}

10
CSS/themes/sabnzbd/space-gray.css
View File

@ -13,12 +13,4 @@
/* SABNZBD SPACE GRAY THEME */ /* SABNZBD SPACE GRAY THEME */
@import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css); @import url(https://theme-park.dev/CSS/themes/sabnzbd/sabnzbd-base.css);
:root { @import url(https://theme-park.dev/CSS/variables/space-gray.css);
--main-bg-color: radial-gradient( ellipse at center, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient( ellipse at top, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
--settings-accent-color: #81a6b7;
--nav-button-color: radial-gradient( ellipse at top, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed;
--default-button-color: #607D8B;
--default-button-color-hover: #81a6b7;
--default-button-color-active: #81a6b7;
}
Write Preview
Loading…
Cancel
Save