mirror of
https://github.com/gilbN/theme.park.git
synced 2024-11-04 10:12:31 +01:00
added petio
This commit is contained in:
gilbN
parent
b60a12b138
commit
43e0b0c58b
28
CSS/themes/petio/aquamarine.css
Normal file
28
CSS/themes/petio/aquamarine.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
/* 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 */
|
||||||
|
|
||||||
|
/* MOVIEMATCH AQUAMARINE THEME */
|
||||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/moviematch/moviematch-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;
|
||||||
|
--text-color: #eee;
|
||||||
|
--text-color-hover: #fff;
|
||||||
|
--button-color: #009688;
|
||||||
|
--button-color-hover: #12afa0;
|
||||||
|
--button-text: #eee;
|
||||||
|
--button-text-hover: #FFF;
|
||||||
|
--accent-color: #12afa0;
|
||||||
|
--accent-color-hover: #fff;
|
||||||
|
--link-color: #0ed2bf;
|
||||||
|
}
|
||||||
28
CSS/themes/petio/dark.css
Normal file
28
CSS/themes/petio/dark.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
/* 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 */
|
||||||
|
|
||||||
|
/* MOVIEMATCH DARK THEME */
|
||||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/moviematch/moviematch-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;
|
||||||
|
--text-color: #b7b7b7;
|
||||||
|
--text-color-hover: #fff;
|
||||||
|
--button-color: hsla(0,0%,100%,.15);
|
||||||
|
--button-color-hover: hsla(0,0%,100%,.30);
|
||||||
|
--button-text: #eee;
|
||||||
|
--button-text-hover: #fff;
|
||||||
|
--accent-color: #646464;
|
||||||
|
--accent-color-hover: #ffffff73;
|
||||||
|
--link-color: #fff;
|
||||||
|
}
|
||||||
28
CSS/themes/petio/hotline.css
Normal file
28
CSS/themes/petio/hotline.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
/* 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 */
|
||||||
|
|
||||||
|
/* MOVIEMATCH HOTLINE THEME */
|
||||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/moviematch/moviematch-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;
|
||||||
|
--text-color: #eee;
|
||||||
|
--text-color-hover: #fff;
|
||||||
|
--button-color: hsla(0,0%,100%,.15);
|
||||||
|
--button-color-hover: hsla(0,0%,100%,.30);
|
||||||
|
--button-text: #eee;
|
||||||
|
--button-text-hover: #fff;
|
||||||
|
--accent-color: #F44336;
|
||||||
|
--accent-color-hover: #0b3161;
|
||||||
|
--link-color: #0b3161;
|
||||||
|
}
|
||||||
28
CSS/themes/petio/organizr-dark.css
Normal file
28
CSS/themes/petio/organizr-dark.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
/* 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 */
|
||||||
|
|
||||||
|
/* MOVIEMATCH ORGANIZR-DARK THEME */
|
||||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/moviematch/moviematch-base.css);
|
||||||
|
:root {
|
||||||
|
--main-bg-color: #1f1f1f;
|
||||||
|
--modal-bg-color: #1b1b1b;
|
||||||
|
--text-color: #96a2b4;
|
||||||
|
--text-color-hover: #fff;
|
||||||
|
--button-color: #2cabe3;
|
||||||
|
--button-color-hover: rgb(44 171 227 / .8);
|
||||||
|
--button-text: #eee;
|
||||||
|
--button-text-hover: #fff;
|
||||||
|
--accent-color:#2cabe3;
|
||||||
|
--accent-color-hover: #fff;
|
||||||
|
--link-color: #2cabe3;
|
||||||
|
}
|
||||||
193
CSS/themes/petio/petio-base.css
Normal file
193
CSS/themes/petio/petio-base.css
Normal file
@ -0,0 +1,193 @@
|
|||||||
|
/* 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;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: var(--main-bg-color);
|
||||||
|
color: var(--text-color)
|
||||||
|
}
|
||||||
|
|
||||||
|
/* TEXT COLOR */
|
||||||
|
.sub-title, .widget--title,p{
|
||||||
|
color: var(--text-color);
|
||||||
|
}
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.settings--menu--item.active p {
|
||||||
|
color: var(--accent-color);
|
||||||
|
}
|
||||||
|
.settings--menu--item.active {
|
||||||
|
border-bottom: 1px solid var(--accent-color);
|
||||||
|
}
|
||||||
|
.settings--menu--item.active .icon svg path {
|
||||||
|
fill: var(--accent-color);
|
||||||
|
}
|
||||||
|
/* MENU */
|
||||||
|
/* @media (min-width: 1100px) {
|
||||||
|
.sidebar--inner {
|
||||||
|
display: block;
|
||||||
|
background: rgb(0 0 0 / 25%);
|
||||||
|
}
|
||||||
|
} */
|
||||||
|
.menu {
|
||||||
|
background: rgb(0 0 0 / 25%);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1099.98px) {
|
||||||
|
.sidebar--inner,
|
||||||
|
.sidebar--scroll {
|
||||||
|
background: var(--modal-bg-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1100px) {
|
||||||
|
.page .sidebar {
|
||||||
|
background: rgb(0 0 0 / 25%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 991.98px) {
|
||||||
|
.menu.open {
|
||||||
|
background: var(--modal-bg-color)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mob-menu-top {
|
||||||
|
background: var(--modal-bg-color);
|
||||||
|
}
|
||||||
|
.menu--item.active {
|
||||||
|
background: rgba(255, 255, 255, .15);
|
||||||
|
border-right: 4px solid var(--accent-color);
|
||||||
|
}
|
||||||
|
@media (min-width: 1100px) {
|
||||||
|
.sidebar--item.active {
|
||||||
|
border-top: none !important;
|
||||||
|
border-right: 4px solid var(--accent-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.sidebar--item.active {
|
||||||
|
background: rgba(255, 255, 255, .15);
|
||||||
|
border-top: 4px solid var(--accent-color);
|
||||||
|
}
|
||||||
|
.menu--item.active p,
|
||||||
|
.media-content .media-crew .sidebar--item.active a, .sidebar--item.active .media-content .media-crew a, .sidebar--item.active p {
|
||||||
|
color: var(--accent-color);
|
||||||
|
}
|
||||||
|
.menu--item.active .icon svg path,
|
||||||
|
.sidebar--item.active .icon svg path {
|
||||||
|
fill: var(--accent-color);
|
||||||
|
}
|
||||||
|
.mob-menu-top .nav-toggle span {
|
||||||
|
background: var(--accent-color);
|
||||||
|
}
|
||||||
|
/* LINKS */
|
||||||
|
a, .table-action,.session--toggle,p a,.profile-page .logout {
|
||||||
|
color: var(--link-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* OTHER */
|
||||||
|
.widget--item hr {
|
||||||
|
background: rgb(255 255 255 / 50%);
|
||||||
|
}
|
||||||
|
.filter--add:hover {
|
||||||
|
color: var(--accent-color);
|
||||||
|
border-color: var(--accent-color);
|
||||||
|
}
|
||||||
|
.filter--item {
|
||||||
|
background: rgb(0 0 0 / 25%);
|
||||||
|
}
|
||||||
|
/* DASH */
|
||||||
|
.session--prog, .session--media .card .playback-status {
|
||||||
|
background: var(--accent-color);
|
||||||
|
}
|
||||||
|
.card--inner:hover .image-wrap {
|
||||||
|
-webkit-filter: brightness(.7);
|
||||||
|
filter: brightness(.7);
|
||||||
|
-webkit-box-shadow: 0 0 0 2px var(--accent-color), 0 5px 10px 0 rgb(0 0 0 / 30%);
|
||||||
|
-moz-box-shadow: 0 0 0 2px var(--accent-color),0 5px 10px 0 rgba(0,0,0,.3);
|
||||||
|
box-shadow: 0 0 0 2px var(--accent-color), 0 5px 10px 0 rgb(0 0 0 / 30%);
|
||||||
|
}
|
||||||
|
.push-msg--item {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* BUTTONS */
|
||||||
|
|
||||||
|
.btn, .btn__square {
|
||||||
|
background: var(--button-color);
|
||||||
|
color: var(--button-text);
|
||||||
|
border: 2px solid var(--button-color);
|
||||||
|
}
|
||||||
|
.btn:hover, .btn__square:hover {
|
||||||
|
background: var(--button-color-hover);
|
||||||
|
color: var(--button-text-hover);
|
||||||
|
border: 2px solid var(--button-color-hover);
|
||||||
|
}
|
||||||
|
.btn.bad:hover {
|
||||||
|
border: 2px solid #e95151;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* TABLES */
|
||||||
|
.generic-table tr:not(.child):not(.sub) td {
|
||||||
|
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||||
|
}
|
||||||
|
.generic-table tr:not(.child):not(.sub) th {
|
||||||
|
text-align: left;
|
||||||
|
padding: 5px;
|
||||||
|
border-bottom: 1px solid rgba(255, 255, 255, .4);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* MODALS */
|
||||||
|
.modal--inner {
|
||||||
|
background: var(--modal-bg-color);
|
||||||
|
}
|
||||||
|
.modal--top {
|
||||||
|
background: var(--modal-bg-color);
|
||||||
|
}
|
||||||
|
/* FORMS & INPUTS */
|
||||||
|
input[type=checkbox]:checked:after {
|
||||||
|
background: var(--accent-color)
|
||||||
|
}
|
||||||
|
input:not([type=checkbox]):not(.styled-input--input):not([type=file]):focus {
|
||||||
|
border-bottom: 2px solid var(--accent-color);
|
||||||
|
background: rgba(255, 255, 255, .2);
|
||||||
|
color: var(--text-color-hover)
|
||||||
|
}
|
||||||
|
input:not([type=checkbox]):not(.styled-input--input):not([type=file]),
|
||||||
|
.login-wrap input {
|
||||||
|
border-bottom: 2px solid rgba(0,0,0,0);
|
||||||
|
color: var(--text-color);
|
||||||
|
background: rgb(255 255 255 / 10%);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* PLACEHOLDER TEXT */
|
||||||
|
::placeholder {
|
||||||
|
color: var(--text) !important;
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
|
|
||||||
|
:-moz-placeholder {
|
||||||
|
color: var(--text) !important;
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
|
|
||||||
|
:-ms-input-placeholder {
|
||||||
|
color: var(--text) !important;
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-input-placeholder {
|
||||||
|
color: var(--text) !important;
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
28
CSS/themes/petio/space-gray.css
Normal file
28
CSS/themes/petio/space-gray.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
/* 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 */
|
||||||
|
|
||||||
|
/* MOVIEMATCH SPACE GRAY THEME */
|
||||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/moviematch/moviematch-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;
|
||||||
|
--text-color: #eee;
|
||||||
|
--text-color-hover: #fff;
|
||||||
|
--button-color: #607D8B;
|
||||||
|
--button-color-hover: #81a6b7;
|
||||||
|
--button-text: #eee;
|
||||||
|
--button-text-hover: #fff;
|
||||||
|
--accent-color: #81a6b7;
|
||||||
|
--accent-color-hover: #607D8B;
|
||||||
|
--link-color: #9adfff;
|
||||||
|
}
|
||||||
@ -238,12 +238,17 @@
|
|||||||
<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/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;">
|
||||||
|
<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>
|
||||||
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## [Adding your own theme colors](https://github.com/gilbN/theme.park/wiki/Creating-your-own-themes)
|
## [Adding your own theme colors](https://github.com/gilbN/theme.park/wiki/Creating-your-own-themes)
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
BIN
Screenshots/petio/aquamarine.jpg
Normal file
BIN
Screenshots/petio/aquamarine.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 465 KiB |
BIN
Screenshots/petio/dark.jpg
Normal file
BIN
Screenshots/petio/dark.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 454 KiB |
BIN
Screenshots/petio/hotline.jpg
Normal file
BIN
Screenshots/petio/hotline.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 468 KiB |
BIN
Screenshots/petio/organizr-dark.jpg
Normal file
BIN
Screenshots/petio/organizr-dark.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 450 KiB |
BIN
Screenshots/petio/space-gray.jpg
Normal file
BIN
Screenshots/petio/space-gray.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 454 KiB |
Loading…
Reference in New Issue
Block a user