Browse Source

Merge pull request #1 from GilbN/master

Update to fork/master
pull/179/head
Master_of_Pants 4 years ago
committed by GitHub
parent
commit
2212485749
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 38
      .github/ISSUE_TEMPLATE/bug_report.md
  2. 10
      CSS/addons/organizr/glass/glass-base.css
  3. 4
      CSS/addons/unraid/login-page/custom_login.sh
  4. 2
      CSS/addons/unraid/login-page/retro-terminal/js/custom_text_header.js
  5. 33
      CSS/themes/flood/aquamarine.css
  6. 33
      CSS/themes/flood/dark.css
  7. 627
      CSS/themes/flood/flood-base.css
  8. 33
      CSS/themes/flood/hotline.css
  9. 33
      CSS/themes/flood/organizr-dark.css
  10. 33
      CSS/themes/flood/plex.css
  11. 33
      CSS/themes/flood/space-gray.css
  12. 6
      CSS/themes/organizr/organizr-base.css
  13. 15
      CSS/themes/petio/petio-base.css
  14. 2
      CSS/themes/plex/organizr-dark.css
  15. 16
      CSS/themes/plex/plex-base.css
  16. 19
      CSS/themes/unraid/unraid-base.css
  17. 10
      README.md
  18. BIN
      Screenshots/flood/aquamarine.png
  19. BIN
      Screenshots/flood/dark.png
  20. BIN
      Screenshots/flood/hotline.png
  21. BIN
      Screenshots/flood/organizr-dark.png
  22. BIN
      Screenshots/flood/plex.png
  23. BIN
      Screenshots/flood/space-gray.png

38
.github/ISSUE_TEMPLATE/bug_report.md

@ -0,0 +1,38 @@
---
name: Bug report
about: Create a report to help us improve
title: ''
labels: ''
assignees: ''
---
**Describe the bug**
A clear and concise description of what the bug is.
**To Reproduce**
Steps to reproduce the behavior:
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error
**Expected behavior**
A clear and concise description of what you expected to happen.
**Screenshots**
If applicable, add screenshots to help explain your problem.
**Desktop (please complete the following information):**
- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]
**Smartphone (please complete the following information):**
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]
**Additional context**
Add any other context about the problem here.

10
CSS/addons/organizr/glass/glass-base.css

@ -379,6 +379,16 @@
font-size: 20px; font-size: 20px;
color: rgba(40, 205, 65, 1); color: rgba(40, 205, 65, 1);
} }
/* Weather boxes */
#homepageOrderWeatherAndAir .col-lg-2 .white-box,
#homepageOrderWeatherAndAir > div:nth-child(1) > div.col-lg-4.col-sm-12.col-xs-12 > div,
#homepageOrderWeatherAndAir > div:nth-child(2) > div.col-lg-4.col-sm-12.col-xs-12 > div{
background: var(--div-background-color-25) !important;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px)
}
/* Custom HTML */ /* Custom HTML */
#homepageOrdercustomhtmlTwo, #homepageOrdercustomhtml { #homepageOrdercustomhtmlTwo, #homepageOrdercustomhtml {
-webkit-backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);

4
CSS/addons/unraid/login-page/custom_login.sh

@ -1,7 +1,7 @@
#!/bin/bash #!/bin/bash
TYPE="retro-terminal" TYPE="retro-terminal"
THEME="green.css" THEME="green.css"
DOMAIN="gilbn.github.io" DOMAIN="gilbn.github.io" #if you update the domain after the script has been run, You must disable and re enable JS or the whole theme.
ADD_JS="true" ADD_JS="true"
JS="custom_text_header.js" JS="custom_text_header.js"
DISABLE_THEME="false" DISABLE_THEME="false"
@ -56,4 +56,4 @@ if ! grep -q ${TYPE}"/"${THEME} /usr/local/emhttp/login.php; then
echo "Changing existing custom stylesheet.." echo "Changing existing custom stylesheet.."
sed -i "/<link rel='stylesheet' href='https:\/\/${DOMAIN}\/theme.park\/CSS\/addons\/unraid\/login-page/c <link rel='stylesheet' href='https://${DOMAIN}/theme.park/CSS/addons/unraid/login-page/${TYPE}/${THEME}'>" /usr/local/emhttp/login.php sed -i "/<link rel='stylesheet' href='https:\/\/${DOMAIN}\/theme.park\/CSS\/addons\/unraid\/login-page/c <link rel='stylesheet' href='https://${DOMAIN}/theme.park/CSS/addons/unraid/login-page/${TYPE}/${THEME}'>" /usr/local/emhttp/login.php
echo 'Stylesheet set to' ${THEME} echo 'Stylesheet set to' ${THEME}
fi fi

2
CSS/addons/unraid/login-page/retro-terminal/js/custom_text_header.js

@ -1,7 +1,9 @@
//Custom Text Header // //Custom Text Header //
// ACSII slant font
// Needs to be inside <section id="login" class="shadow"> // Needs to be inside <section id="login" class="shadow">
// You must escape any backward slashes. "\\"
let custom_text_header = ` let custom_text_header = `
<div class="custom-text-header"> <pre> __ ___ __ <div class="custom-text-header"> <pre> __ ___ __

33
CSS/themes/flood/aquamarine.css

@ -0,0 +1,33 @@
/* 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 */
/* FLOOD AQUAMARINE THEME */
@import url(https://gilbn.github.io/theme.park/CSS/themes/flood/flood-base.css);
:root {
--main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed;
--button-color: #009688;
--button-color-hover: #12afa0;
--button-text: #eee;
--button-text-hover: #FFF;
--accent-color: 18, 175, 160;
--accent-color-hover: #009688;
--queue-color: #009688;
--link-color: #0ed2bf;
--link-color-hover: #fff;
--text: #eee;
--text-hover: #fff;
}

33
CSS/themes/flood/dark.css

@ -0,0 +1,33 @@
/* 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 */
/* FLOOD DARK THEME */
@import url(https://gilbn.github.io/theme.park/CSS/themes/flood/flood-base.css);
:root {
--main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
--button-color: hsla(0, 0%, 100%, .15);
--button-color-hover: hsla(0, 0%, 100%, .30);
--button-text: #eee;
--button-text-hover: #fff;
--accent-color: 100, 100, 100;
--accent-color-hover: #ffffff73;
--queue-color: #6b5;
--link-color: #ddd;
--link-color-hover: #fff;
--text: #eee;
--text-hover: #fff;
}

627
CSS/themes/flood/flood-base.css

@ -0,0 +1,627 @@
/* dP dP dP */
/* 88 88 88 */
/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */
/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */
/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */
/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */
/* 88 */
/* dP */
/* Made by @gilbN */
/* https://github.com/gilbN/theme.park */
/* MOBILE */
@media (max-width: 720px) {
.modal__body,
.modal__content__wrapper,
.modal__header,
body,
.dark .torrents,
.torrents,
.action-bar {
background: #1b1b1b !important;
}
}
body,
.dark .torrents,
.torrents {
color: var(--text);
background: var(--main-bg-color);
}
/* TEXT */
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6,
p,
.dark .torrents__alert,
.torrents__alert {
color: var(--text);
}
/* AUTH PAGE */
.application__view--auth-form {
background: var(--main-bg-color);
}
.panel--light {
background: rgba(0, 0, 0, .25);
}
.panel {
border: 1px solid transparent;
border-radius: 4px;
box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 1px 3px 1px rgba(0, 0, 0, .2);
overflow: hidden;
}
/* FORMS */
.input,
.inverse .input {
background: rgba(255, 255, 255, .05);
color: #fff;
border: 1px solid #0000;
box-shadow: 0 1px 1px rgba(210, 216, 222, 0), 0 1px 3px 1px rgba(210, 216, 222, 0);
}
.input:hover,
.inverse .input:hover {
border: 1px solid rgba(255, 255, 255, .1);
}
.input:active,
.input:focus,
.inverse .input:active,
.inverse .input:focus,
.inverse .button--quaternary:active {
background-color: rgba(52, 156, 244, .05);
color: var(--text);
border-color: rgb(var(--accent-color));
box-shadow: 0 1px 1px rgb(var(--accent-color) / 15%), 0 1px 3px 1px rgb(var(--accent-color) / 20%), 0 0 0 1px rgb(var(--accent-color));
}
.button--quaternary,
.inverse .button--quaternary {
background: rgba(255, 255, 255, .05);
border-color: transparent;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0), 0 1px 3px 1px rgba(0, 0, 0, 0);
color: var(--text);
}
.button--quaternary:focus-visible,
.button--quaternary:hover,
.inverse .button--quaternary:focus,
.inverse .button--quaternary:hover {
border: 1px solid rgba(255, 255, 255, .1);
color: var(--text);
}
.button--quaternary:active,
.button--quaternary:focus,
.inverse .button--quaternary:active,
.inverse .button--quaternary:focus {
border-color: rgb(var(--accent-color));
box-shadow: 0 1px 1px rgb(var(--accent-color) / 15%), 0 1px 3px 1px rgb(var(--accent-color) / 20%), 0 0 0 1px rgb(var(--accent-color));
color: var(--text-hover);
}
.context-menu__items .select__item:focus-visible,
.context-menu__items .select__item:hover {
background: rgba(255, 255, 255, .15);
}
.inverse .form__element__addon {
border-color: rgb(255 255 255 / 10%);
}
.form__element__addon--is-interactive:focus .icon,
.form__element__addon--is-interactive:hover .icon {
fill: rgb(var(--accent-color));
transition: all .125s;
}
.form__element:active~.form__element__addon .icon,
.form__element:focus~.form__element__addon .icon {
fill: rgb(var(--accent-color));
}
.select__item--is-selected .icon {
fill: rgb(var(--accent-color));
}
.sortable-list__item {
background: rgb(255 255 255 / 10%);
border: 1px solid rgb(255 255 255 / 10%);
}
.css-1759iaw {
color: var(--text);
}
.css-q5wzhq:hover {
color: var(--text-hover);
background: rgba(255, 255, 255, .1);
}
.css-m5tpeq:hover {
color: var(--text-hover);
background: rgba(94, 114, 140, 0.1);
}
/* Cancel button */
.button--tertiary {
background: rgb(255 255 255 / 20%);
border-color: #768a9b;
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
}
.inverse .button--tertiary {
border-color: rgb(255 255 255 / 0%);
}
.inverse .button--tertiary:focus,
.inverse .button--tertiary:hover {
background: rgba(255, 255, 255, .35);
border-color: #0000;
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
}
.inverse .button--tertiary:active {
background: rgba(255, 255, 255, .35);
border-color: #0000;
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
}
.inverse .button--tertiary:focus,
.inverse .button--tertiary:hover {
background: rgba(255, 255, 255, .35);
border-color: #0000;
box-shadow: 0 1px 1px rgb(136 153 168 / 0%), 0 1px 3px 1px rgb(0 0 0 / 0%);
text-shadow: 0 1px 0 #00000000, 0 1px 2px rgb(0 0 0 / 0%);
}
/* DROPDOWN MENUS*/
.context-menu__items,
.menu {
background: var(--modal-bg-color);
border-radius: 4px;
box-shadow: 0 1px 1px rgba(0, 0, 0, .05), 0 1px 3px 1px rgba(0, 0, 0, .1), 0 0 0 1px rgba(0, 0, 0, .1);
color: var(--text);
}
.select__item--is-selected,
.menu__item.is-selectable.is-selected,
.dark .sidebar__icon-button:focus-visible,
.dark .sidebar__icon-button:hover,
.sidebar__icon-button:focus-visible,
.sidebar__icon-button:hover,
.dark .sidebar__icon-button:focus-visible .icon,
.dark .sidebar__icon-button:hover .icon,
.sidebar__icon-button:focus-visible .icon,
.sidebar__icon-button:hover .icon {
color: rgb(var(--accent-color));
fill: rgb(var(--accent-color));
}
.menu__item.is-selectable:focus-within,
.menu__item.is-selectable:hover {
background: rgba(255, 255, 255, .1);
color: var(--text-hover);
}
/* BUTTONS */
.button--primary,
.inverse .button--primary {
background: var(--button-color);
border-color: var(--button-color);
box-shadow: none;
text-shadow: none;
color: var(--button-text)
}
.inverse .button--primary:focus,
.inverse .button--primary:hover {
background: var(--button-color-hover);
border-color: var(--button-color-hover);
}
.button--primary:active {
background: var(--button-color-hover);
border-color: var(--button-color-hover);
}
::placeholder {
color: var(--text) !important;
}
:-ms-input-placeholder {
color: var(--text) !important;
}
::-webkit-input-placeholder {
color: var(--text) !important;
}
.error {
background: #f34570;
border-radius: 3px;
color: #fff;
padding: 8px 12px;
transition: opacity .25s;
}
/* TORRENT PAGE */
.dark .torrent--is-condensed.torrent--is-selected,
.dark .torrent--is-condensed.torrent--is-selected+.torrent,
.torrent--is-condensed.torrent--is-selected,
.torrent--is-condensed.torrent--is-selected+.torrent {
border-color: rgba(var(--accent-color), .7);
}
.dark .torrent--is-selected:after,
.dark .torrent--is-selected:hover:after,
.torrent--is-selected:after,
.torrent--is-selected:hover:after {
background: rgba(var(--accent-color), .7);
}
.dark .table__row--heading,
.table__row--heading {
background: rgba(255, 255, 255, .15);
box-shadow: 0 1px 0 hsl(0deg 0% 100% / 12%);
color: #fff;
}
.dark .torrent__detail--name,
.torrent__detail--name {
color: var(--text-hover);
}
.dark .torrent--is-condensed,
.torrent--is-condensed {
border-top: 1px solid hsla(0, 0%, 100%, .12);
}
.dark .torrent__detail,
.torrent__detail {
color: var(--text);
}
.torrent--is-downloading--actively .torrent__detail--downRate {
color: #39ce83;
font-weight: 500;
}
.table__heading:focus-visible,
.table__heading:hover,
.dark .table__heading:focus-visible,
.dark .table__heading:hover {
color: var(--text-hover);
}
.dark .table__heading--is-sorted,
.table__heading--is-sorted {
color: var(--text-hover);
}
.dark .table__heading,
.table__heading {
border-right: 1px solid hsla(0, 0%, 100%, .12);
}
.dark .table__heading__handle:after,
.table__heading__handle:after {
background: hsla(0, 0%, 100%, .6);
}
.torrent--is-condensed:nth-child(0n+1),
.dark .torrent--is-condensed,
.torrent--is-condensed {
border-top: 1px solid hsla(0, 0%, 100%, .12);
}
.torrent-details__sub-heading__secondary,
.dark .torrent-details__sub-heading__secondary {
color: var(--text);
display: flex;
font-size: .85rem;
flex: 1 0 auto;
}
.torrent-details__sub-heading__tertiary .icon,
.dark .torrent-details__sub-heading__tertiary .icon {
fill: rgba(var(--accent-color), .5);
height: 12px;
margin-right: 3px;
margin-top: -3px;
vertical-align: middle;
width: 12px;
}
.torrent-details__table,
.dark .torrent-details__table,
.torrent-details__table__heading--tertiary,
.dark .torrent-details__table__heading--tertiary,
.torrent-details__detail__label,
.dark .torrent-details__detail__label {
color: var(--text);
}
.torrent-details__section--file-tree .directory-tree__node {
color: var(--text) !important;
}
.torrent-details__section--file-tree .directory-tree__parent-directory,
.dark .torrent-details__section--file-tree .directory-tree__parent-directory {
color: rgba(var(--accent-color), .6);
}
.torrent-details__table__heading--primary,
.torrent-details__table__heading--secondary {
color: rgba(var(--accent-color), .6);
}
.torrent-details__section .badge {
background: var(--button-color);
color: var(--button-text);
}
.torrent-details__action.is-active {
color: rgb(var(--accent-color));
}
.priority-meter--max-3.priority-meter--level-1:after {
background: rgb(var(--accent-color));
}
/* TOB NAVBAR */
.action-bar {
background: var(--main-bg-color);
border-bottom: 1px solid rgba(255, 255, 255, .1);
color: var(--text);
}
.dark .action .icon,
.action .icon {
fill: var(--text-hover);
}
.dark .action:focus-visible,
.dark .action:hover,
.action:focus-visible,
.action:hover {
background: rgba(255, 255, 255, .1);
box-shadow: none;
}
.action:focus-visible .icon,
.action:hover .icon,
.dark .action:focus-visible .icon,
.dark .action:hover .icon {
fill: rgb(var(--accent-color));
}
.dropdown__value,
.dropdown.is-expanded .dropdown__header .dropdown__value {
color: rgb(var(--accent-color));
}
/* SIDE MENU */
.dark .application__sidebar,
.application__sidebar {
background: rgba(0, 0, 0, .25);
box-shadow: 1px 0 hsl(0deg 0% 100% / 12%);
color: var(--text);
}
.dark .sidebar-filter__item,
.sidebar-filter__item {
color: var(--text);
}
.dark .sidebar-filter__item.is-active,
.sidebar-filter__item.is-active {
color: rgb(var(--accent-color));
}
.dark .sidebar-filter__item.is-active .icon,
.sidebar-filter__item.is-active .icon {
fill: rgb(var(--accent-color));
}
.dark .sidebar-filter__item.is-active .badge,
.sidebar-filter__item.is-active .badge {
background: rgb(var(--accent-color));
color: var(--button-text-hover);
}
.dark .sidebar-filter__item .icon,
.sidebar-filter__item .icon {
fill: hsla(0, 0%, 100%, .38);
}
.sidebar-filter .badge,
.dark .sidebar-filter .badge {
background: rgb(var(--accent-color), .3);
color: var(--text);
}
.dark .sidebar-filter__item:focus-visible,
.dark .sidebar-filter__item:hover,
.sidebar-filter__item:focus-visible,
.sidebar-filter__item:hover {
color: var(--text-hover);
}
.search.is-in-use .textbox {
background: rgba(var(--accent-color), .25);
border-bottom: 1px solid rgba(var(--accent-color), .3);
border-top: 1px solid rgba(var(--accent-color), .3);
color: var(--text);
padding-right: 45px;
}
.search.is-in-use .icon {
fill: rgb(var(--accent-color));
opacity: 1;
}
.search .textbox {
border: 1px solid rgba(var(--accent-color), .2);
background: rgba(var(--accent-color), .1);
color: var(--text);
}
.search .icon {
fill: white;
}
.dark .sidebar__diskusage .progress-bar__fill,
.sidebar__diskusage .progress-bar__fill {
background: hsla(0, 0%, 100%, .38);
}
.dark .sidebar__diskusage .progress-bar__fill__wrapper,
.sidebar__diskusage .progress-bar__fill__wrapper {
background: hsla(0, 0%, 100%, .12);
}
.dark .sidebar__icon-button,
.sidebar__icon-button {
color: var(--text);
}
.sidebar__icon-button .icon,
.dark .sidebar__icon-button .icon {
fill: var(--text);
}
.diskusage__details-list__label {
color: rgb(var(--accent-color));
}
.tooltip__content {
background: #1b1b1b;
color: var(--text);
}
/* MODAL */
.modal__body,
.modal__content__wrapper,
.modal__header {
background: var(--modal-bg-color);
color: var(--text)
}
.modal--size-large {
width: 776px;
}
.modal--vertical.modal--tabs-in-header .modal__header {
box-shadow: inset -1px 0 0 rgba(255, 255, 255, .1);
background: var(--modal-bg-color);
}
.modal__header {
color: var(--text);
box-shadow: inset 0 -1px 0 rgb(255 255 255 / 10%);
}
.modal__tabs .modal__tab.is-active {
color: rgb(var(--accent-color));
}
.modal__tabs {
color: var(--text);
font-size: .85rem;
font-weight: 500;
margin: 5px -5px 0;
}
.toggle-input__indicator__icon .icon {
fill: var(--button-text);
transition: all .25s;
}
.inverse .toggle-input__indicator {
background: var(--button-color);
border: 1px solid var(--button-color);
box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 1px 3px 1px rgba(0, 0, 0, .2);
}
.inverse .toggle-input:hover .toggle-input__indicator {
border-color: var(--button-color-hover);
background: var(--button-color-hover)
}
.toggle-input:active,
.toggle-input:focus {
color: var(--accent-color-hover);
}
.toggle-input:active .toggle-input__indicator .icon,
.toggle-input:active .toggle-input__indicator__icon .icon,
.toggle-input:focus .toggle-input__indicator .icon,
.toggle-input:focus .toggle-input__indicator__icon .icon {
fill: var(--accent-color-hover);
}
.inverse .toggle-input:active .toggle-input__indicator,
.inverse .toggle-input:focus .toggle-input__indicator,
.toggle-input:active .toggle-input__indicator,
.toggle-input:focus .toggle-input__indicator {
border-color: var(--accent-color-hover);
box-shadow: 0 1px 1px rgb(var(--accent-color) / 15%), 0 1px 3px 1px rgb(var(--accent-color) / 20%), 0 0 0 1px var(--accent-color-hover);
;
}
.interactive-list {
background: rgb(255 255 255 / 10%);
border: 1px solid rgb(255 255 255 / 10%);
box-shadow: 0 1px 1px rgb(0 0 0 / 15%), 0 1px 3px 1px rgb(0 0 0 / 20%);
color: var(--text);
}
.dropzone__icon .icon--files {
fill: rgba(var(--accent-color), .5);
height: 64px;
transition: fill .25s;
width: 64px;
}
.dropzone__browse-button {
color: rgb(var(--accent-color));
text-decoration: underline;
}
.dropzone:hover {
border-color: rgb(0 0 0 / 25%);
}
.dropzone:hover .dropzone__icon .icon {
fill: var(--accent-color-hover);
}

33
CSS/themes/flood/hotline.css

@ -0,0 +1,33 @@
/* 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 */
/* FLOOD HOTLINE THEME */
@import url(https://gilbn.github.io/theme.park/CSS/themes/flood/flood-base.css);
:root {
--main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed;
--button-color: hsla(0, 0%, 100%, .15);
--button-color-hover: hsla(0, 0%, 100%, .30);
--button-text: #eee;
--button-text-hover: #fff;
--accent-color: 244, 67, 54;
--accent-color-hover: #0b3161;
--queue-color: #6b5;
--link-color: #0b3161;
--link-color-hover: #fff;
--text: #eee;
--text-hover: #fff;
}

33
CSS/themes/flood/organizr-dark.css

@ -0,0 +1,33 @@
/* 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 */
/* FLOOD ORGANIZR-DARK THEME */
@import url(https://gilbn.github.io/theme.park/CSS/themes/flood/flood-base.css);
:root {
--main-bg-color: #1f1f1f;
--modal-bg-color: #1b1b1b;
--button-color: #2cabe3;
--button-color-hover: rgb(44 171 227 / .8);
--button-text: #eee;
--button-text-hover: #fff;
--accent-color: 44, 171, 227;
--accent-color-hover: white;
--queue-color: #2cabe3;
--link-color: #2cabe3;
--link-color-hover: #fff;
--text: #96a2b4;
--text-hover: #fff;
}

33
CSS/themes/flood/plex.css

@ -0,0 +1,33 @@
/* 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 */
/* FLOOD PLEX THEME */
@import url(https://gilbn.github.io/theme.park/CSS/themes/flood/flood-base.css);
:root {
--main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed;
--modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed;
--button-color: #cc7b19;
--button-color-hover: #e59029;
--button-text: #eee;
--button-text-hover: #FFF;
--accent-color: 229, 160, 13;
--accent-color-hover: #ffc107;
--queue-color: #27c24c;
--link-color: #e5a00d;
--link-color-hover: #fff;
--text: #eee;
--text-hover: #fff;
}

33
CSS/themes/flood/space-gray.css

@ -0,0 +1,33 @@
/* 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 */
/* FLOOD SPACE GRAY THEME */
@import url(https://gilbn.github.io/theme.park/CSS/themes/flood/flood-base.css);
:root {
--main-bg-color: radial-gradient(ellipse at center, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
--modal-bg-color: radial-gradient(ellipse at top, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed;
--button-color: #607D8B;
--button-color-hover: #81a6b7;
--button-text: #eee;
--button-text-hover: #fff;
--accent-color: 129, 166, 183;
--accent-color-hover: #607D8B;
--queue-color: #81a6b7;
--link-color: #9adfff;
--link-color-hover: #fff;
--text: #eee;
--text-hover: #fff;
}

6
CSS/themes/organizr/organizr-base.css

@ -494,9 +494,9 @@ table.dataTable>tbody>tr:nth-of-type(even):hover {
#homepageOrdertransmission .white-box { #homepageOrdertransmission .white-box {
padding-right: 0px !important; padding-right: 0px !important;
} }
#homepage-items .white-box { /* #homepage-items .white-box {
padding-left: 0px !important; padding-left: 0px !important;
} }*/
#homepage-items .nav-tabs>li.active>a, .nav-tabs>li.active>a:hover { #homepage-items .nav-tabs>li.active>a, .nav-tabs>li.active>a:hover {
cursor: pointer; cursor: pointer;
opacity: 1; opacity: 1;
@ -1040,4 +1040,4 @@ table.dataTable>tbody>tr:nth-of-type(even):hover {
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, .6); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, .6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, .6); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, .6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 255, 255, .6);
} }

15
CSS/themes/petio/petio-base.css

@ -20,9 +20,11 @@ body {
} }
/* TEXT COLOR */ /* TEXT COLOR */
.sub-title, p,
.widget--title, .card .text-wrap .title,
p { .card .text-wrap .year,
.media-content .overview,
.media-content .media-crew .crew-credit {
color: var(--text-color); color: var(--text-color);
} }
@ -270,7 +272,12 @@ code {
background: var(--button-color-hover); background: var(--button-color-hover);
} }
.requests--status__pending { .requests--status__pending,
.requests--status__orange,
.requests--status__bad,
.requests--status__cinema,
.requests--status__blue,
.requests--status__manual {
color: #fff; color: #fff;
} }

2
CSS/themes/plex/organizr-dark.css

@ -11,7 +11,7 @@
/* https://github.com/gilbN/theme.park */ /* https://github.com/gilbN/theme.park */
/* PLEX ORGANIZR-DARK THEME */ /* PLEX ORGANIZR-DARK THEME */
@import url(https://gilbn.github.io//theme.park/CSS/themes/plex/plex-base.css); @import url(https://gilbn.github.io/theme.park/CSS/themes/plex/plex-base.css);
:root { :root {
--main-bg-color: #1f1f1f; --main-bg-color: #1f1f1f;
--modal-bg-color: #1b1b1b; --modal-bg-color: #1b1b1b;

16
CSS/themes/plex/plex-base.css

@ -44,7 +44,8 @@ a:hover {
/* BODY */ /* BODY */
[class*="FullPageBackground-backgroundContainer"] [class*="CrossFadeImage-crossFade"], [class*="FullPageBackground-backgroundContainer"] [class*="CrossFadeImage-crossFade"],
#plex>[class*="background-container"]>div>div>div:nth-child(2) { #plex>[class*="background-container"]>div>div>div:nth-child(2),
#plex>div[class*="FullPageBackground-backgroundContainer-"]>div>div:nth-child(2) {
background: var(--main-bg-color) !important; background: var(--main-bg-color) !important;
} }
@ -105,7 +106,9 @@ a:hover {
[class*="PageHeaderTabButton-isSelected"], [class*="PageHeaderTabButton-isSelected"],
[class*="PageHeaderTabDropdown-isSelected"], [class*="PageHeaderTabDropdown-isSelected"],
[class*="MultiSelectPageHeader-selectedTitle"] { [class*="MultiSelectPageHeader-selectedTitle"],
[class*="PageHeaderMultiselectActions-container-"],
[class*="PageHeaderMultiselectActions-count-"] {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
border-color: rgb(var(--accent-color)); border-color: rgb(var(--accent-color));
} }
@ -125,7 +128,9 @@ a:hover {
box-shadow: 0 2px 0 0 rgb(var(--accent-color)); box-shadow: 0 2px 0 0 rgb(var(--accent-color));
} }
[class*="MetadataPosterCardFace-isSelected"] { [class*="MetadataPosterCardFace-isSelected"],
[class*="MetadataPosterCard-hoveredSelectedLink-"],
[class*="MetadataPosterCard-selectedLink-"] {
box-shadow: 0 0 0 2px rgb(var(--accent-color)), 0 0 4px rgb(0 0 0 / 30%); box-shadow: 0 0 0 2px rgb(var(--accent-color)), 0 0 4px rgb(0 0 0 / 30%);
} }
@ -242,6 +247,11 @@ a:hover {
color: rgb(var(--accent-color)); color: rgb(var(--accent-color));
} }
[class*="SelectButton-selectedCircle-"] {
border-color: rgb(var(--accent-color));
background-color: rgb(var(--accent-color));
}
/* MODAL */ /* MODAL */
[class*="ModalContent-modalContent-"] { [class*="ModalContent-modalContent-"] {
background: var(--modal-bg-color); background: var(--modal-bg-color);

19
CSS/themes/unraid/unraid-base.css

@ -321,23 +321,23 @@ div.tabs {
/*DROPDOWN MENU*/ /*DROPDOWN MENU*/
.dropdown-menu { .dropdown-menu {
background: var(--modal-bg-color); background: var(--modal-bg-color) !important;
} }
.dropdown-menu a { .dropdown-menu a {
color: var(--text); color: var(--text) !important;
} }
.dropdown-menu .divider { .dropdown-menu .divider {
background-color: rgb(255 255 255 / 10%); background-color: rgb(255 255 255 / 10%) !important;
border-bottom: 1px solid rgb(255 255 255 / 10%); border-bottom: 1px solid rgb(255 255 255 / 10%) !important;
} }
.dropdown-menu li>a:hover, .dropdown-menu li>a:hover,
.dropdown-menu li>a:focus, .dropdown-menu li>a:focus,
.dropdown-submenu:hover>a { .dropdown-submenu:hover>a {
color: var(--text-hover); color: var(--text-hover) !important;
background: rgb(255 255 255 / 10%); background: rgb(255 255 255 / 10%) !important;
} }
/*VM MANAGER*/ /*VM MANAGER*/
@ -421,3 +421,10 @@ blockquote {
unraid-authed::part(div[data-v-050c892a] > button) { unraid-authed::part(div[data-v-050c892a] > button) {
background: pink !important; background: pink !important;
} }
/* Edit template*/
#contDescription {
background: rgb(0 0 0 / 25%);
padding: 1%;
border-radius: 5px;
}

10
README.md

@ -194,11 +194,11 @@
<p><a href="https://github.com/gilbN/theme.park/wiki/Lazylibrarian">Lazylibrarian</a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Lazylibrarian">Lazylibrarian</a></p>
</td> </td>
<td style="width: 90px; height: 40px; text-align: center;"> <td style="width: 90px; height: 40px; text-align: center;">
<p><a href="https://github.com/gilbN/theme.park/wiki/Adguard"><img src="https://github.com/causefx/Organizr/blob/v2-master/plugins/images/tabs/AdGuardHome.png" alt="" width="48" height="48" /></a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Adguard"><img src="https://raw.githubusercontent.com/causefx/Organizr/v2-master/plugins/images/tabs/AdGuardHome.png" alt="" width="48" height="48" /></a></p>
<p><a href="https://github.com/gilbN/theme.park/wiki/Adguard">Adguard</a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Adguard">Adguard</a></p>
</td> </td>
<td style="width: 90px; height: 40px; text-align: center;"> <td style="width: 90px; height: 40px; text-align: center;">
<p><a href="https://github.com/gilbN/theme.park/wiki/Gaps"><img src="https://github.com/JasonHHouse/gaps/blob/master/images/gaps.png" alt="" width="48" height="48" /></a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Gaps"><img src="https://raw.githubusercontent.com/JasonHHouse/gaps/master/images/gaps.png" alt="" width="48" height="48" /></a></p>
<p><a href="https://github.com/gilbN/theme.park/wiki/Gaps">Gaps</a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Gaps">Gaps</a></p>
</td> </td>
</tr> </tr>
@ -235,13 +235,17 @@
</tr> </tr>
<tr> <tr>
<td style="width: 90px; height: 40px; text-align: center;"> <td style="width: 90px; height: 40px; text-align: center;">
<p><a href="https://github.com/gilbN/theme.park/wiki/Moviematch"><img src="https://raw.githubusercontent.com/LukeChannings/moviematch/main/web/static/icons/icon-180.png" alt="" width="48" height="48" /></a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Moviematch"><img src="https://raw.githubusercontent.com/LukeChannings/moviematch/main/web/app/static/icons/icon-180.png" alt="" width="48" height="48" /></a></p>
<p><a href="https://github.com/gilbN/theme.park/wiki/Moviematch">Moviematch</a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Moviematch">Moviematch</a></p>
</td> </td>
<td style="width: 90px; height: 40px; text-align: center;"> <td style="width: 90px; height: 40px; text-align: center;">
<p><a href="https://github.com/gilbN/theme.park/wiki/Petio"><img src="https://avatars.githubusercontent.com/u/75477127?s=48&v=4" alt="" width="48" height="48" /></a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Petio"><img src="https://avatars.githubusercontent.com/u/75477127?s=48&v=4" alt="" width="48" height="48" /></a></p>
<p><a href="https://github.com/gilbN/theme.park/wiki/Petio">Petio</a></p> <p><a href="https://github.com/gilbN/theme.park/wiki/Petio">Petio</a></p>
</td> </td>
<td style="width: 90px; height: 40px; text-align: center;">
<p><a href="https://github.com/gilbN/theme.park/wiki/Flood"><img src="https://raw.githubusercontent.com/jesec/flood/master/client/src/public/icon_96x96.png" alt="" width="48" height="48" /></a></p>
<p><a href="https://github.com/gilbN/theme.park/wiki/Flood">Flood</a></p>
</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>

BIN
Screenshots/flood/aquamarine.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 867 KiB

BIN
Screenshots/flood/dark.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 459 KiB

BIN
Screenshots/flood/hotline.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
Screenshots/flood/organizr-dark.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

BIN
Screenshots/flood/plex.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 MiB

BIN
Screenshots/flood/space-gray.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 818 KiB

Loading…
Cancel
Save