diff --git a/CSS/themes/dozzle/aquamarine.css b/CSS/themes/dozzle/aquamarine.css new file mode 100644 index 00000000..90d62656 --- /dev/null +++ b/CSS/themes/dozzle/aquamarine.css @@ -0,0 +1,31 @@ + +/* 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 */ + +/* DOZZLE AQUAMARINE THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/dozzle/dozzle-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; + --accent-color: 0, 150, 136; + --button-color: #009688; + --button-color-hover: #12afa0; + --button-text: #eee; + --button-text-hover: #FFF; + --text-strong-color: #fff; + --text-color: #eee; + --text-muted: #999; + --border-color: rgb(255 255 255 / 25%); + --logo-color: rgb(var(--accent-color)); + --body-background-color: var(--main-bg-color); + --border-hover-color: rgb(var(--accent-color)); +} \ No newline at end of file diff --git a/CSS/themes/dozzle/dark.css b/CSS/themes/dozzle/dark.css new file mode 100644 index 00000000..ac9855cd --- /dev/null +++ b/CSS/themes/dozzle/dark.css @@ -0,0 +1,31 @@ + +/* 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 */ + +/* DOZZLE DARK THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/dozzle/dozzle-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; + --accent-color: 100, 100, 100; + --button-color: hsla(0,0%,100%,.15); + --button-color-hover: hsla(0,0%,100%,.30); + --button-text: #eee; + --button-text-hover: #FFF; + --text-color: #eee; + --text-strong-color: #fff; + --text-muted: #727272; + --border-color: rgb(255 255 255 / 25%); + --logo-color: rgb(var(--accent-color)); + --body-background-color: var(--main-bg-color); + --border-hover-color: rgb(var(--accent-color)); +} \ No newline at end of file diff --git a/CSS/themes/dozzle/dozzle-base.css b/CSS/themes/dozzle/dozzle-base.css new file mode 100644 index 00000000..0802ee8c --- /dev/null +++ b/CSS/themes/dozzle/dozzle-base.css @@ -0,0 +1,231 @@ +/* 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 */ + +* { + outline: none; +} + +html, +body { + background: var(--main-bg-color) !important; + color: var(--text-color); +} + + +/* Scrollbar */ + +html.has-custom-scrollbars ::-webkit-scrollbar-thumb { + background-color: rgba(255, 255, 255, .25); + outline: 1px solid #0000; + border-radius: 4px; +} + +html.has-custom-scrollbars ::-webkit-scrollbar-thumb:active, +html.has-custom-scrollbars ::-webkit-scrollbar-thumb:hover { + background-color: rgba(255, 255, 255, .45); + +} + +html.has-custom-scrollbars ::-webkit-scrollbar-track { + background: #1f1f1f; +} + +html.has-custom-scrollbars ::-webkit-scrollbar-track:hover { + background: #1f1f1f; +} + +html.has-custom-scrollbars section main { + scrollbar-color: #353535 transparent; + scrollbar-width: thin +} + +/* Text important */ +p, +.menu-list a { + color: var(--text-color) !important; + +} + +.panel-heading { + background-color: rgb(var(--accent-color)); +} + +.panel-block { + color: var(--text-color); +} + +.panel-tabs a.is-active { + border-bottom-color: rgb(var(--accent-color)); + color: rgb(var(--accent-color)); +} + +.panel-tabs a { + border-bottom: 1px solid var(--border-color); + color: var(--text-color); +} + +.panel-tabs a:hover { + border-bottom: 1px solid var(--border-color); + color: var(--text-strong-color); +} + +a.panel-block:hover, +label.panel-block:hover { + background-color: rgba(255, 255, 255, .08); + color: var(--text-strong-color); +} + +/* Side Menu*/ +.menu-list a:hover { + background-color: rgba(255, 255, 255, .08); + color: var(--text-strong-color); +} + +.menu-list a.is-active, +.menu-list a.is-active:hover { + background-color: rgb(var(--accent-color)); + color: #fff !important; +} + +.menu-list li:hover .column-icon:hover { + color: black !important; +} + +li.exited a { + color: var(--text-muted) !important; +} + +.select select, +.textarea, +.input, +.dropdown-content { + background: var(--modal-bg-color); + border-color: rgba(255, 255, 255, .1); + border-radius: 4px; + color: var(--text-strong-color); +} + +.autocomplete .dropdown-item.is-hovered, +a.dropdown-item:hover, +button.dropdown-item:hover { + background: rgba(255, 255, 255, .25); + color: var(--text-strong-color); +} + +.column-icon[data-v-35775614]:hover { + color: rgb(var(--accent-color)); +} + +.select select:focus, +.textarea:focus, +.input:focus, +.select select.is-focused, +.is-focused.textarea, +.is-focused.input, +.select select:active, +.textarea:active, +.input:active, +.select select.is-active, +.is-active.textarea, +.is-active.input { + border-color: rgb(var(--accent-color)); + box-shadow: 0 0 0 0.125em rgba(var(--accent-color), .25); +} + +/* Settings buttons */ +.button { + background: var(--button-color); + color: var(--button-text); + border-color: var(--button-color); +} + +section .is-scrollbar-notification button { + background: var(--button-color) !important; + color: var(--button-text) !important; + border-color: var(--button-color) !important; +} + +.b-radio.radio.button.is-selected { + background-color: var(--button-color-hover); + border-color: transparent; + color: var(--text-strong-color); +} + +.button:hover { + background: var(--button-color-hover) !important; + border-color: var(--button-color-hover) !important; + color: var(--button-text-hover) !important; +} + +.button:active, +.button.is-active { + background: var(--button-color-hover); + border-color: var(--button-color-hover); + color: var(--text-strong-color); +} + +.is-settings-control { + background: var(--button-color); + color: var(--button-text); + border-color: transparent; +} + +.is-settings-control:hover { + border-color: var(--button-color-hover) !important; + background: var(--button-color-hover) !important; + color: var(--button-text-hover) !important; +} + +code { + background: rgba(0, 0, 0, .35) !important; +} + +.switch input[type=checkbox]:checked+.check { + background: var(--button-color); +} + +.switch:hover input[type=checkbox]:checked+.check { + background: var(--button-color-hover); +} + +.switch input[type=checkbox]:focus:checked+.check, +.switch input[type=checkbox]:active:checked+.check { + box-shadow: 0 0 0.5em rgb(var(--accent-color), .8); +} + +/* Events */ + +.events { + background: rgba(0, 0, 0, .35); +} + +.scroll-progress svg circle { + fill: rgba(255, 255, 255, .45) !important; + stroke: rgb(var(--accent-color)) !important; +} + +.scroll-progress span { + color: var(--text-strong-color) !important; +} + +.splitpanes--vertical>.splitpanes__splitter:hover { + background: rgb(var(--accent-color)) !important; +} + +.events.medium { + background: rgba(0, 0, 0, .45); +} + +.date { + color: rgb(var(--accent-color)) !important; + background: rgba(0, 0, 0, .25) !important; +} \ No newline at end of file diff --git a/CSS/themes/dozzle/hotline.css b/CSS/themes/dozzle/hotline.css new file mode 100644 index 00000000..bd5efac7 --- /dev/null +++ b/CSS/themes/dozzle/hotline.css @@ -0,0 +1,31 @@ + +/* 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 */ + +/* DOZZLE HOTLINE THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/dozzle/dozzle-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; + --accent-color: 244, 67, 54; + --button-color: hsla(0,0%,100%,.15); + --button-color-hover: hsla(0,0%,100%,.30); + --button-text: #eee; + --button-text-hover: #FFF; + --text-color: #eee; + --text-strong-color: #fff; + --text-muted: #bbb; + --border-color: rgb(255 255 255 / 25%); + --logo-color: rgb(var(--accent-color)); + --body-background-color: var(--main-bg-color); + --border-hover-color: rgb(var(--accent-color)); +} \ No newline at end of file diff --git a/CSS/themes/dozzle/organizr-dark.css b/CSS/themes/dozzle/organizr-dark.css new file mode 100644 index 00000000..233e1123 --- /dev/null +++ b/CSS/themes/dozzle/organizr-dark.css @@ -0,0 +1,31 @@ + +/* 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 */ + +/* DOZZLE ORGANIZR-DARK THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/dozzle/dozzle-base.css); +:root { + --main-bg-color: #1f1f1f; + --modal-bg-color: #1b1b1b; + --accent-color: 44, 171, 227; + --button-color: #2cabe3; + --button-color-hover: rgb(44 171 227 / .8); + --button-text: #eee; + --button-text-hover: #FFF; + --text-color: #96a2b4; + --text-strong-color: #fff; + --text-muted: #bbb; + --border-color: rgb(255 255 255 / 25%); + --logo-color: rgb(var(--accent-color)); + --body-background-color: var(--main-bg-color); + --border-hover-color: rgb(var(--accent-color)); +} \ No newline at end of file diff --git a/CSS/themes/dozzle/plex.css b/CSS/themes/dozzle/plex.css new file mode 100644 index 00000000..a12c06f0 --- /dev/null +++ b/CSS/themes/dozzle/plex.css @@ -0,0 +1,31 @@ + +/* 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 */ + +/* DOZZLE PLEX THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/dozzle/dozzle-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; + --accent-color: 229, 160, 13; + --button-color: #cc7b19; + --button-color-hover: #e59029; + --button-text: #eee; + --button-text-hover: #FFF; + --text-color: #eee; + --text-strong-color: #fff; + --text-muted: #bbb; + --border-color: rgb(255 255 255 / 25%); + --logo-color: rgb(var(--accent-color)); + --body-background-color: var(--main-bg-color); + --border-hover-color: rgb(var(--accent-color)); +} \ No newline at end of file diff --git a/CSS/themes/dozzle/space-gray.css b/CSS/themes/dozzle/space-gray.css new file mode 100644 index 00000000..b67e5944 --- /dev/null +++ b/CSS/themes/dozzle/space-gray.css @@ -0,0 +1,31 @@ + +/* 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 */ + +/* DOZZLE SPACE GRAY THEME */ +@import url(https://gilbn.github.io/theme.park/CSS/themes/dozzle/dozzle-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; + --accent-color: 129, 166, 183; + --button-color: #607D8B; + --button-color-hover: #81a6b7; + --button-text: #eee; + --button-text-hover: #FFF; + --text-color: #eee; + --text-strong-color: #fff; + --text-muted: #bbb; + --border-color: rgb(255 255 255 / 25%); + --logo-color: rgb(var(--accent-color)); + --body-background-color: var(--main-bg-color); + --border-hover-color: rgb(var(--accent-color)); +} \ No newline at end of file diff --git a/README.md b/README.md index c5722591..48f0802a 100644 --- a/README.md +++ b/README.md @@ -246,6 +246,10 @@

Flood

+ +

+

Dozzle

+ diff --git a/Screenshots/dozzle/aquamarine.png b/Screenshots/dozzle/aquamarine.png new file mode 100644 index 00000000..09573b61 Binary files /dev/null and b/Screenshots/dozzle/aquamarine.png differ diff --git a/Screenshots/dozzle/dark.png b/Screenshots/dozzle/dark.png new file mode 100644 index 00000000..32d6b777 Binary files /dev/null and b/Screenshots/dozzle/dark.png differ diff --git a/Screenshots/dozzle/hotline.png b/Screenshots/dozzle/hotline.png new file mode 100644 index 00000000..3c8c24af Binary files /dev/null and b/Screenshots/dozzle/hotline.png differ diff --git a/Screenshots/dozzle/organizr-dark.PNG b/Screenshots/dozzle/organizr-dark.PNG new file mode 100644 index 00000000..16a082b6 Binary files /dev/null and b/Screenshots/dozzle/organizr-dark.PNG differ diff --git a/Screenshots/dozzle/plex.png b/Screenshots/dozzle/plex.png new file mode 100644 index 00000000..4c2f5888 Binary files /dev/null and b/Screenshots/dozzle/plex.png differ diff --git a/Screenshots/dozzle/space-gray.png b/Screenshots/dozzle/space-gray.png new file mode 100644 index 00000000..7b0f5f59 Binary files /dev/null and b/Screenshots/dozzle/space-gray.png differ