diff --git a/CSS/themes/vuetorrent/aquamarine.css b/CSS/themes/vuetorrent/aquamarine.css new file mode 100644 index 00000000..d79eb317 --- /dev/null +++ b/CSS/themes/vuetorrent/aquamarine.css @@ -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 */ + +/* VUETORRENT AQUAMARINE THEME */ +@import url(https://theme-park.dev/CSS/themes/vuetorrent/vuetorrent-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-muted: #ccc; + --text-hover: #fff; +} \ No newline at end of file diff --git a/CSS/themes/vuetorrent/dark.css b/CSS/themes/vuetorrent/dark.css new file mode 100644 index 00000000..144ff913 --- /dev/null +++ b/CSS/themes/vuetorrent/dark.css @@ -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 */ + +/* VUETORRENT DARK THEME */ +@import url(https://theme-park.dev/CSS/themes/vuetorrent/vuetorrent-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-muted: #ccc; + --text-hover: #fff; +} \ No newline at end of file diff --git a/CSS/themes/vuetorrent/hotline.css b/CSS/themes/vuetorrent/hotline.css new file mode 100644 index 00000000..f612f673 --- /dev/null +++ b/CSS/themes/vuetorrent/hotline.css @@ -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 */ + +/* VUETORRENT HOTLINE THEME */ +@import url(https://theme-park.dev/CSS/themes/vuetorrent/vuetorrent-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-muted: #ccc; + --text-hover: #fff; +} \ No newline at end of file diff --git a/CSS/themes/vuetorrent/organizr-dark.css b/CSS/themes/vuetorrent/organizr-dark.css new file mode 100644 index 00000000..d56e6334 --- /dev/null +++ b/CSS/themes/vuetorrent/organizr-dark.css @@ -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 */ + +/* VUETORRENT ORGANIZR-DARK THEME */ +@import url(https://theme-park.dev/CSS/themes/vuetorrent/vuetorrent-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-muted: #ccc; + --text-hover: #fff; +} \ No newline at end of file diff --git a/CSS/themes/vuetorrent/plex.css b/CSS/themes/vuetorrent/plex.css new file mode 100644 index 00000000..57abf48b --- /dev/null +++ b/CSS/themes/vuetorrent/plex.css @@ -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 */ + +/* VUETORRENT PLEX THEME */ +@import url(https://theme-park.dev/CSS/themes/vuetorrent/vuetorrent-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-muted: #ccc; + --text-hover: #fff; +} \ No newline at end of file diff --git a/CSS/themes/vuetorrent/space-gray.css b/CSS/themes/vuetorrent/space-gray.css new file mode 100644 index 00000000..1cc232c7 --- /dev/null +++ b/CSS/themes/vuetorrent/space-gray.css @@ -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 */ + +/* VUETORRENT SPACE GRAY THEME */ +@import url(https://theme-park.dev/CSS/themes/vuetorrent/vuetorrent-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-muted: #ccc; + --text-hover: #fff; +} \ No newline at end of file diff --git a/CSS/themes/vuetorrent/vuetorrent-base.css b/CSS/themes/vuetorrent/vuetorrent-base.css new file mode 100644 index 00000000..45c14b52 --- /dev/null +++ b/CSS/themes/vuetorrent/vuetorrent-base.css @@ -0,0 +1,259 @@ +/* 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,html, +.background, +.theme--light.v-application, +.theme--dark.v-application, .v-application .background{ + color: var(--text); + background: var(--main-bg-color) !important; +} + +/* SCROLL BAR */ +#app>div>nav>nav>div.v-navigation-drawer__content::-webkit-scrollbar-thumb { + background: rgba(255, 255, 255, .1); + border-radius: 20px +} +#app>div>nav>nav>div.v-navigation-drawer__content::-webkit-scrollbar-thumb:hover { + background: rgba(255, 255, 255, .25); + border-radius: 20px +} + +/* TEXT */ +.h1, +.h2, +.h3, +.h4, +.h5, +.h6, +h1, +h2, +h3, +h4, +h5, +h6, +p, +.theme--dark.v-label, +.theme--light.v-label, +.theme--light.v-counter { + color: var(--text); +} +.v-application .grey--text { + color: var(--text-muted) !important; + caret-color: var(--text-muted) !important; +} +.theme--light.v-tabs>.v-tabs-bar .v-tab--disabled, .theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active), .theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn, .theme--light.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon, +.theme--dark.v-tabs>.v-tabs-bar .v-tab--disabled, .theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active), .theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-btn, .theme--dark.v-tabs>.v-tabs-bar .v-tab:not(.v-tab--active)>.v-icon{ + color: var(--text); +} +.theme--dark.v-subheader, +.theme--light.v-subheader{ + color: hsla(0,0%,100%,.7); +} +.theme--light.v-input, .theme--light.v-input input, .theme--light.v-input textarea { + color: var(--text); +} +/* TOP NAVBAR */ + +.theme--light.v-app-bar.v-toolbar.v-sheet, +.theme--dark.v-app-bar.v-toolbar.v-sheet{ + background-color: rgba(0, 0, 0, .25) !important; + color: var(--text) !important; +} +.v-navigation-drawer__content .theme--dark.v-card, +.v-navigation-drawer__content .theme--light.v-card{ + background: rgba(0, 0, 0, 0) !important; + +} + +/* SIDE MENU */ +.v-application .primary { + background: rgba(0, 0, 0, .25) !important; + color: var(--text) !important; +} +.v-application .secondary { + background-color: rgba(255, 255, 255, .15) !important; + border-color: rgba(255, 255, 255, .15) !important; + +} +.theme--dark.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border, +.theme--light.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border{ + background-color: rgba(0,0,0,.12); +} + +@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) { +.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close), +.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close) { + -webkit-backdrop-filter: blur(10px); + backdrop-filter: blur(10px); + } + } + /* slightly transparent fallback for Firefox (not supporting backdrop-filter) */ + @supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { +.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close), +.v-navigation-drawer--is-mobile:not(.v-navigation-drawer--close), .v-navigation-drawer--temporary:not(.v-navigation-drawer--close) { + background-color: rgba(0, 0, 0, 0.9); + } + } + +.v-application .download--text { + color: rgb(var(--accent-color)) !important; + caret-color: rgb(var(--accent-color)) !important; +} +.v-navigation-drawer__content .download--text { + color: var(--v-download-base) !important; + caret-color: var(--v-download-base) !important; +} + +/* MODAL */ +.v-dialog .theme--dark.v-card, +.v-dialog .theme--light.v-card, +.v-dialog .theme--light.v-tabs-items, +.v-dialog .theme--dark.v-tabs-items, +.v-dialog .theme--light.v-list, +.v-dialog .theme--dark.v-list{ + background: var(--modal-bg-color); + color: var(--text); +} + +.v-application .primary--text { + color: var(--button-color) !important; + caret-color: var(--button-color) !important; +} +.theme--light.v-tabs>.v-tabs-bar, +.theme--dark.v-tabs>.v-tabs-bar{ + background-color: rgba(0, 0, 0, .15); +} + +.v-application .white, +.v-tab:before, .v-tabs-slider { + background-color: rgb(var(--accent-color)) !important; + border-color: rbg(var(--accent-color)) !important; +} + +.theme--dark.v-icon.v-icon.v-icon--disabled, +.theme--light.v-icon.v-icon.v-icon--disabled{ + color: rgba(255, 255, 255, .38) !important; +} + +.theme--dark.v-text-field--solo>.v-input__control>.v-input__slot, +.theme--light.v-text-field--solo>.v-input__control>.v-input__slot{ + background: #1e1e1e; +} +.v-input__icon svg, .v-select__selection { + color: rgb(var(--accent-color))!important; +} +.v-application .accent { + background-color: var(--button-color) !important; + border-color: var(--button-color) !important; +} +.theme--light.v-text-field>.v-input__control>.v-input__slot:before { + border-color: rgb(255 255 255 / 42%); +} +.theme--light.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before { + border-color: rgba(255, 255, 255, .87); +} +/* FORMS */ +.v-input__slot:hover fieldset, .v-text-field--outlined fieldset { + border-color: rgba(255, 255, 255, .1)!important; +} + +/* DASHBOARD */ + +.theme--dark.v-card.sideborder.done, +.theme--light.v-card.sideborder.done{ + background-color: #16573e40; + color: #FFF; +} +.theme--dark.v-card.sideborder.downloading, +.theme--light.v-card.sideborder.downloading{ + background-color: #5bb97440; + color: #FFF; +} +.theme--dark.v-card.sideborder.fail, +.theme--light.v-card.sideborder.fail{ + background-color: #f83e7040; + color: #FFF; +} +.theme--dark.v-card.sideborder.paused, +.theme--light.v-card.sideborder.paused { + background-color: #9ca3af40; + color: #FFF; +} +.theme--dark.v-card.sideborder.queued, +.theme--light.v-card.sideborder.queued{ + background-color: #2e5eaa40; + color: #FFF; +} +.theme--dark.v-card.sideborder.seeding, +.theme--light.v-card.sideborder.seeding{ + background-color: #4ecde640; + color: #FFF; +} +.theme--dark.v-card.sideborder.checking, +.theme--light.v-card.sideborder.checking{ + background-color: #ff704340; + color: #FFF; +} +.theme--dark.v-card.sideborder.stalled, +.theme--light.v-card.sideborder.stalled{ + background-color: #4ade8040; + color: #FFF; +} +.theme--dark.v-card.sideborder.metadata, +.theme--light.v-card.sideborder.metadata{ + background-color: #7e57c240; + color: #FFF; +} +.theme--dark.v-card.sideborder.moving, +.theme--light.v-card.sideborder.moving{ + background-color: #ffaa2c40; + color: #FFF; +} + + +/* DROPDOWN */ +.theme--dark.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled), +.theme--light.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled){ + color: var(--text) !important; + background: var(--modal-bg-color) !important; +} +.theme--dark.v-icon, +.theme--light.v-icon{ + color: #fff; +} +.theme--light.v-divider, +.theme--dark.v-divider{ + border-color: rgba(255, 255, 255, .65) !important; +} + +/* TABLE */ +.theme--dark.v-data-table, +.theme--light.v-data-table{ + background-color: rgba(0, 0, 0, .65); + color: var(--text); +} \ No newline at end of file diff --git a/index.html b/index.html index 7eb0c70c..c441a199 100644 --- a/index.html +++ b/index.html @@ -77,7 +77,7 @@
theme.park contains 47 themed applications, with css theme.park contains 48 themed applications, with css addons on certain themes.
Installation methods include custom docker mods @@ -308,6 +308,12 @@
Flood
+ +
+
VueTorrent
+