mirror of
https://github.com/gilbN/theme.park.git
synced 2024-09-11 11:22:24 +02:00
19.1 (#372)
* fix: 🐛 Ombi: button fixes * fix: 🐛 Plex: Accent fixes * style: 💄 plex theme-option: modal color change, add plex poster var * fix: 🐛 Deluge: statusbar color fix * fix: 💄 Set placeholders to use wildcard * import placeholder in all bases * feat: 💄 Adds transparency vars * fix: 🐛 arr: CalendarDay-isToday- color fix * fix: 🐛 Bitwarden: Password generator fix, btn fix, bg fixes * refactor: 🎨 arr: Refactor sonarr and radarr-base to use servarr-base.css * Update PR template * refactor: 🎨 Refactor lidarr, prowlarr,readarr, whisparr to use servarr-base.css * fix: 🐛 arr: move styling to servarr base * fix: 💄 servarr: input background fix * Fix Modal Windows RSS Manager and Rules Manager (#365) * Fix Modal Windows RSS Manager and Rules Manager * use transparency vars Co-authored-by: GilbN <24592972+GilbN@users.noreply.github.com> * fix: 🐛 Guacamole: Fixes for #367 * style: 💄 Removed gradient color from --drop-down-menu-bg var * style: 💄 starr: use --drop-down-menu-bg var on selects * Override RSS Header Background Image (#368) After latest release RSS window header shows a tiling image caused by transparent background styling. I looked at other headers and for some reason this is the only one with this tiling image. Before: https://i.imgur.com/Sk1Gs0a.png After: https://i.imgur.com/AgSObmX.png * fix: 🐛 Guacamole: couple of tweaks in input/select * fix: 🐛 Organizr: button color hover fix * fix: 🐛 VueTorrent: Accent fixes, label text fixes * fix: 🐛 VueTorrent: More accent/button color fixes * Forgot one * fix: 🐛 VueTorrent: Table fix, torrent card text fix * fix: 💄 Remove hardcode select bg * style: 💄 starr: tooltip colors * feat: 🚀 Add Nginx Proxy Manager theme * npm name change * npm readme Co-authored-by: Zemoj <jeffgomez@zemoj.com>
This commit is contained in:
parent
9be5dc33e6
commit
1574f47edb
@ -266,6 +266,10 @@
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<p><a href="https://docs.theme-park.dev/themes/nginx-proxy-manager"><img src="https://docs.theme-park.dev/site_assets/nginx-proxy-manager/logo.png" alt="" width="48" height="48" /></a></p>
|
||||
<p><a href="https://docs.theme-park.dev/themes/nginx-proxy-manager">Nginx Proxy Manager</a></p>
|
||||
</td>
|
||||
<td>
|
||||
<p><a href="https://docs.theme-park.dev/themes/grafana"><img src="https://docs.theme-park.dev/site_assets/grafana/logo.png" alt="" width="48" height="48" /></a></p>
|
||||
<p><a href="https://docs.theme-park.dev/themes/grafana">Grafana (Deprecated)</a></p>
|
||||
</td>
|
||||
@ -289,10 +293,6 @@
|
||||
<p><a href="https://docs.theme-park.dev/themes/thelounge"><img src="https://docs.theme-park.dev/site_assets/thelounge/logo.png" alt="" width="48" height="48" /></a></p>
|
||||
<p><a href="https://docs.theme-park.dev/themes/thelounge">The Lounge (Deprecated)</a></p>
|
||||
</td>
|
||||
<td>
|
||||
<!-- <p><a href=""><img src="" alt="" width="48" height="48" /></a></p>
|
||||
<p><a href=""></a></p> -->
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
@ -532,7 +532,7 @@ h6,
|
||||
|
||||
.custom-select:focus {
|
||||
color: var(--text-hover);
|
||||
background: #1f1f1f url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxMCA1Jz48cGF0aCBmaWxsPScjOTk5JyBkPSdNMCAwTDEwIDBMNSA1TDAgMCcvPjwvc3ZnPg==") no-repeat right 0.75rem center;
|
||||
background: var(--drop-down-menu-bg) url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxMCA1Jz48cGF0aCBmaWxsPScjOTk5JyBkPSdNMCAwTDEwIDBMNSA1TDAgMCcvPjwvc3ZnPg==") no-repeat right 0.75rem center;
|
||||
background-size: 8px 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
|
||||
@ -541,7 +541,7 @@ h6,
|
||||
select.form-control.select:focus,
|
||||
select:focus {
|
||||
color: var(--text-hover);
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
.icon--selected {
|
||||
@ -634,7 +634,7 @@ select:focus {
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
.ReactModal__Content {
|
||||
@ -656,6 +656,6 @@ select:focus {
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
}
|
@ -421,7 +421,7 @@ hr {
|
||||
}
|
||||
|
||||
.popover {
|
||||
background-color: #1f1f1f;
|
||||
background-color: var(--drop-down-menu-bg);
|
||||
border: 1px solid var(--transparency-light-20);
|
||||
}
|
||||
|
||||
@ -431,7 +431,7 @@ hr {
|
||||
}
|
||||
|
||||
.popover-header {
|
||||
background-color: #1f1f1f;
|
||||
background-color: var(--drop-down-menu-bg);
|
||||
border-bottom: 1px solid var(--transparency-light-10);
|
||||
|
||||
}
|
||||
@ -797,7 +797,7 @@ input {
|
||||
|
||||
/* RECHARTS */
|
||||
.recharts-default-tooltip {
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
border: transparent !important;
|
||||
}
|
||||
|
||||
|
@ -296,7 +296,7 @@ html[class*="theme_"] .form-control:disabled,
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
/* DROPDOWN MENU */
|
||||
@ -319,7 +319,7 @@ html[class*="theme_"] .navbar .dropdown-menu .dropdown-item-text {
|
||||
|
||||
html[class*="theme_"] .dropdown-menu,
|
||||
html[class*="theme_"] .dropdown-item {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
|
@ -167,7 +167,7 @@ form.styled textarea:focus {
|
||||
select:focus,
|
||||
form.styled select:focus,
|
||||
form.styled .input.select select:focus {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text-hover);
|
||||
border: none;
|
||||
|
||||
|
@ -283,7 +283,7 @@ svg {
|
||||
}
|
||||
|
||||
select>option {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
}
|
||||
|
||||
#search #input {
|
||||
|
@ -26,7 +26,8 @@ h6 {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
body {
|
||||
body,
|
||||
.logged-out-modal guac-modal {
|
||||
background: var(--main-bg-color) !important;
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
@ -49,51 +50,6 @@ div.displayMiddle {
|
||||
-o-background-size: auto, cover;
|
||||
}
|
||||
|
||||
/* Scrollbar */
|
||||
@media only screen and (min-width: 768px) {
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
background: var(--main-bg-color);
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
background-position: center center, center center;
|
||||
background-size: auto, cover;
|
||||
-webkit-background-size: auto, cover;
|
||||
-moz-background-size: auto, cover;
|
||||
-o-background-size: auto, cover;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background: var(--transparency-dark-20);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
min-height: 50px;
|
||||
border: 3px solid transparent;
|
||||
border-radius: 8px;
|
||||
background: var(--transparency-light-50);
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* LOGIN MENU */
|
||||
div.login-ui {
|
||||
@ -105,6 +61,7 @@ div.login-ui {
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
input[type="submit"],
|
||||
button,
|
||||
a.button {
|
||||
@ -120,24 +77,34 @@ a.button:hover {
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
select {
|
||||
background: var(--transparency-dark-10);
|
||||
color: var(--text);
|
||||
border-color: transparent;
|
||||
}
|
||||
select:focus {
|
||||
background-color: var(--drop-down-menu-bg);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.login-ui .login-fields .labeled-field input:focus {
|
||||
background: var(--transparency-dark-45) !important;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.login-ui .login-fields .labeled-field.empty input {
|
||||
background: var(--transparency-dark-25) !important;
|
||||
outline: none;
|
||||
background: rgba(0, 0, 0, 0.15);
|
||||
caret-color: var(--text);
|
||||
}
|
||||
|
||||
.login-ui .login-fields .labeled-field.empty input:focus {
|
||||
background: var(--transparency-dark-45) !important;
|
||||
outline: none;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.login-ui .login-dialog .login-fields input {
|
||||
background: var(--transparency-dark-45) !important;
|
||||
background: white;
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
div.location,
|
||||
@ -146,8 +113,7 @@ input[type=email],
|
||||
input[type=number],
|
||||
input[type=password],
|
||||
textarea {
|
||||
color: var(--text-hover) !important;
|
||||
background: var(--transparency-dark-25) !important;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
input[type=checkbox],
|
||||
@ -156,33 +122,52 @@ input[type=text],
|
||||
input[type=email],
|
||||
input[type=radio],
|
||||
textarea {
|
||||
color: var(--text-hover) !important;
|
||||
background: transparent;
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.login-ui .login-dialog .login-fields input {
|
||||
background: white;
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
/* HOME MENU */
|
||||
.header h2 {
|
||||
color: var(--text-hover);
|
||||
background: var(--transparency-dark-25);
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.connection .icon.vnc,
|
||||
.connection .icon.rdp {
|
||||
background-image: url(/resources/guacamole/guac-monitor.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.connection .icon.ssh,
|
||||
.connection .icon.telnet {
|
||||
background-image: url(/resources/guacamole/guac-text.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-title {
|
||||
background-image: url(/resources/guacamole/guac-user.png);
|
||||
background-color: transparent;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/"] {
|
||||
background-image: url(/resources/guacamole/guac-home-dark.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/users"],
|
||||
@ -190,30 +175,58 @@ textarea {
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/sessions"],
|
||||
.user-menu .menu-dropdown .menu-contents li a[href="#/settings/preferences"] {
|
||||
background-image: url(/resources/guacamole/guac-config-dark.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.user-menu .menu-dropdown .menu-contents li a.logout {
|
||||
background-image: url(/resources/guacamole/guac-logout-dark.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.icon.user {
|
||||
background-image: url(/resources/guacamole/guac-user.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.pager .icon.first-page {
|
||||
background-image: url(/resources/guacamole/guac-first-page.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.pager .icon.prev-page {
|
||||
background-image: url(/resources/guacamole/guac-prev-page.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.pager .icon.next-page {
|
||||
background-image: url(/resources/guacamole/guac-next-page.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.pager .icon.last-page {
|
||||
background-image: url(/resources/guacamole/guac-last-page.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.loading::before {
|
||||
@ -222,19 +235,39 @@ textarea {
|
||||
|
||||
table.sorted th.sort-primary.sort-descending:after {
|
||||
background-image: url(/resources/guacamole/up.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-indicator {
|
||||
background-image: url(/resources/guacamole/down.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-indicator:hover {
|
||||
background-image: url(/resources/guacamole/down.png);
|
||||
color: #f9be03;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
table.sorted th.sort-primary:after {
|
||||
background-image: url(/resources/guacamole/down.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1em;
|
||||
background-position: 0.75em;
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.form-field .password-field input[type=password]~.icon.toggle-password {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
thead {
|
||||
@ -255,11 +288,6 @@ table.sorted td {
|
||||
background: var(--transparency-dark-25)
|
||||
}
|
||||
|
||||
.menu-dropdown {
|
||||
border-left: none;
|
||||
background: var(--transparency-dark-25)
|
||||
}
|
||||
|
||||
.menu-dropdown .menu-contents li a {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
@ -270,7 +298,6 @@ table.sorted td {
|
||||
|
||||
.menu-dropdown .menu-contents li a.current,
|
||||
.menu-dropdown .menu-contents li a.current:hover {
|
||||
background: var(--transparency-dark-25);
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
@ -300,9 +327,6 @@ table.sorted td {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.header .filter {
|
||||
background: var(--transparency-dark-25);
|
||||
}
|
||||
|
||||
.filter .search-string {
|
||||
background-image: url(/resources/guacamole/magnifier.png) !important;
|
||||
@ -607,3 +631,11 @@ input[type=radio] {
|
||||
.related-objects .abbreviated-related-objects ul li label span {
|
||||
color: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.attributes .form h3, .header {
|
||||
background: var(--transparency-dark-25)
|
||||
}
|
||||
|
||||
.connection-parameters .form .fields {
|
||||
border-left: 3px solid rgb(var(--accent-color));
|
||||
}
|
@ -222,9 +222,9 @@ select {
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
color: var(--text) !important;
|
||||
border: 1px solid #1f1f1f !important;
|
||||
border: 1px solid var(--drop-down-menu-bg) !important;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
||||
}
|
||||
|
||||
|
@ -551,7 +551,7 @@ select {
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
|
347
css/base/nginx-proxy-manager/nginx-proxy-manager-base.css
Normal file
347
css/base/nginx-proxy-manager/nginx-proxy-manager-base.css
Normal file
@ -0,0 +1,347 @@
|
||||
/* dP dP dP */
|
||||
/* 88 88 88 */
|
||||
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
|
||||
/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */
|
||||
/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */
|
||||
/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
|
||||
/* 88 */
|
||||
/* dP */
|
||||
|
||||
/* Made by @gilbN */
|
||||
/* https://github.com/gilbN/theme.park */
|
||||
|
||||
@import url("/css/defaults/placeholders.css");
|
||||
@import url("/css/defaults/transparent.css");
|
||||
|
||||
body {
|
||||
background: var(--main-bg-color);
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
background-position: center center, center center;
|
||||
background-size: auto, cover;
|
||||
-webkit-background-size: auto, cover;
|
||||
-moz-background-size: auto, cover;
|
||||
-o-background-size: auto, cover;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.header, .footer {
|
||||
background: var(--transparency-dark-25);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background: var(--modal-bg-color);
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
background-position: center center, center center;
|
||||
background-size: auto, cover;
|
||||
-webkit-background-size: auto, cover;
|
||||
-moz-background-size: auto, cover;
|
||||
-o-background-size: auto, cover;
|
||||
color: var(--text);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
background: var(--modal-header-color);
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
background-position: center center, center center;
|
||||
background-size: auto, cover;
|
||||
-webkit-background-size: auto, cover;
|
||||
-moz-background-size: auto, cover;
|
||||
-o-background-size: auto, cover;
|
||||
border-bottom: 1px solid var(--transparency-light-10);
|
||||
color: var(--text-hover)
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
background: var(--modal-footer-color);
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
background-position: center center, center center;
|
||||
background-size: auto, cover;
|
||||
-webkit-background-size: auto, cover;
|
||||
-moz-background-size: auto, cover;
|
||||
-o-background-size: auto, cover;
|
||||
border-top: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
/* NAVIGATION */
|
||||
|
||||
.navbar-light .navbar-brand {
|
||||
color: rgb(var(--accent-color))
|
||||
}
|
||||
|
||||
.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
color: var(--link-color);
|
||||
}
|
||||
.nav-tabs .nav-link:hover:not(.disabled) {
|
||||
border-color: var(--accent-color-hover);
|
||||
color: var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
|
||||
color: var(--accent-color-hover);
|
||||
background-color: transparent;
|
||||
border-color: var(--accent-color-hover) var(--accent-color-hover) var(--accent-color-hover);
|
||||
}
|
||||
|
||||
.navbar-light .navbar-toggler-icon {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
.navbar-light .navbar-toggler {
|
||||
color: rgba(0,0,0,0.5);
|
||||
border-color: var(--transparency-light-10);
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
|
||||
/* DROPDOWNS AND SELECTS */
|
||||
.dropdown-menu {
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text);
|
||||
border: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
.dropdown-item,
|
||||
.card-options a {
|
||||
color: var(--text);
|
||||
}
|
||||
.dropdown-item:hover, .dropdown-item:focus,
|
||||
.card-options a:hover {
|
||||
color: var(--text-hover);
|
||||
text-decoration: none;
|
||||
background-color: var(--transparency-dark-10);
|
||||
}
|
||||
|
||||
.dropdown-header {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.dropdown-icon {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.dropdown-divider {
|
||||
border-top: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
/* TEXT */
|
||||
p {
|
||||
color: var(--text);
|
||||
}
|
||||
.text-default {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.text-muted,
|
||||
.custom-switch-description,
|
||||
.text-gray,
|
||||
.text-secondary {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
.text-blue {
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
/* LINKS */
|
||||
a,.footer a:not(.btn) {
|
||||
color: var(--link-color);
|
||||
}
|
||||
a:hover, a:focus, .footer a:not(.btn):hover {
|
||||
color: var(--link-color-hover);
|
||||
}
|
||||
|
||||
/* CARDS */
|
||||
.card {
|
||||
background: var(--transparency-dark-25);
|
||||
}
|
||||
|
||||
.card-status[class*="bg-"] {
|
||||
background: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
|
||||
|
||||
/* FORMS AND INPUTS */
|
||||
|
||||
.form-control,
|
||||
.selectize-input, .selectize-control.single .selectize-input.input-active,
|
||||
.selectize-control.single {
|
||||
color: var(--text);
|
||||
background-color: var(--transparency-dark-15);
|
||||
border: 1px solid rgba(0,40,100,0.12);
|
||||
}
|
||||
.form-control:focus,
|
||||
.selectize-input:focus,
|
||||
.selectize-input.focus,
|
||||
.selectize-input.full {
|
||||
color: var(--text-hover);
|
||||
background-color: var(--transparency-dark-25);
|
||||
border-color: rgb(var(--accent-color));
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 2px rgb(var(--accent-color),.25);
|
||||
}
|
||||
|
||||
.form-control:disabled, .form-control[readonly] {
|
||||
background-color: var(--transparency-light-35);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.selectize-dropdown {
|
||||
background: var(--drop-down-menu-bg);
|
||||
border: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
.selectize-dropdown .active {
|
||||
color: var(--text);
|
||||
background-color: var(--transparency-light-10);
|
||||
}
|
||||
|
||||
.selectize-control.single .selectize-input:after {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.selectize-dropdown, .selectize-input, .selectize-input input {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.selectize-control.multi .selectize-input>div {
|
||||
background: rgb(var(--accent-color));
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.selectize-dropdown .create {
|
||||
color: var(--text);
|
||||
}
|
||||
.selectize-dropdown .active.create {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.custom-file-label {
|
||||
color: var(--text-muted);
|
||||
background: var(--transparency-dark-15);
|
||||
border: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
.custom-file-label::after {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-left: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
.form-fieldset {
|
||||
background: var(--transparency-dark-25);
|
||||
border: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
/* BUTTONS */
|
||||
|
||||
[class*="btn-"]:not(.btn-list),
|
||||
.card-options a:not(.dropdown-item.add-item),
|
||||
.input-group-text {
|
||||
color: var(--button-text);
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
[class*="btn-"]:hover:not(.btn-list),
|
||||
.card-options a:hover:not(.dropdown-item.add-item),
|
||||
[class*="btn-"]:not(:disabled):not(.disabled):not(.btn-list):active, [class*="btn-"]:not(:disabled):not(.disabled):not(.btn-list).active, .show>[class*="btn-"].dropdown-toggle,
|
||||
[class*="btn-"].disabled,[class*="btn-"]:disabled {
|
||||
color: var(--button-text-hover);
|
||||
background-color: var(--button-color-hover);
|
||||
border-color: var(--button-color-hover);
|
||||
}
|
||||
|
||||
[class*="btn-"]:focus, [class*="btn-"].focus {
|
||||
box-shadow: 0 0 0 2px rgb(var(--accent-color), .5);
|
||||
}
|
||||
.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show>.btn-secondary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 2px rgb(var(--accent-color), .5);
|
||||
}
|
||||
|
||||
.custom-switch-input:checked ~ .custom-switch-indicator {
|
||||
background: var(--button-color);
|
||||
}
|
||||
|
||||
.custom-switch-input:focus ~ .custom-switch-indicator {
|
||||
box-shadow: 0 0 0 2px rgba(var(--accent-color),0.25);
|
||||
border-color: var(--button-color)
|
||||
}
|
||||
|
||||
.custom-switch-description {
|
||||
margin-left: .5rem;
|
||||
color: #6e7687;
|
||||
transition: .3s color
|
||||
}
|
||||
|
||||
.custom-switch-input:checked ~ .custom-switch-description {
|
||||
color: #495057
|
||||
}
|
||||
|
||||
/* TABLES */
|
||||
.table th, .text-wrap table th {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.table th, .text-wrap table th, .table td, .text-wrap table td {
|
||||
border-top: 1px solid var(--transparency-light-10);
|
||||
}
|
||||
|
||||
.table thead th, .text-wrap table thead th {
|
||||
border-bottom: 1px solid rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
/* OTHER */
|
||||
|
||||
.loader {
|
||||
color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.tag {
|
||||
color: var(--label-text-color);
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.tag[class*="hover-"]:hover, [class*="hover-"]:active, [class*="hover-"]:focus {
|
||||
background-color: var(--accent-color-hover);
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
[class*="tag-"] {
|
||||
background-color: var(--accent-color-hover);
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.icon {
|
||||
color: var(--text) !important;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: var(--text);
|
||||
text-shadow: 0 1px 0 var(--text);
|
||||
}
|
||||
.close:hover, .close:focus {
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
pre {
|
||||
color: var(--text);
|
||||
background-color: var(--transparency-dark-15);
|
||||
|
||||
text-shadow: 0 1px transparent;
|
||||
}
|
@ -315,7 +315,7 @@ h6 {
|
||||
/* forms */
|
||||
select.form-control:focus {
|
||||
box-shadow: none;
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
border: 1px solid rgba(120, 130, 140, 0.4);
|
||||
}
|
||||
|
||||
@ -1403,8 +1403,8 @@ a:hover,
|
||||
|
||||
.el-element-overlay .el-card-item .el-overlay-1 .el-info>li a:hover {
|
||||
background: transparent;
|
||||
color: var(--text-hover) !important;
|
||||
border: var(--text-hover) !important;
|
||||
color: var(--text-hover);
|
||||
border: var(--text-hover);
|
||||
}
|
||||
|
||||
.progress-bar-info {
|
||||
@ -2255,7 +2255,7 @@ fieldset[disabled] .form-control {
|
||||
|
||||
.fc-unthemed .fc-divider,
|
||||
.fc-unthemed .fc-popover .fc-header {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
}
|
||||
|
||||
.table-hover>tbody>tr:hover,
|
||||
|
@ -179,7 +179,7 @@ label {
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
}
|
||||
|
||||
|
||||
|
@ -443,7 +443,7 @@ fieldset[disabled] .btn-primary:hover {
|
||||
/* FORM CONTROL */
|
||||
|
||||
select:focus, select.form-control:focus {
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
|
@ -374,9 +374,9 @@ div#t div#go:hover {
|
||||
|
||||
div select {
|
||||
-webkit-appearance: none !important;
|
||||
background: #1f1f1f url(/resources/rutorrent/dropdown.png) no-repeat 0 0;
|
||||
background: var(--drop-down-menu-bg) url(/resources/rutorrent/dropdown.png) no-repeat 0 0;
|
||||
background-position: right;
|
||||
border: 1px solid #1f1f1f;
|
||||
border: 1px solid var(--drop-down-menu-bg);
|
||||
padding-right: 15px !important;
|
||||
}
|
||||
|
||||
@ -1785,3 +1785,22 @@ div#dlgEditRules-header,
|
||||
div#dlgEditRules div.dlg-header {
|
||||
background: var(--transparency-dark-25) !important;
|
||||
}
|
||||
|
||||
#filterList, #filterProps, #ruleList{
|
||||
background: var(--modal-bg-color);
|
||||
}
|
||||
|
||||
.lf li input.TextboxFocus{
|
||||
background: var(--transparency-light-25);
|
||||
color: var(--text-hover);
|
||||
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lf li input.TextboxNormal{
|
||||
background: var(--transparency-dark-10);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
div#dlgEditFilters div.dlg-header{
|
||||
background-image:none;
|
||||
}
|
||||
|
@ -509,7 +509,7 @@ td.delete .dropdown>a .caret {
|
||||
}
|
||||
|
||||
tbody.no-downloads tr td {
|
||||
border-bottom: 1px solid #1f1f1f !important;
|
||||
border-bottom: 1px solid var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
tbody>tr>td:last-child {
|
||||
@ -967,13 +967,13 @@ input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
|
||||
input[disabled],
|
||||
select[disabled] {
|
||||
background-color: #1f1f1f;
|
||||
background-color: var(--drop-down-menu-bg);
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
input[disabled]:hover,
|
||||
select[disabled]:hover {
|
||||
background-color: #1f1f1f;
|
||||
background-color: var(--drop-down-menu-bg);
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
|
@ -278,7 +278,7 @@ td {
|
||||
.dark .form-control:focus,
|
||||
.form-select:focus,
|
||||
.form-control:focus {
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
box-shadow: 0 0 0 0.25rem rgba(var(--accent-color), 0.25);
|
||||
border-color: rgba(var(--accent-color), 0.25);
|
||||
}
|
||||
|
@ -45,7 +45,7 @@ body,
|
||||
|
||||
html {
|
||||
color: var(--text);
|
||||
background: #1f1f1f !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
/* SCROLL BAR */
|
||||
@ -78,6 +78,10 @@ p,
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
.v-select__slot>label {
|
||||
color: var(--text-hover) !important;
|
||||
}
|
||||
|
||||
.v-application .grey--text {
|
||||
color: var(--text-muted) !important;
|
||||
caret-color: var(--text-muted) !important;
|
||||
@ -86,7 +90,8 @@ p,
|
||||
[class*="theme--"].v-tabs>.v-tabs-bar .v-tab--disabled,
|
||||
[class*="theme--"].v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active),
|
||||
[class*="theme--"].v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn,
|
||||
[class*="theme--"].v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon {
|
||||
[class*="theme--"].v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon,
|
||||
[class*="theme--"].v-messages {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
@ -199,6 +204,28 @@ p,
|
||||
caret-color: var(--button-color) !important;
|
||||
}
|
||||
|
||||
.v-btn.v-application.primary {
|
||||
background-color: var(--button-color) !important;
|
||||
border-color: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
[class*="theme--"].v-btn.v-btn--disabled.v-btn--has-bg {
|
||||
background-color: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
opacity: .5;
|
||||
}
|
||||
[class*="theme--"].v-btn.v-btn--has-bg:not(.v-btn--round) {
|
||||
background-color: var(--button-color) !important;
|
||||
color: var(--button-text) !important;
|
||||
}
|
||||
|
||||
button>.v-btn--is-elevated .v-btn--has-bg.v-icon__svg {
|
||||
fill: var(--button-text);
|
||||
}
|
||||
.v-icon__svg{
|
||||
fill: rgb(var(--accent-color)) !important;
|
||||
}
|
||||
[class*="theme--"].v-tabs>.v-tabs-bar {
|
||||
background: var(--transparency-dark-15);
|
||||
}
|
||||
@ -229,8 +256,8 @@ p,
|
||||
}
|
||||
|
||||
.v-application .accent .v-icon__svg {
|
||||
color: var(--text-hover) !important;
|
||||
fill: var(--text-hover) !important;
|
||||
color: var(--button-text) !important;
|
||||
fill: var(--button-text) !important;
|
||||
}
|
||||
.v-application .deep-purple.accent-4 {
|
||||
background-color: rgb(var(--accent-color))!important;
|
||||
@ -238,6 +265,10 @@ p,
|
||||
color: var(--label-text-color);
|
||||
}
|
||||
|
||||
.v-btn--is-elevated.v-btn--has-bg .v-icon__svg:not(.v-btn--round>span>span>svg) {
|
||||
fill: var(--button-text) !important;
|
||||
}
|
||||
|
||||
.v-application .deep-purple--text.text--accent-4{
|
||||
color: rgb(var(--accent-color)) !important;
|
||||
caret-color: rgb(var(--accent-color)) !important;
|
||||
@ -313,6 +344,10 @@ p,
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.v-list-item__content .caption.grey--text {
|
||||
color: #b1b1b1 !important;
|
||||
}
|
||||
|
||||
.v-application .torrent-paused-color .caption,
|
||||
.v-application .torrent-seeding-color .caption,
|
||||
.v-application .torrent-done-color .caption {
|
||||
@ -387,14 +422,7 @@ p,
|
||||
}
|
||||
|
||||
.v-menu__content [class*="theme--"][class*="theme--"].v-list {
|
||||
background: var(--modal-bg-color) !important;
|
||||
background-repeat: repeat, no-repeat;
|
||||
background-attachment: fixed, fixed;
|
||||
background-position: center center, center center;
|
||||
background-size: auto, cover;
|
||||
-webkit-background-size: auto, cover;
|
||||
-moz-background-size: auto, cover;
|
||||
-o-background-size: auto, cover;
|
||||
background: var(--drop-down-menu-bg)
|
||||
}
|
||||
|
||||
[class*="theme--"].v-icon {
|
||||
@ -407,7 +435,7 @@ p,
|
||||
|
||||
/* TABLE */
|
||||
[class*="theme--"].v-data-table {
|
||||
background: var(--transparency-dark-65);
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
@ -456,10 +484,16 @@ p,
|
||||
|
||||
/* MOBILE */
|
||||
|
||||
|
||||
|
||||
[class*="theme--"].v-btn.v-btn--has-bg {
|
||||
background-color: rgb(var(--accent-color));
|
||||
}
|
||||
|
||||
.v-speed-dial--is-active svg {
|
||||
fill: var(--label-text-color) !important;
|
||||
}
|
||||
|
||||
.v-speed-dial__list .v-icon__svg {
|
||||
fill: var(--text-hover);
|
||||
}
|
@ -340,7 +340,7 @@ a:hover {
|
||||
|
||||
.form-control:focus {
|
||||
color: var(--text-hover);
|
||||
background: #1f1f1f;
|
||||
background: var(--drop-down-menu-bg);
|
||||
border-color: rgba(255, 255, 255, .15);
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0);
|
||||
|
@ -182,12 +182,12 @@ a:hover {
|
||||
|
||||
[class*="SelectInput-select-"]:active,
|
||||
[class*="SelectInput-select-"]:focus {
|
||||
background: #1e1e1e !important;
|
||||
background: var(--drop-down-menu-bg) !important;
|
||||
}
|
||||
|
||||
[class*="AutoSuggestInput-suggestionsList-"],
|
||||
[class*="AutoSuggestInput-suggestionsContainerOpen-"] [class*="AutoSuggestInput-suggestionsContainer-"] {
|
||||
background-color: #323232 !important;
|
||||
background-color: var(--drop-down-menu-bg) !important;
|
||||
color: white;
|
||||
border: none !important;
|
||||
}
|
||||
@ -328,8 +328,8 @@ a:hover {
|
||||
[class*="Tooltip-body-"],
|
||||
[class*="Tooltip-tooltipContainer-"],
|
||||
[class*="Tooltip-tooltip-"][class*="Tooltip-default-"] {
|
||||
background: #1f1f1f;
|
||||
color: #eee;
|
||||
background: var(--drop-down-menu-bg);
|
||||
color: var(--text-hover);
|
||||
}
|
||||
|
||||
/* @supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
|
||||
@ -348,7 +348,11 @@ a:hover {
|
||||
} */
|
||||
|
||||
[class*="Tooltip-top-"][class*="Tooltip-inverse-"] {
|
||||
border-top-color: var(--text);
|
||||
border-top-color: var(--drop-down-menu-bg);
|
||||
}
|
||||
|
||||
[class*="Tooltip-bottom-"][class*="Tooltip-inverse-"] {
|
||||
border-bottom-color: var(--drop-down-menu-bg);
|
||||
}
|
||||
|
||||
[class*="Tooltip-bottom-"][class*="Tooltip-default-"] {
|
||||
|
@ -5,7 +5,7 @@
|
||||
--modal-header-color: linear-gradient(-90deg, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(-90deg, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(135deg, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
|
||||
--drop-down-menu-bg: #265c74;
|
||||
|
||||
--button-color: #009688;
|
||||
--button-color-hover: #12afa0;
|
||||
|
@ -5,7 +5,7 @@
|
||||
--modal-header-color: linear-gradient(-90deg, rgba(247,101,184,1) 0%, rgb(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(-90deg, rgba(247,101,184,1) 0%, rgb(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(90deg, rgba(247,101,184,1) 0%, rgba(21, 95, 165) 100%) center center/cover no-repeat fixed;
|
||||
--drop-down-menu-bg: #5e61ab;
|
||||
|
||||
--button-color: #f98dc9;
|
||||
--button-color-hover: #ff4cb1;
|
||||
|
@ -5,7 +5,7 @@
|
||||
--modal-header-color: #434C5E;
|
||||
--modal-footer-color: #434C5E;
|
||||
|
||||
--drop-down-menu-bg: #3B4252;
|
||||
--drop-down-menu-bg: #333947;
|
||||
|
||||
--button-color: #79b8ca;
|
||||
--button-color-hover: #6a9daf;
|
||||
|
@ -5,7 +5,7 @@
|
||||
--modal-header-color: linear-gradient(-90deg, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
--modal-footer-color: linear-gradient(-90deg, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
|
||||
--drop-down-menu-bg: linear-gradient(-90deg, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
|
||||
--drop-down-menu-bg: #576c75;
|
||||
|
||||
--button-color: #607D8B;
|
||||
--button-color-hover: #81a6b7;
|
||||
|
Loading…
Reference in New Issue
Block a user