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

adguard 🧛

pull/230/head
Marius 3 years ago
parent
92b8587e70
commit
5fee0bae5c
8 changed files with 191 additions and 52 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. 121
      CSS/themes/adguard/adguard-base.css
  2. 14
      CSS/themes/adguard/aquamarine.css
  3. 14
      CSS/themes/adguard/dark.css
  4. 34
      CSS/themes/adguard/dracula.css
  5. 14
      CSS/themes/adguard/hotline.css
  6. 16
      CSS/themes/adguard/organizr-dark.css
  7. 14
      CSS/themes/adguard/plex.css
  8. 16
      CSS/themes/adguard/space-gray.css

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

@ -31,6 +31,9 @@ body {
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 {
background: hsla(0, 0%, 100%, 0.4);
}
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 14px; width: 14px;
} }
@ -58,17 +61,19 @@ body *::-webkit-scrollbar-thumb {
/* TEXT */ /* TEXT */
a { a {
color: var(--text) color: var(--link-color)
} }
a:hover { a:hover {
color: var(--accent-color-hover); color: var(--link-color-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 {
color: var(--text-hover)
}
/* LOGIN PAGE */ /* LOGIN PAGE */
.login .login__form .text-center .h-6 { .login .login__form .text-center .h-6 {
@ -83,15 +88,15 @@ a:-webkit-any-link:focus {
.login .btn-success:hover { .login .btn-success: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);
color: var(--text-hover); color: var(--button-text-hover);
} }
.login .btn-link { .login .btn-link {
color: var(--text); color: var(--button-text);
} }
.login .btn-link:hover { .login .btn-link:hover {
color: var(--text-hover); color: var(--button-text-hover);
} }
.form__message--error { .form__message--error {
@ -109,19 +114,19 @@ a:-webkit-any-link:focus {
} }
.header .btn-outline-secondary { .header .btn-outline-secondary {
color: var(--text); color: var(--button-text);
background: var(--button-color); background: var(--button-color);
border-color: var(--button-color); border-color: var(--button-color);
} }
.header .btn-outline-secondary:hover { .header .btn-outline-secondary:hover {
color: var(--text-hover); color: var(--button-text-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
} }
.nav-tabs .nav-link.active { .nav-tabs .nav-link.active {
border-color: var(--accent-color); border-color: rgb(var(--accent-color));
color: var(--accent-color); color: rgb(var(--accent-color));
background: transparent; background: transparent;
} }
@ -152,7 +157,11 @@ a:-webkit-any-link:focus {
} }
.footer a:not(.btn) { .footer a:not(.btn) {
color: var(--text); color: var(--link-color);
}
.footer a:not(.btn):hover {
color: var(--link-color-hover);
} }
.footer .btn-outline-primary { .footer .btn-outline-primary {
@ -163,7 +172,7 @@ a:-webkit-any-link:focus {
} }
.footer .btn-outline-primary:hover { .footer .btn-outline-primary:hover {
color: var(--text); 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);
} }
@ -175,35 +184,44 @@ a:-webkit-any-link:focus {
/* BUTTONS */ /* BUTTONS */
.container .btn-outline-primary { .container .btn-outline-primary {
color: var(--text); color: var(--button-text);
background-color: var(--button-color); background-color: var(--button-color);
background-image: none; background-image: none;
border-color: var(--button-color); border-color: var(--button-color);
} }
.container .btn-outline-primary:hover { .container .btn-outline-primary:hover {
color: var(--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);
} }
.tooltip-container { .tooltip-container {
background: var(--tooltip-bg); background: rgb(var(--accent-color));
color: var(--label-text-color);
}
.toast--success {
background-color: rgba(90, 173, 99, 0.75);
} }
/* CARDS*/ /* CARDS*/
.card { .card {
background-color: rgb(255 255 255 / 8%); background-color: rgb(0 0 0 / 8%);
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
color: var(--text); color: var(--text);
} }
.card-header .card-title {
color: rgb(var(--accent-color));
}
.tooltip-custom__container { .tooltip-custom__container {
background: var(--tooltip-bg); background: rgb(var(--accent-color));
color: var(--label-text-color);
} }
.tooltip-custom__content-link { .tooltip-custom__content-link {
color: var(--tooltip-link-color); color: var(--link-color);
} }
.card-wrap, .card-wrap,
@ -245,6 +263,10 @@ a:-webkit-any-link:focus {
border-color: #F44336; border-color: #F44336;
} }
.btn-icon--green,.icon--green {
color: var(--button-color);
}
/* DROPDOWNS */ /* DROPDOWNS */
.dropdown-menu { .dropdown-menu {
color: var(--text); color: var(--text);
@ -282,13 +304,25 @@ a:-webkit-any-link:focus {
border-color: transparent !important; border-color: transparent !important;
} }
/* INSTALL */
.setup__container {
background-color: rgb(0 0 0 / 8%);
}
.setup__progress-wrap {
background-color: rgb(0 0 0 / 50%);
}
.setup__logo {
filter: invert(1);
}
/* SETTINGS */ /* SETTINGS */
.checkbox__label-subtitle, .checkbox__label-subtitle,
.form__desc, .form__desc,
.page-subtitle, .page-subtitle,
.card-title small, .card-title small,
.card-subtitle { .card-subtitle {
color: var(--text); color: var(--text-hover);
} }
.dropdown-item.active, .dropdown-item.active,
@ -302,7 +336,7 @@ a:-webkit-any-link:focus {
/* LOGS */ /* LOGS */
.logs__table { .logs__table {
background-color: rgb(255 255 255 / 8%); background-color: rgb(0 0 0 / 8%);
} }
.logs__text, .logs__text,
@ -337,6 +371,11 @@ a:-webkit-any-link:focus {
.ReactTable .rt-noData { .ReactTable .rt-noData {
background: transparent; background: transparent;
color: var(--text-muted);
}
.ReactTable .-pagination .-btn {
color: var(--text-muted);
} }
.ReactTable .-loading, .ReactTable .-loading,
@ -344,6 +383,21 @@ a:-webkit-any-link:focus {
background: rgba(255, 255, 255, 0.5); background: rgba(255, 255, 255, 0.5);
} }
.ReactTable .rt-thead .rt-th, .ReactTable .rt-thead .rt-td,
.logs__cell--header__container {
color: var(--text-hover);
}
.ReactTable .rt-tbody .rt-tr-group {
border-bottom: solid 1px rgb(255 255 255 / 20%);
}
.table th, .text-wrap table th, .table td, .text-wrap table td {
padding: 0.75rem;
vertical-align: top;
border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.loading:before { .loading:before {
background-color: transparent; background-color: transparent;
} }
@ -355,7 +409,7 @@ a:-webkit-any-link:focus {
/* FORMS */ /* FORMS */
.form-control--transparent { .form-control--transparent {
color: var(--text); color: var(--text-hover);
} }
.form-control--search { .form-control--search {
@ -370,7 +424,7 @@ a:-webkit-any-link:focus {
} }
.icon--selected { .icon--selected {
background-color: rgb(255 255 255 / 15%); background-color: rgb(0 0 0 / 15%);
border: solid 1px transparent; border: solid 1px transparent;
} }
@ -390,11 +444,11 @@ a:-webkit-any-link:focus {
.btn-success:disabled { .btn-success:disabled {
background-color: var(--button-color); background-color: var(--button-color);
border-color: var(--button-color); border-color: var(--button-color);
color: var(--text); color: var(--button-text);
} }
.btn-success:hover { .btn-success:hover {
color: var(--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);
} }
@ -406,7 +460,7 @@ a:-webkit-any-link:focus {
} }
.btn-secondary { .btn-secondary {
color: var(--text); color: var(--button-text);
background-color: rgb(255 255 255 / 25%); background-color: rgb(255 255 255 / 25%);
border-color: rgb(255 255 255 / 0%); border-color: rgb(255 255 255 / 0%);
-webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.05); -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.05);
@ -414,11 +468,26 @@ a:-webkit-any-link:focus {
} }
.btn-secondary:hover { .btn-secondary:hover {
color: var(--text-hover); color: var(--button-text-hover);
background-color: var(--button-color-hover); background-color: var(--button-color-hover);
border-color: transparent; border-color: transparent;
} }
.checkbox__input:checked + .checkbox__label:before {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMi4zIDkuMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiPjxwYXRoIGQ9Ik0xMS44IDAuNUw1LjMgOC41IDAuNSA0LjIiLz48L3N2Zz4=);
background-color: rgb(var(--accent-color));
}
.custom-radio .custom-control-input:checked~.custom-control-label::before,
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
background-color: rgb(var(--accent-color));
}
.custom-control-input:focus~.custom-control-label::before,
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
-webkit-box-shadow: 0 0 0 1px rgb(var(--accent-color)), 0 0 0 2px rgb(var(--accent-color),.25);
box-shadow: 0 0 0 1px rgb(var(--accent-color)), 0 0 0 2px rgb(var(--accent-color),.25);
}
/* MODALS */ /* MODALS */
.modal-content { .modal-content {
background: var(--modal-bg-color); background: var(--modal-bg-color);

14
CSS/themes/adguard/aquamarine.css
View File

@ -19,10 +19,16 @@
--button-color: #009688; --button-color: #009688;
--button-color-hover: #12afa0; --button-color-hover: #12afa0;
--accent-color: #009688; --button-text: #eee;
--button-text-hover: #FFF;
--accent-color: 0, 150, 136;
--accent-color-hover: #12afa0; --accent-color-hover: #12afa0;
--tooltip-bg: #009688; --link-color: #0ed2bf;
--tooltip-link-color: #f1c40f; --link-color-hover: #fff;
--text: #eee; --label-text-color: #fff;
--text:#eee;
--text-hover: #fff; --text-hover: #fff;
--text-muted: #bbb;
} }

14
CSS/themes/adguard/dark.css
View File

@ -19,10 +19,16 @@
--button-color: hsla(0,0%,100%,.15); --button-color: hsla(0,0%,100%,.15);
--button-color-hover: hsla(0,0%,100%,.30); --button-color-hover: hsla(0,0%,100%,.30);
--accent-color: rgba(255, 255, 255, 0.25); --button-text: #eee;
--button-text-hover: #FFF;
--accent-color: 100, 100, 100;
--accent-color-hover: rgba(255, 255, 255, 0.45); --accent-color-hover: rgba(255, 255, 255, 0.45);
--tooltip-bg: #1f1f1f; --link-color: #ddd;
--tooltip-link-color: #f1c40f; --link-color-hover: #fff;
--text: #eee; --label-text-color: #fff;
--text:#eee;
--text-hover: #fff; --text-hover: #fff;
--text-muted: #999;
} }

34
CSS/themes/adguard/dracula.css
View File

@ -0,0 +1,34 @@
/* 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 */
/* ADGUARD DRACULA THEME */
@import url(https://theme-park.dev/CSS/themes/adguard/adguard-base.css);
:root {
--main-bg-color: #282a36;
--modal-bg-color: #282a36;
--button-color: #bd93f9;
--button-color-hover: #ff79c6;
--button-text: #eee;
--button-text-hover: #FFF;
--accent-color: 80, 250, 123;
--accent-color-hover: #50fa7b;
--link-color: #ff79c6;
--link-color-hover: #8be9fd;
--label-text-color: #282a36;
--text:#6272a4;
--text-hover: #95adfa;
--text-muted: #999;
}

14
CSS/themes/adguard/hotline.css
View File

@ -19,10 +19,16 @@
--button-color: hsla(0,0%,100%,.15); --button-color: hsla(0,0%,100%,.15);
--button-color-hover: hsla(0,0%,100%,.30); --button-color-hover: hsla(0,0%,100%,.30);
--accent-color: #F44336; --button-text: #eee;
--button-text-hover: #FFF;
--accent-color: 244, 67, 54;
--accent-color-hover: #0b3161; --accent-color-hover: #0b3161;
--tooltip-bg: #F44336; --link-color: #ddd;
--tooltip-link-color: #0b3161; --link-color-hover: #fff;
--text: #eee; --label-text-color: #fff;
--text:#eee;
--text-hover: #fff; --text-hover: #fff;
--text-muted: #bbb;
} }

16
CSS/themes/adguard/organizr-dark.css
View File

@ -19,10 +19,16 @@
--button-color: #2cabe3; --button-color: #2cabe3;
--button-color-hover: rgb(44 171 227 / .8); --button-color-hover: rgb(44 171 227 / .8);
--accent-color: #2cabe3; --button-text: #eee;
--button-text-hover: #fff;
--accent-color: 44, 171, 227;
--accent-color-hover: white; --accent-color-hover: white;
--tooltip-bg: #1b1b1b; --link-color: #2cabe3;
--tooltip-link-color: #2cabe3; --link-color-hover: #fff;
--text: #eee; --label-text-color: #fff;
--text:#96a2b4;
--text-hover: #fff; --text-hover: #fff;
} --text-muted: #999;
}

14
CSS/themes/adguard/plex.css
View File

@ -19,10 +19,16 @@
--button-color: #cc7b19; --button-color: #cc7b19;
--button-color-hover: #e59029; --button-color-hover: #e59029;
--accent-color: #e5a00d; --button-text: #eee;
--button-text-hover: #fff;
--accent-color: 229, 160, 13;
--accent-color-hover: #ffc107; --accent-color-hover: #ffc107;
--tooltip-bg: #1f1f1f; --link-color: #e5a00d;
--tooltip-link-color: #e5a00d; --link-color-hover: #fff;
--text: #eee; --label-text-color: #fff;
--text:#eee;
--text-hover: #fff; --text-hover: #fff;
--text-muted: #bbb;
} }

16
CSS/themes/adguard/space-gray.css
View File

@ -14,15 +14,21 @@
/* ADGUARD SPACE GRAY THEME */ /* ADGUARD SPACE GRAY THEME */
@import url(https://theme-park.dev/CSS/themes/adguard/adguard-base.css); @import url(https://theme-park.dev/CSS/themes/adguard/adguard-base.css);
:root { :root {
--main-bg-color: radial-gradient( ellipse at center, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed; --main-bg-color: radial-gradient(ellipse at center, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient( ellipse at top, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed; --modal-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;
--button-color: #607D8B; --button-color: #607D8B;
--button-color-hover: #81a6b7; --button-color-hover: #81a6b7;
--accent-color: #607D8B; --button-text: #eee;
--button-text-hover: #fff;
--accent-color: 129, 166, 183;
--accent-color-hover: #81a6b7; --accent-color-hover: #81a6b7;
--tooltip-bg: #607D8B; --link-color: #9adfff;
--tooltip-link-color: #f1c40f; --link-color-hover: #fff;
--label-text-color: #fff;
--text: #eee; --text: #eee;
--text-hover: #fff; --text-hover: #fff;
--text-muted: #bbb;
} }
Write Preview
Loading…
Cancel
Save