GilbN
4 years ago
committed by
GitHub
GitHub
63 changed files with 11625 additions and 0 deletions
@ -0,0 +1,35 @@ |
|||||
|
/* 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 */ |
||||
|
|
||||
|
/* SONARR MIND STONE THEME */ |
||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
|
||||
|
:root { |
||||
|
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(255, 242, 0, .7) 0%, #0d0400 80%, rgba(0, 0, 0, 1) 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/mind.jpg") center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: linear-gradient(180deg, rgba(51, 49, 0, .7) 0%, #000 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/mind.jpg") center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: rgba(255, 255, 255, .15); |
||||
|
--button-color-hover: #fff200cc; |
||||
|
--accent-color: #fff200cc; |
||||
|
--accent-color-hover: #fff200cc; |
||||
|
--queue-color: #204c80cc; |
||||
|
} |
||||
@ -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 */ |
||||
|
|
||||
|
/* SONARR THEME */ |
||||
|
@import url(https://gflix.app/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
:root { |
||||
|
--main-bg-color: linear-gradient(45deg, #fb3f62 0%, #204c80 37%, #004249 97%) center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: radial-gradient(circle, #204c80 0%, #000 100%) center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: #fb3f62; |
||||
|
--button-color-hover: rgba(251, 63, 98, .8); |
||||
|
--accent-color: rgba(251, 63, 98, .8); |
||||
|
--accent-color-hover: rgba(251, 63, 98, .8); |
||||
|
--queue-color: rgba(63, 251, 157, .8); |
||||
|
} |
||||
|
|
||||
@ -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 */ |
||||
|
|
||||
|
/* SONARR POWER STONE THEME */ |
||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
:root { |
||||
|
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(166, 40, 140, .7) 0%, rgba(11,8,51,1) 80%, rgba(0,0,0,1) 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/power.jpg") center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: linear-gradient(180deg, rgba(35, 0, 57, .7) 0%, #000 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/power.jpg") center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: #85096b; |
||||
|
--button-color-hover: #85096bcc; |
||||
|
--accent-color: #85096bcc; |
||||
|
--accent-color-hover: #85096bcc; |
||||
|
--queue-color: #204c80cc; |
||||
|
} |
||||
@ -0,0 +1,36 @@ |
|||||
|
/* 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 */ |
||||
|
|
||||
|
/* SONARR REALITY STONE THEME */ |
||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
:root { |
||||
|
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(232, 11, 11, 0.7) 0%, #08000d 80%, rgba(0,0,0,1) 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/reality.jpg") center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: linear-gradient(180deg, rgba(102, 5, 5, 0.7) 0%, #000 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/reality.jpg") center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: rgba(255, 255, 255, .15); |
||||
|
--button-color-hover: #e80c0bcc; |
||||
|
--accent-color: #e80c0bcc; |
||||
|
--accent-color-hover: #e80c0bcc; |
||||
|
--queue-color: #204c80cc; |
||||
|
} |
||||
|
|
||||
|
|
||||
@ -0,0 +1,35 @@ |
|||||
|
/* 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 */ |
||||
|
|
||||
|
/* SONARR SOUL STONE THEME */ |
||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
|
||||
|
:root { |
||||
|
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(255, 153, 0, .7) 0%, #3c0015 80%, rgba(0, 0, 0, 1) 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/soul.jpg") center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: linear-gradient(180deg, rgba(140, 64, 2, .8) 0%, #3c0015 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/soul.jpg") center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: rgba(255, 255, 255, .15); |
||||
|
--button-color-hover: #f90c; |
||||
|
--accent-color: #f90c; |
||||
|
--accent-color-hover: #f90c; |
||||
|
--queue-color: #204c80cc; |
||||
|
} |
||||
@ -0,0 +1,35 @@ |
|||||
|
/* 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 */ |
||||
|
|
||||
|
/* SONARR SPACE STONE THEME */ |
||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
|
||||
|
:root { |
||||
|
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(0, 98, 255, .7) 0%, #020013 80%, rgb(0, 0, 0) 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/space.jpg") center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: linear-gradient(180deg, rgba(0, 98, 255, .7) 0%, #10003c 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/space.jpg") center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: rgba(255, 255, 255, .15); |
||||
|
--button-color-hover: #0062ffcc; |
||||
|
--accent-color: #0062ffcc; |
||||
|
--accent-color-hover: #0062ffcc; |
||||
|
--queue-color: #0062ffcc; |
||||
|
} |
||||
@ -0,0 +1,35 @@ |
|||||
|
/* 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 */ |
||||
|
|
||||
|
/* SONARR TIME STONE THEME */ |
||||
|
@import url(https://gilbn.github.io/theme.park/CSS/themes/sonarr/sonarr-base.css); |
||||
|
|
||||
|
:root { |
||||
|
--main-bg-color: radial-gradient(ellipse at center bottom, rgba(109, 247, 81, .7) 0%, #00130c 80%, rgb(0, 0, 0) 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/time.jpg") center center/cover no-repeat fixed; |
||||
|
--modal-bg-color: linear-gradient(180deg, rgba(2, 77, 0, .8) 0%, #00130c 100%) center center/cover no-repeat fixed, |
||||
|
url("https://themepark-develop.netlify.app/Resources/time.jpg") center center/cover no-repeat fixed; |
||||
|
|
||||
|
--calendar-tv-Unaired-Premiere: 53 197 244; |
||||
|
--calendar-tv-Downloading: 122 67 182; |
||||
|
--calendar-tv-Unmonitored: 173 173 173; |
||||
|
--calendar-tv-Unaired: 93 156 236; |
||||
|
--calendar-tv-missing: 240 80 80; |
||||
|
--calendar-tv-On-Air: 255 165 0; |
||||
|
--calendar-tv-available: 39 194 76; |
||||
|
|
||||
|
--button-color: rgba(255, 255, 255, .15); |
||||
|
--button-color-hover: rgba(4, 168, 0, .8); |
||||
|
--accent-color: #6df751cc; |
||||
|
--accent-color-hover: #6df751cc; |
||||
|
--queue-color: #6df751cc; |
||||
|
} |
||||
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 1.3 MiB |
|
After Width: | Height: | Size: 53 KiB |
|
After Width: | Height: | Size: 2.4 MiB |
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 841 KiB |
|
After Width: | Height: | Size: 51 KiB |
|
After Width: | Height: | Size: 3.0 MiB |
|
After Width: | Height: | Size: 62 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 48 KiB |
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 62 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 48 KiB |
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 449 KiB |
|
After Width: | Height: | Size: 107 KiB |
|
After Width: | Height: | Size: 252 KiB |
|
After Width: | Height: | Size: 316 KiB |
|
After Width: | Height: | Size: 250 KiB |
|
After Width: | Height: | Size: 390 KiB |
|
After Width: | Height: | Size: 454 KiB |
|
After Width: | Height: | Size: 365 KiB |
|
After Width: | Height: | Size: 287 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 3.0 MiB |
|
After Width: | Height: | Size: 58 KiB |
@ -0,0 +1,256 @@ |
|||||
|
@media (min-width: 992px) { |
||||
|
#mainNav { |
||||
|
box-shadow: none; |
||||
|
background-color: rgba(0, 0, 0, 0.55); |
||||
|
backdrop-filter: blur(10px); |
||||
|
} |
||||
|
|
||||
|
#mainNav .navbar-brand { |
||||
|
color: rgba(255, 255, 255, 0.7); |
||||
|
} |
||||
|
|
||||
|
#mainNav .navbar-brand:hover { |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
#mainNav .navbar-nav .nav-item .nav-link { |
||||
|
color: rgba(255, 255, 255, 0.7); |
||||
|
padding: 0 1rem; |
||||
|
} |
||||
|
|
||||
|
#mainNav .navbar-nav .nav-item .nav-link:hover { |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
#mainNav .navbar-nav .nav-item:last-child .nav-link { |
||||
|
padding-right: 0; |
||||
|
} |
||||
|
|
||||
|
#mainNav.navbar-scrolled { |
||||
|
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); |
||||
|
background-color: rgba(0, 0, 0, 0.55); |
||||
|
backdrop-filter: blur(10px); |
||||
|
} |
||||
|
|
||||
|
#mainNav.navbar-scrolled .navbar-brand { |
||||
|
color: #212529; |
||||
|
} |
||||
|
|
||||
|
#mainNav.navbar-scrolled .navbar-brand:hover { |
||||
|
color: #12afa0; |
||||
|
} |
||||
|
|
||||
|
#mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link { |
||||
|
color: #fff; |
||||
|
; |
||||
|
} |
||||
|
|
||||
|
#mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link:hover { |
||||
|
color: #12afa0; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
#mainNav { |
||||
|
box-shadow: none; |
||||
|
background-color: rgba(0, 0, 0, 0.55); |
||||
|
backdrop-filter: blur(10px); |
||||
|
} |
||||
|
|
||||
|
.navbar-light .navbar-toggler-icon { |
||||
|
filter: invert(1); |
||||
|
} |
||||
|
|
||||
|
.mfp-container { |
||||
|
backdrop-filter: blur(10px); |
||||
|
} |
||||
|
|
||||
|
/* BUTTON SHIT*/ |
||||
|
.btn-primary { |
||||
|
color: #fff; |
||||
|
background-color: #009688; |
||||
|
border-color: #009688; |
||||
|
} |
||||
|
|
||||
|
.btn-primary:hover { |
||||
|
color: #fff; |
||||
|
background-color: #12afa0; |
||||
|
border-color: #12afa0; |
||||
|
} |
||||
|
|
||||
|
.btn-primary:focus, |
||||
|
.btn-primary.focus { |
||||
|
color: #fff; |
||||
|
background-color: #12afa0; |
||||
|
border-color: #12afa0; |
||||
|
box-shadow: 0 0 0 0.2rem #12afa080; |
||||
|
} |
||||
|
|
||||
|
.btn-primary.disabled, |
||||
|
.btn-primary:disabled { |
||||
|
color: #fff; |
||||
|
background-color: #009688; |
||||
|
border-color: #009688; |
||||
|
} |
||||
|
|
||||
|
.btn-primary:not(:disabled):not(.disabled):active, |
||||
|
.btn-primary:not(:disabled):not(.disabled).active, |
||||
|
.show>.btn-primary.dropdown-toggle { |
||||
|
color: #fff; |
||||
|
background-color: #12afa0; |
||||
|
border-color: #12afa0; |
||||
|
} |
||||
|
|
||||
|
.btn-primary:not(:disabled):not(.disabled):active:focus, |
||||
|
.btn-primary:not(:disabled):not(.disabled).active:focus, |
||||
|
.show>.btn-primary.dropdown-toggle:focus { |
||||
|
box-shadow: 0 0 0 0.2rem #12afa080; |
||||
|
} |
||||
|
|
||||
|
hr.divider { |
||||
|
border-color: #12afa0 |
||||
|
} |
||||
|
|
||||
|
a { |
||||
|
color: #fff; |
||||
|
} |
||||
|
a:hover { |
||||
|
color: #12afa0; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
.text-primary { |
||||
|
color: #12afa0 !important; |
||||
|
} |
||||
|
body,html { |
||||
|
background: transparent; |
||||
|
} |
||||
|
/* IMAGE SLIDER */ |
||||
|
.jquery-bg-slideshow-wrap-bg-element { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
background-color: transparent; |
||||
|
} |
||||
|
|
||||
|
.bg { |
||||
|
height: 100%; |
||||
|
width: 100%; |
||||
|
background-color: black; |
||||
|
color: white; |
||||
|
font-size: 30pt; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
display: flex; |
||||
|
text-align: center; |
||||
|
text-shadow: 1px 1px 10px black; |
||||
|
margin: 0; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption, |
||||
|
#portfolio .container-sm .portfolio-box .portfolio-box-caption, |
||||
|
#portfolio .container-md .portfolio-box .portfolio-box-caption, |
||||
|
#portfolio .container-lg .portfolio-box .portfolio-box-caption, |
||||
|
#portfolio .container-xl .portfolio-box .portfolio-box-caption { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
flex-direction: column; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
position: absolute; |
||||
|
bottom: 0; |
||||
|
text-align: center; |
||||
|
opacity: 0; |
||||
|
color: #fff; |
||||
|
background: transparent; |
||||
|
transition: opacity 0.25s ease; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.bg-primary, |
||||
|
.bg-dark { |
||||
|
background: #2d2d2d; |
||||
|
/* fallback for old browsers */ |
||||
|
background: -webkit-linear-gradient(to top, #2d2d2d, #000000); |
||||
|
/* Chrome 10-25, Safari 5.1-6 */ |
||||
|
background: linear-gradient(to top, #2d2d2d, #000000); |
||||
|
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ |
||||
|
|
||||
|
} |
||||
|
.theme-overview { |
||||
|
background: #2d2d2d; |
||||
|
/* fallback for old browsers */ |
||||
|
background: -webkit-linear-gradient(to bottom, #2d2d2d, #000000); |
||||
|
/* Chrome 10-25, Safari 5.1-6 */ |
||||
|
background: linear-gradient(to bottom, #2d2d2d, #000000); |
||||
|
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ |
||||
|
font-family: var(--font-family-sans-serif); |
||||
|
} |
||||
|
#services { |
||||
|
background: #2d2d2d; |
||||
|
color: white; |
||||
|
padding: 0rem 0 8rem 0; |
||||
|
} |
||||
|
|
||||
|
.app-container { |
||||
|
background: rgba(0, 0, 0, 0.2); |
||||
|
color:rgba(255, 255, 255, 0.7); |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
.app-container:hover { |
||||
|
color: white; |
||||
|
text-decoration: none; |
||||
|
background: #47918a80; |
||||
|
} |
||||
|
.app-container:hover img { |
||||
|
transform: scale(1.1); |
||||
|
} |
||||
|
.app-container img { |
||||
|
transition: transform .5s; |
||||
|
} |
||||
|
|
||||
|
.app-container-image { |
||||
|
width: 48px; |
||||
|
height: 48px; |
||||
|
} |
||||
|
|
||||
|
p { |
||||
|
margin-bottom: 0.5rem; |
||||
|
font-family: "Merriweather Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
||||
|
font-weight: 500; |
||||
|
line-height: 1.2; |
||||
|
} |
||||
|
.portfolio-box img { |
||||
|
object-fit: cover; |
||||
|
width: 562.4px; |
||||
|
height: 295.56px; |
||||
|
} |
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.aquamarine-hover:hover { |
||||
|
background: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed; |
||||
|
opacity: .9; |
||||
|
} |
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.hotline-hover:hover { |
||||
|
background: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed; |
||||
|
opacity: .9; |
||||
|
} |
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.space-gray-hover:hover { |
||||
|
background: radial-gradient(ellipse at center, rgba(87, 108, 117, 1) 0%, rgba(37, 50, 55, 1) 100.2%) center center/cover no-repeat fixed; |
||||
|
opacity: .9; |
||||
|
} |
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.organizr-dark-hover:hover { |
||||
|
background: #1f1f1f; |
||||
|
opacity: .9; |
||||
|
} |
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.dark-hover:hover { |
||||
|
background: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed; |
||||
|
opacity: .9; |
||||
|
} |
||||
|
|
||||
|
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.plex-hover:hover { |
||||
|
background: 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; |
||||
|
opacity: .9; |
||||
|
} |
||||
@ -0,0 +1 @@ |
|||||
|
.jquery-bg-slideshow-wrap-bg-element{position:relative}.jquery-bg-slideshow-list-control-element{position:absolute;text-align:center;bottom:0;width:100%}.jquery-bg-slideshow-list-control-image-element{display:inline-block;border-radius:5pt;height:5pt;width:5pt;margin-right:5px;background:#000;border:2px #fff;box-shadow:1px 1px 10px 1px #fff;cursor:pointer}.jquery-bg-slideshow-list-control-image-active-element{background-color:red;height:10px;width:10px;border-radius:10px;transition:background-color .5s ease}.jquery-bg-slideshow-cloned{z-index:-100;display:none} |
||||
@ -0,0 +1,60 @@ |
|||||
|
/* |
||||
|
* This is the class for the wrapper around the element that |
||||
|
* will have the slidshow background. |
||||
|
*/ |
||||
|
.jquery-bg-slideshow-wrap-bg-element { |
||||
|
position: relative; |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
* This class is for the div that holds all of the small 'ball' |
||||
|
* that can be used to traverse the images in the list control. |
||||
|
*/ |
||||
|
.jquery-bg-slideshow-list-control-element { |
||||
|
position: absolute; |
||||
|
text-align: center; |
||||
|
bottom: 0; |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
* This is the class that defines the small 'ball' on the bottom |
||||
|
* of the image for the user to click to view different images. |
||||
|
* This is used if the user has the 'listControls.enabled=true'. |
||||
|
* NOTE: listControls.size, listControls.backgroundColor, |
||||
|
* listControls.borderSize, listControls.spaceBetween, |
||||
|
* and listControls.borderColor will impact this class. |
||||
|
*/ |
||||
|
.jquery-bg-slideshow-list-control-image-element { |
||||
|
display: inline-block; |
||||
|
border-radius: 5pt; |
||||
|
height: 5pt; |
||||
|
width: 5pt; |
||||
|
margin-right: 5px; |
||||
|
background: rgb(0, 0, 0); |
||||
|
border: 2px rgb(255, 255, 255); |
||||
|
box-shadow: 1px 1px 10px 1px white; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
* This is the class that highlights which image is being displayed |
||||
|
* within the list control. That is, the small 'ball' on the bottom |
||||
|
* of the page. |
||||
|
*/ |
||||
|
.jquery-bg-slideshow-list-control-image-active-element { |
||||
|
background-color: red; |
||||
|
height: 10px; |
||||
|
width: 10px; |
||||
|
border-radius: 10px; |
||||
|
transition: background-color 0.5s ease; |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
* This is the class used to store the cloned element. This |
||||
|
* will be in the background as the other one fades out. |
||||
|
*/ |
||||
|
.jquery-bg-slideshow-cloned { |
||||
|
z-index: -100; |
||||
|
display: none; |
||||
|
} |
||||
File diff suppressed because it is too large
@ -0,0 +1,7 @@ |
|||||
|
/** |
||||
|
* Author : Sunil Samuel (web_github@sunilsamuel.com) |
||||
|
* License : GPLv3 |
||||
|
* GIT URL : https://github.com/sunil-samuel/jquery-responsive-background-slideshow
|
||||
|
* Version: 1.5 |
||||
|
*/ |
||||
|
!function(e){e.fn.bgSlideShow=function(n){var t=new Array,a=e.extend({current:-1,images:[],transitionDelay:5e3,transitionSpeed:3e3,transitionEffect:"fade-in",randomize:!1,initialBackground:null,debug:!1,eventHandlers:{beforeInit:null,afterInit:null,beforeChange:null,afterChange:null},slideControls:{enabled:!0,classes:null}},n);return this.each(function(n,t){var i=function(n,t){var i={};i.uniqueId=(a=n,s=e(a).attr("id"),s||(s="ABCDEFGHIJKLMNOPQRSTUVWXYZ".charAt(Math.floor(Math.random()*"ABCDEFGHIJKLMNOPQRSTUVWXYZ".length))+Date.now()),s),i.current=e(n).data("current")||t.current||0,i.images=t.images,i.slideControls=t.slideControls,i.slideControls.enabled=e(n).data("slidecontrols.enabled")||t.slideControls.enabled,i.slideControls.classes=e(n).data("slidecontrols.classes")||t.slideControls.classes,e(n).data("images")&&(i.images=e(n).data("images").split(",").map(e=>e.trim()));var a,s;return i.initialBackground=e(n).data("initialbackground")||t.initialBackground,i.transitionDelay=e(n).data("transitiondelay")||t.transitionDelay,i.transitionSpeed=e(n).data("transitionspeed")||t.transitionSpeed,i.transitionEffect=e(n).data("transitioneffect")||t.transitionEffect,i.randomize=r(e(n).data("randomize"),t.randomize),i.debug=r(e(n).data("debug"),t.debug),i.eventHandlers=t.eventHandlers,i.defaultDisplay=e(n).css("display")||"block",i}(this,a);i.eventHandlers.beforeInit&&i.eventHandlers.beforeInit(this,i),function(n,t){s(t.debug,"ProcessShow with element ["+n+"]"),e(n).data("bgSlideShowApplied",!0),function(n,t){if(!t.initialBackground)return;s(t.debug,"Setting initial image");var i=t.initialBackground,a="";if(!isNaN(i)&&i<t.images.length)a=t.images[i],t.current=i+1;else if("random"==i.toLowerCase()){var r=t.randomize;t.randomize=!0,a=l(t),t.randomize=r}else a=t.initialBackground;e(n).css("background-image","url("+a+")")}(n,t),u(t.images),t.wrapBgElement=e("<div/>",{class:"jquery-bg-slideshow-wrap-bg-element",id:t.uniqueId+"-wrap-widget"}),e(n).wrap(t.wrapBgElement);var i=e(n).css("position","absolute");(function(n,t,i){if(s(i.debug,"List controls enabled: "+i.slideControls.enabled),1==i.slideControls.enabled){i.slideControlsElement=e("<div/>",{class:"jquery-bg-slideshow-list-control-element"+(i.slideControls.classes?" "+i.slideControls.classes:"")});for(var a=i.images.length,r=0;r<a;r++){var l=i.uniqueId+"-image"+r;e("<div/>",{class:"jquery-bg-slideshow-list-control-image-element",id:l}).appendTo(i.slideControlsElement)}e(t).append(i.slideControlsElement),e("[id^='"+i.uniqueId+"-image']").off("click").on("click",function(){e(i.cloned).remove();var t=e(this).attr("id"),a=parseInt(t.match(/-image(\d+)/)[1]);i.current=a+1,e(n).css("background-image","url("+i.images[a]+")"),d(i,i.current-1),console.log("clicked on ["+e(this).attr("id")+"]")})}})(n,i.parent(),t),s(t.debug,"Setting timeout for element ["+n+"]"),d(t,t.current),t.timerId=setTimeout(o,t.transitionDelay,n,t)}(this,i),i.eventHandlers.afterInit&&i.eventHandlers.afterInit(this,i),s(i.debug,"Done processing element ["+t+"] number ["+n+"]")});function r(e,n){return void 0===e?n:"boolean"==typeof e?e:(e=e.trim().toLowerCase()).startsWith("t")||e.startsWith("y")||1==e}function s(e,n){e&&console.log(n)}function l(e){if(e.randomize){for(var n=e.current;n==e.current;)n=Math.floor(Math.random()*e.images.length);return e.current=n,e.images[n]}e.current>=e.images.length&&(e.current=0);var t=e.images[e.current];return e.current=e.current+1,t}function o(n,t){s(t.debug,"Calling timer for element ["+n+"]"),function(n,t,i){t.eventHandlers.beforeChange&&t.eventHandlers.beforeChange(n,t,i);e(t.cloned).length&&e(t.cloned).remove();t.cloned=e(n).clone(),e(t.cloned).addClass("jquery-bg-slideshow-cloned").css({"background-image":"url("+i+")"}).insertAfter(e(n)),e(t.cloned).css("display",t.defaultDisplay),s(t.debug,"Before element fadeout"),e(n).stop().fadeOut(t.transitionSpeed,function(){s(t.debug,"Fading out is done - should remove cloned element"),e(this).css({"background-image":"url("+i+")",position:"absolute",display:t.defaultDisplay}),t.eventHandlers.afterChange&&t.eventHandlers.afterChange(n,t,i),d(t,t.current),t.timerId=setTimeout(o,t.transitionDelay,n,t)})}(n,t,l(t))}function d(n,t){if(n.slideControls.enabled){var i="#"+n.uniqueId+"-image"+t;e("[id^='"+n.uniqueId+"-image']").removeClass("jquery-bg-slideshow-list-control-image-active-element"),e(i).addClass("jquery-bg-slideshow-list-control-image-active-element")}}function u(e){for(i=0;i<e.length;i++){var n=u.length;t[n]=new Image,t[n].src=e[i]}}},e.fn.bgSlideshowApplied=function(){return 1==e(this).data("bgSlideShowApplied")}}(jQuery); |
||||
@ -0,0 +1,383 @@ |
|||||
|
/** |
||||
|
* Author : Sunil Samuel (web_github@sunilsamuel.com) |
||||
|
* License : GPLv3 |
||||
|
* GIT URL : https://github.com/sunil-samuel/jquery-responsive-background-slideshow
|
||||
|
* Version: 1.5 |
||||
|
* ______ _ |
||||
|
* | ___ \ (_) |
||||
|
* | |_/ /___ ___ _ __ ___ _ __ ___ ___ _____ |
||||
|
* | // _ \/ __| '_ \ / _ \| '_ \/ __| \ \ / / _ \
|
||||
|
* | |\ \ __/\__ \ |_) | (_) | | | \__ \ |\ V / __/ |
||||
|
* \_| \_\___||___/ .__/ \___/|_| |_|___/_| \_/ \___| |
||||
|
* | | |
||||
|
* |_| |
||||
|
* ______ _ _ |
||||
|
* | ___ \ | | | | |
||||
|
* | |_/ / __ _ ___| | ____ _ _ __ ___ _ _ _ __ __| | |
||||
|
* | ___ \/ _` |/ __| |/ / _` | '__/ _ \| | | | '_ \ / _` |
|
||||
|
* | |_/ / (_| | (__| < (_| | | | (_) | |_| | | | | (_| | |
||||
|
* \____/ \__,_|\___|_|\_\__, |_| \___/ \__,_|_| |_|\__,_| |
||||
|
* __/ | |
||||
|
* |___/ |
||||
|
* _____ _ _ _ _ |
||||
|
* / ___| (_) | | | | |
||||
|
* \ `--.| |_ __| | ___ ___| |__ _____ __
|
||||
|
* `--. \ | |/ _` |/ _ \/ __| '_ \ / _ \ \ /\ / / |
||||
|
* /\__/ / | | (_| | __/\__ \ | | | (_) \ V V / |
||||
|
* \____/|_|_|\__,_|\___||___/_| |_|\___/ \_/\_/ |
||||
|
* |
||||
|
* This is a responsive JQuery pluging that creates a background slideshow |
||||
|
* using JQuery animations. |
||||
|
|
||||
|
* |
||||
|
*/ |
||||
|
(function($) { |
||||
|
$.fn.bgSlideShow = function(options) { |
||||
|
var preloadedImages = new Array(); |
||||
|
|
||||
|
var defaultOptions = $.extend({ |
||||
|
// Start with element 0 as default. Always 0 based.
|
||||
|
current: -1, |
||||
|
// The list of images
|
||||
|
images: [], |
||||
|
// Time in ms between the transition from one image to another
|
||||
|
transitionDelay: 5000, |
||||
|
// The speed of the transition effect
|
||||
|
transitionSpeed: 3000, |
||||
|
// The effect to use when transitioning (fade-in, from-right, from-left)
|
||||
|
transitionEffect: 'fade-in', |
||||
|
// Adds a gradient over the images.
|
||||
|
gradient: null, |
||||
|
// Randomize the start element
|
||||
|
randomize: false, |
||||
|
// If the initial image should also be rendered by this plugin
|
||||
|
// if null - then do not do anything for the first image
|
||||
|
// if a number or 'random' or an image url - then use the appropriate image
|
||||
|
initialBackground: null, |
||||
|
// Print console.log debug messages for debug purposes
|
||||
|
debug: false, |
||||
|
// Event handlers for different events
|
||||
|
eventHandlers: { |
||||
|
// Event before initialization
|
||||
|
beforeInit: null, |
||||
|
// Event after initialization
|
||||
|
afterInit: null, |
||||
|
// Event before the existing image is replaced
|
||||
|
beforeChange: null, |
||||
|
// Event after the existing image is replaced
|
||||
|
afterChange: null |
||||
|
}, |
||||
|
// Controls the list control icons. The small ball on the bottom
|
||||
|
// of the image for the user to go to a specific image.
|
||||
|
slideControls: { |
||||
|
enabled: true, |
||||
|
classes: null |
||||
|
} |
||||
|
}, options); |
||||
|
|
||||
|
// Process each element defined by the caller
|
||||
|
return this.each(function(i, el) { |
||||
|
// Overwrite settings with data- attributes for each
|
||||
|
// element that we are processing.
|
||||
|
var elmtSettings = getSettings(this, defaultOptions); |
||||
|
// Call the before init event handler
|
||||
|
if (elmtSettings.eventHandlers.beforeInit) { |
||||
|
elmtSettings.eventHandlers.beforeInit(this, elmtSettings); |
||||
|
} |
||||
|
processElement(this, elmtSettings) |
||||
|
// Call the after init event handler
|
||||
|
if (elmtSettings.eventHandlers.afterInit) { |
||||
|
elmtSettings.eventHandlers.afterInit(this, elmtSettings); |
||||
|
} |
||||
|
debug(elmtSettings.debug, "Done processing element [" + el + "] number [" + i + "]"); |
||||
|
}); |
||||
|
|
||||
|
/** |
||||
|
* Returns boolean true or false based on the string. If the string is |
||||
|
* 'true', 1, yes -> true |
||||
|
* otherwise -> false |
||||
|
*/ |
||||
|
function getBoolean(str, defaultValue) { |
||||
|
if (str === undefined) { |
||||
|
return defaultValue; |
||||
|
} |
||||
|
if (typeof str === "boolean") { |
||||
|
return str; |
||||
|
} |
||||
|
str = str.trim().toLowerCase(); |
||||
|
return str.startsWith("t") || str.startsWith("y") || str == 1; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Uses the default options, options from calling the plugin, and any |
||||
|
* data- attributes on the element to create the settings. The |
||||
|
* data- elements will have the most preference. |
||||
|
*/ |
||||
|
function getSettings(elmt, s) { |
||||
|
var thisSetting = {}; |
||||
|
thisSetting.uniqueId = getUniqueId(elmt); |
||||
|
thisSetting.current = $(elmt).data("current") || s.current || 0; |
||||
|
thisSetting.images = s.images; |
||||
|
thisSetting.slideControls = s.slideControls; |
||||
|
// List controls
|
||||
|
thisSetting.slideControls.enabled = getBoolean($(elmt).data("slidecontrols.enabled"),s.slideControls.enabled); |
||||
|
thisSetting.slideControls.classes = $(elmt).data("slidecontrols.classes") || s.slideControls.classes; |
||||
|
// thisSetting.slideControls.size = $(elmt).data("slideControls.size") || s.slideControls.size;
|
||||
|
// thisSetting.slideControls.spaceBetween = $(elmt).data("slideControls.spacebetween") || s.slideControls.spaceBetween;
|
||||
|
// thisSetting.slideControls.backgroundColor = $(elmt).data("slideControls.backgroundcolor") || s.slideControls.backgroundColor;
|
||||
|
// thisSetting.slideControls.borderColor = $(elmt).data("slideControls.bordercolor") || s.slideControls.borderColor;
|
||||
|
// thisSetting.slideControls.borderSize = $(elmt).data("slideControls.bordersize") || s.slideControls.borderSize;
|
||||
|
|
||||
|
// Images are comma separated, so we need to split that into arrays
|
||||
|
if ($(elmt).data("images")) { |
||||
|
thisSetting.images = $(elmt).data("images").split(",").map(item => item.trim()); |
||||
|
} |
||||
|
thisSetting.initialBackground = $(elmt).data("initialbackground") || s.initialBackground; |
||||
|
thisSetting.transitionDelay = $(elmt).data("transitiondelay") || s.transitionDelay; |
||||
|
thisSetting.gradient = $(elmt).data("gradient") || s.gradient; |
||||
|
thisSetting.transitionSpeed = $(elmt).data("transitionspeed") || s.transitionSpeed; |
||||
|
thisSetting.transitionEffect = $(elmt).data("transitioneffect") || s.transitionEffect; |
||||
|
thisSetting.randomize = getBoolean($(elmt).data("randomize"), s.randomize); |
||||
|
thisSetting.debug = getBoolean($(elmt).data("debug"), s.debug); |
||||
|
thisSetting.eventHandlers = s.eventHandlers; |
||||
|
// If the element already has a 'display', css tag, then lets keep that instead
|
||||
|
// of going to block.
|
||||
|
thisSetting.defaultDisplay = $(elmt).css("display") || "block"; |
||||
|
|
||||
|
return thisSetting; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Print log messages only if debug is turned on by the caller. |
||||
|
*/ |
||||
|
function debug(v, str) { |
||||
|
v && console.log(str); |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Based on the options selected by the caller, find the next image and |
||||
|
* return the image |
||||
|
*/ |
||||
|
function getNextImage(settings) { |
||||
|
/**If the user wanted to randomize, then just pick any from the list of images |
||||
|
making sure it is not the current one */ |
||||
|
if (settings.randomize) { |
||||
|
var rand = settings.current; |
||||
|
while (rand == settings.current) { |
||||
|
rand = Math.floor(Math.random() * settings.images.length); |
||||
|
} |
||||
|
settings.current = rand; |
||||
|
return settings.images[rand]; |
||||
|
} |
||||
|
/** If not randomize, then get the next image in the list or recyle */ |
||||
|
if (settings.current >= settings.images.length) { |
||||
|
settings.current = 0; |
||||
|
} |
||||
|
var rval = settings.images[settings.current]; |
||||
|
settings.current = settings.current + 1; |
||||
|
return rval; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Process each element that was selected by the caller. The |
||||
|
* timer is set to load the images. |
||||
|
*/ |
||||
|
function processElement(element, settings) { |
||||
|
debug(settings.debug, "ProcessShow with element [" + element + "]"); |
||||
|
|
||||
|
$(element).data("bgSlideShowApplied", true); |
||||
|
// Check if we need to set the initial image
|
||||
|
setInitialImage(element, settings); |
||||
|
// Preload all of the images
|
||||
|
// FIXME - Do in another thread
|
||||
|
preloadImages(settings.images); |
||||
|
// Wrap an element around this element with certain
|
||||
|
// css attributes.
|
||||
|
settings.wrapBgElement = $('<div/>', { |
||||
|
class: 'jquery-bg-slideshow-wrap-bg-element', |
||||
|
id: settings.uniqueId + "-wrap-widget" |
||||
|
}); |
||||
|
$(element).wrap(settings.wrapBgElement); |
||||
|
var wrappedElement = $(element).css("position", "absolute"); |
||||
|
createImageSlideControls(element, wrappedElement.parent(), settings); |
||||
|
debug(settings.debug, "Setting timeout for element [" + element + "]"); |
||||
|
updateCurrentSlideElement(settings, settings.current); |
||||
|
settings.timerId = setTimeout(timeoutEvent, settings.transitionDelay, element, settings); |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Create a list of small 'ball' images on the bottom of the image for the user |
||||
|
* to click to view diffferent images. |
||||
|
*/ |
||||
|
function createImageSlideControls(element, wrappedElement, settings) { |
||||
|
debug(settings.debug, "List controls enabled: " + settings.slideControls.enabled); |
||||
|
if (settings.slideControls.enabled == true) { |
||||
|
settings.slideControlsElement = $('<div/>', { |
||||
|
class: "jquery-bg-slideshow-list-control-element" + |
||||
|
(settings.slideControls.classes ? " " + settings.slideControls.classes : ""), |
||||
|
}); |
||||
|
|
||||
|
var ilen = settings.images.length; |
||||
|
for (var i = 0; i < ilen; i++) { |
||||
|
var id = settings.uniqueId + "-image" + i; |
||||
|
$("<div/>", { |
||||
|
class: "jquery-bg-slideshow-list-control-image-element", |
||||
|
id: id |
||||
|
}).appendTo(settings.slideControlsElement); |
||||
|
} |
||||
|
$(wrappedElement).append(settings.slideControlsElement); |
||||
|
$("[id^='" + settings.uniqueId + "-image']").off("click").on("click", function() { |
||||
|
$(settings.cloned).remove(); |
||||
|
// Id will give us image number
|
||||
|
var id = $(this).attr("id"); |
||||
|
var imageOffset = parseInt(id.match(/-image(\d+)/)[1]); |
||||
|
settings.current = imageOffset + 1; |
||||
|
$(element).css("background-image", "url(" + settings.images[imageOffset] + ")"); |
||||
|
updateCurrentSlideElement(settings, settings.current - 1); |
||||
|
console.log("clicked on [" + $(this).attr("id") + "]"); |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Given an element, if it has a id attribute, then return it otherwise create a unique |
||||
|
* id and return it. |
||||
|
*/ |
||||
|
function getUniqueId(element) { |
||||
|
var id = $(element).attr("id"); |
||||
|
if (!id) { |
||||
|
id = generateUniqueId(); |
||||
|
} |
||||
|
return id; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Generate a unique id based on random character and current date in ms. |
||||
|
*/ |
||||
|
function generateUniqueId() { |
||||
|
var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; |
||||
|
var rval = characters.charAt(Math.floor(Math.random() * characters.length)) + Date.now(); |
||||
|
return rval; |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Check to see if the initial background should be set by this code. |
||||
|
*/ |
||||
|
function setInitialImage(element, settings) { |
||||
|
if (!settings.initialBackground) { |
||||
|
return; |
||||
|
} |
||||
|
debug(settings.debug, "Setting initial image"); |
||||
|
var initialImage = settings.initialBackground; |
||||
|
var image = ""; |
||||
|
// If this is a number then use the number
|
||||
|
if (!isNaN(initialImage) && initialImage < settings.images.length) { |
||||
|
image = settings.images[initialImage]; |
||||
|
settings.current = initialImage + 1; |
||||
|
} else if (initialImage.toLowerCase() == "random") { |
||||
|
var originalRandom = settings.randomize; |
||||
|
settings.randomize = true; |
||||
|
image = getNextImage(settings); |
||||
|
settings.randomize = originalRandom; |
||||
|
} else { |
||||
|
image = settings.initialBackground; |
||||
|
} |
||||
|
if(settings.gradient) { |
||||
|
$(element).css("background-image", settings.gradient + ", url(" + image + ")"); |
||||
|
}else { |
||||
|
$(element).css("background-image", "url(" + image + ")"); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* The timeout event is called based on the transition time set by |
||||
|
* the caller. This will continually call itself once the background |
||||
|
* image is set on the element. |
||||
|
*/ |
||||
|
function timeoutEvent(element, settings) { |
||||
|
debug(settings.debug, "Calling timer for element [" + element + "]"); |
||||
|
var nextImage = getNextImage(settings); |
||||
|
|
||||
|
slideBackgroundImage(element, settings, nextImage); |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Slide the background now given the next image. |
||||
|
*/ |
||||
|
function slideBackgroundImage(element, settings, nextImage) { |
||||
|
if (settings.eventHandlers.beforeChange) { |
||||
|
settings.eventHandlers.beforeChange(element, settings, nextImage); |
||||
|
} |
||||
|
if ($(settings.cloned).length) { |
||||
|
$(settings.cloned).remove(); |
||||
|
} |
||||
|
settings.cloned = $(element).clone(); |
||||
|
if(settings.gradient) { |
||||
|
$(settings.cloned).addClass("jquery-bg-slideshow-cloned").css({ |
||||
|
"background-image": settings.gradient+", url(" + nextImage + ")" |
||||
|
}).insertAfter($(element)); |
||||
|
} else { |
||||
|
$(settings.cloned).addClass("jquery-bg-slideshow-cloned").css({ |
||||
|
"background-image": "url(" + nextImage + ")" |
||||
|
}).insertAfter($(element)); |
||||
|
} |
||||
|
$(settings.cloned).addClass("jquery-bg-slideshow-cloned").css({ |
||||
|
"background-image": settings.gradient+", url(" + nextImage + ")" |
||||
|
}).insertAfter($(element)); |
||||
|
$(settings.cloned).css("display", settings.defaultDisplay); |
||||
|
debug(settings.debug, "Before element fadeout"); |
||||
|
$(element).stop().fadeOut(settings.transitionSpeed, function() { |
||||
|
debug(settings.debug, "Fading out is done - should remove cloned element"); |
||||
|
if(settings.gradient) { |
||||
|
$(this).css({ |
||||
|
"background-image": settings.gradient+", url(" + nextImage + ")", |
||||
|
"position": "absolute", |
||||
|
"display": settings.defaultDisplay |
||||
|
}); |
||||
|
} else { |
||||
|
$(this).css({ |
||||
|
"background-image": "url(" + nextImage + ")", |
||||
|
"position": "absolute", |
||||
|
"display": settings.defaultDisplay |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
//var removed = $(settings.cloned).remove();
|
||||
|
//debug(settings.debug, "Total removed [" + removed.length + "]");
|
||||
|
if (settings.eventHandlers.afterChange) { |
||||
|
settings.eventHandlers.afterChange(element, settings, nextImage); |
||||
|
} |
||||
|
updateCurrentSlideElement(settings, settings.current); |
||||
|
settings.timerId = setTimeout(timeoutEvent, settings.transitionDelay, element, settings); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
function updateCurrentSlideElement(settings, current) { |
||||
|
if (settings.slideControls.enabled) { |
||||
|
var id = "#" + settings.uniqueId + "-image" + current; |
||||
|
$("[id^='" + settings.uniqueId + "-image']").removeClass("jquery-bg-slideshow-list-control-image-active-element"); |
||||
|
$(id).addClass("jquery-bg-slideshow-list-control-image-active-element"); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* Preload all of the images so that there will be no delay in showing |
||||
|
* the background. |
||||
|
*/ |
||||
|
function preloadImages(images) { |
||||
|
for (i = 0; i < images.length; i++) { |
||||
|
var length = preloadImages.length; |
||||
|
preloadedImages[length] = new Image(); |
||||
|
preloadedImages[length].src = images[i]; |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
/** |
||||
|
* Helper function to check if plugin is applied |
||||
|
*/ |
||||
|
$.fn.bgSlideshowApplied = function() { |
||||
|
return $(this).data("bgSlideShowApplied") == true ? true : false; |
||||
|
} |
||||
|
|
||||
|
}(jQuery)); |
||||
@ -0,0 +1,72 @@ |
|||||
|
/*! |
||||
|
* Start Bootstrap - Creative v6.0.5 (https://startbootstrap.com/theme/creative)
|
||||
|
* Copyright 2013-2021 Start Bootstrap |
||||
|
* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-creative/blob/master/LICENSE)
|
||||
|
*/ |
||||
|
(function ($) { |
||||
|
"use strict"; // Start of use strict
|
||||
|
|
||||
|
// Smooth scrolling using anime.js
|
||||
|
$('a.js-scroll-trigger[href*="#"]:not([href="#"])').on('click', function () { |
||||
|
if ( |
||||
|
location.pathname.replace(/^\//, "") == |
||||
|
this.pathname.replace(/^\//, "") && |
||||
|
location.hostname == this.hostname |
||||
|
) { |
||||
|
var target = $(this.hash); |
||||
|
target = target.length ? |
||||
|
target : |
||||
|
$("[name=" + this.hash.slice(1) + "]"); |
||||
|
if (target.length) { |
||||
|
anime({ |
||||
|
targets: 'html, body', |
||||
|
scrollTop: target.offset().top - 72, |
||||
|
duration: 1000, |
||||
|
easing: 'easeInOutExpo' |
||||
|
}); |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
// Closes responsive menu when a scroll trigger link is clicked
|
||||
|
$('.js-scroll-trigger').click(function () { |
||||
|
$('.navbar-collapse').collapse('hide'); |
||||
|
}); |
||||
|
|
||||
|
// Activate scrollspy to add active class to navbar items on scroll
|
||||
|
$('body').scrollspy({ |
||||
|
target: '#mainNav', |
||||
|
offset: 75 |
||||
|
}); |
||||
|
|
||||
|
// Collapse Navbar
|
||||
|
var navbarCollapse = function () { |
||||
|
if ($("#mainNav").offset().top > 100) { |
||||
|
$("#mainNav").addClass("navbar-scrolled"); |
||||
|
} else { |
||||
|
$("#mainNav").removeClass("navbar-scrolled"); |
||||
|
} |
||||
|
}; |
||||
|
// Collapse now if page is not at top
|
||||
|
navbarCollapse(); |
||||
|
// Collapse the navbar when page is scrolled
|
||||
|
$(window).scroll(navbarCollapse); |
||||
|
|
||||
|
// Magnific popup calls
|
||||
|
$('#portfolio').magnificPopup({ |
||||
|
delegate: 'a', |
||||
|
type: 'image', |
||||
|
tLoading: 'Loading image #%curr%...', |
||||
|
mainClass: 'mfp-img-mobile', |
||||
|
gallery: { |
||||
|
enabled: true, |
||||
|
navigateByImgClick: true, |
||||
|
preload: [0, 1] |
||||
|
}, |
||||
|
image: { |
||||
|
tError: '<a href="%url%">The image #%curr%</a> could not be loaded.' |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
})(jQuery); // End of use strict
|
||||
|
After Width: | Height: | Size: 304 KiB |
|
After Width: | Height: | Size: 318 KiB |
|
After Width: | Height: | Size: 371 KiB |
|
After Width: | Height: | Size: 341 KiB |
|
After Width: | Height: | Size: 289 KiB |
|
After Width: | Height: | Size: 274 KiB |
|
After Width: | Height: | Size: 350 KiB |
|
After Width: | Height: | Size: 492 KiB |
|
After Width: | Height: | Size: 438 KiB |
|
After Width: | Height: | Size: 474 KiB |
|
After Width: | Height: | Size: 446 KiB |
|
After Width: | Height: | Size: 457 KiB |
@ -0,0 +1,428 @@ |
|||||
|
<!DOCTYPE html> |
||||
|
<html lang="en"> |
||||
|
|
||||
|
<head> |
||||
|
<meta charset="utf-8" /> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> |
||||
|
<meta name="description" content="" /> |
||||
|
<meta name="author" content="" /> |
||||
|
<title>theme.park</title> |
||||
|
<!-- Favicon--> |
||||
|
<link rel="icon" type="image/x-icon" href="Resources/landing-page/assets/favicon.ico" /> |
||||
|
<!-- Font Awesome icons (free version)--> |
||||
|
<script src="https://use.fontawesome.com/releases/v5.15.3/js/all.js" crossorigin="anonymous"></script> |
||||
|
<!-- Google fonts--> |
||||
|
<link href="https://fonts.googleapis.com/css?family=Merriweather+Sans:400,700" rel="stylesheet" /> |
||||
|
<link href="https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic" |
||||
|
rel="stylesheet" type="text/css" /> |
||||
|
<!-- Third party plugin CSS--> |
||||
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css" |
||||
|
rel="stylesheet" /> |
||||
|
<!-- Core theme CSS (includes Bootstrap)--> |
||||
|
<link href="Resources/landing-page/css/styles.css" rel="stylesheet" /> |
||||
|
<link rel="stylesheet" href="Resources/landing-page/css/jquery-bg-slideshow.css"> |
||||
|
<link rel="stylesheet" href="Resources/landing-page/css/custom.css"> |
||||
|
</head> |
||||
|
|
||||
|
<body id="page-top"> |
||||
|
<!-- Navigation--> |
||||
|
<nav class="navbar navbar-expand-lg navbar-light fixed-top py-3" id="mainNav"> |
||||
|
<div class="container"> |
||||
|
<a class="navbar-brand js-scroll-trigger" href="#page-top"><img src="Resources/landing-page/assets/img/themepark-logo.png" |
||||
|
height="55px" alt=""></a> |
||||
|
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" |
||||
|
data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" |
||||
|
aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button> |
||||
|
<div class="collapse navbar-collapse" id="navbarResponsive"> |
||||
|
<ul class="navbar-nav ml-auto my-2 my-lg-0"> |
||||
|
<li class="nav-item"><a class="nav-link js-scroll-trigger" href="https://docs.theme-park.dev"><i |
||||
|
class="fas fa-book"></i> Docs</a></li> |
||||
|
<li class="nav-item"><a class="nav-link js-scroll-trigger" |
||||
|
href="https://github.com/gilbn/theme.park"><i class="fab fa-github"></i> Github</a></li> |
||||
|
<li class="nav-item"><a class="nav-link js-scroll-trigger" |
||||
|
href="https://docs.theme-park.dev/discord"><i class="fab fa-discord"></i> Discord</a></li> |
||||
|
<li class="nav-item"><a class="nav-link js-scroll-trigger" |
||||
|
href="https://github.com/sponsors/GilbN"><i class="fas fa-heart"></i> Sponsor</a></li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
</div> |
||||
|
</nav> |
||||
|
<!-- Masthead--> |
||||
|
<!-- --> |
||||
|
<header class="masthead bg" data-current="0" |
||||
|
data-images="Resources/landing-page/assets/img/slides/1.jpg,Resources/landing-page/assets/img/slides/2.jpg,Resources/landing-page/assets/img/slides/3.jpg,Resources/landing-page/assets/img/slides/4.jpg,Resources/landing-page/assets/img/slides/5.jpg,Resources/landing-page/assets/img/slides/6.jpg,Resources/landing-page/assets/img/slides/7.jpg, |
||||
|
Resources/landing-page/assets/img/slides/8.jpg,Resources/landing-page/assets/img/slides/9.jpg,Resources/landing-page/assets/img/slides/10.jpg" |
||||
|
data-transitionDelay="1000" data-transitionSpeed="2000" data-transitionEffect="from-right" data-randomize="false" |
||||
|
data-initialBackground="1" data-debug="true" data-slidecontrols.enabled="false" |
||||
|
data-gradient="linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.404) 100%)"> |
||||
|
<div class="container h-100"> |
||||
|
<div class="row h-100 align-items-center justify-content-center text-center"> |
||||
|
<div class="col-lg-10 align-self-end"> |
||||
|
<h1 class="text-uppercase text-white font-weight-bold">Custom themes for your favorite apps!</h1> |
||||
|
<hr class="divider my-4" /> |
||||
|
</div> |
||||
|
<div class="col-lg-8 align-self-baseline"> |
||||
|
<p class="text-white-75 font-weight-light mb-5">A collection of themes/skins for over 45 selfhosted apps! |
||||
|
</p> |
||||
|
<a class="btn btn-primary btn-xl js-scroll-trigger" href="#about">Find Out More</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</header> |
||||
|
<!-- About--> |
||||
|
<section class="page-section bg-primary" id="about"> |
||||
|
<div class="container"> |
||||
|
<div class="row justify-content-center"> |
||||
|
<div class="col-lg-8 text-center"> |
||||
|
<h2 class="text-white mt-0">Over 45 themed apps</h2> |
||||
|
<hr class="divider light my-4" /> |
||||
|
<p class="text-white-50 mb-1">theme.park contains 46 themed applications, with css <a href="https://docs.theme-park.dev/themes/addons/sonarr/">addons</a> on certain themes. </p> |
||||
|
<p class="text-white-50 mb-1">Installation methods include custom <a href="https://blog.linuxserver.io/2019/09/14/customizing-our-containers/">docker mods</a> for <a href="https://linuxserver.io">linuxserver.io</a> containers, </p> |
||||
|
<p class="text-white-50 mb-5">custom scripts for select <a href="https://hotio.dev/">Hotio</a> containers |
||||
|
and multiple examples of subfiltering using webservers like Nginx and Apache</p> |
||||
|
<a class="btn btn-primary btn-xl js-scroll-trigger" href="#services">Get Started!</a> |
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col justify-content-center pt-5"> |
||||
|
<div class="row justify-content-center"> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/sonarr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/sonarr/logo.png" /></p> |
||||
|
<p>Sonarr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/radarr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/radarr/logo.png" /></p> |
||||
|
<p>Radarr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/lidarr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/lidarr/logo.png" /></p> |
||||
|
<p>Lidarr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/bazarr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/bazarr/logo.png" /></p> |
||||
|
<p>Bazarr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/readarr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/readarr/logo.png" /></p> |
||||
|
<p>Readarr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/plex"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/plex/logo.png" /></p> |
||||
|
<p>Plex</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/calibreweb"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/calibreweb/logo.png" /></p> |
||||
|
<p>Calibre-Web</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/jellyfin"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/jellyfin/logo.png" /></p> |
||||
|
<p>Jellyfin</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/tautulli"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/tautulli/logo.png" /></p> |
||||
|
<p>Tautulli</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/ombi"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/ombi/logo.png" /></p> |
||||
|
<p>Ombi</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/requestrr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/requestrr/logo.png" /></p> |
||||
|
<p>Requestrr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/organizr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/organizr/logo.png" /></p> |
||||
|
<p>Organizr</p> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/qbittorrent"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/qbittorrent/logo.png" /></p> |
||||
|
<p>qBittorrent</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/rutorrent"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/rutorrent/logo.png" /></p> |
||||
|
<p>ruTorrent</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/transmission"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/transmission/logo.png" /></p> |
||||
|
<p>Transmission</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/sabnzbd"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/sabnzbd/logo.png" /></p> |
||||
|
<p>SABnzbd</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/nzbget"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/nzbget/logo.png" /></p> |
||||
|
<p>NZBGet</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/grafana"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/grafana/logo.png" /></p> |
||||
|
<p>Grafana</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/netdata"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/netdata/logo.png" /></p> |
||||
|
<p>Netdata</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/monitorr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/monitorr/logo.png" /></p> |
||||
|
<p>Monitorr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/logarr"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/logarr/logo.png" /></p> |
||||
|
<p>Logarr</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/portainer"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/portainer/logo.png" /></p> |
||||
|
<p>Portainer</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/pihole"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/pihole/logo.png" /></p> |
||||
|
<p>Pi-hole</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/guacamole"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/guacamole/logo.png" /></p> |
||||
|
<p>Guacamole</p> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/filebrowser"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/filebrowser/logo.png" /></p> |
||||
|
<p>Filebrowser</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/plpp"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/plpp/logo.png" /></p> |
||||
|
<p>PLPP</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/librespeed"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/librespeed/logo.png" /></p> |
||||
|
<p>Librespeed</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/thelounge"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/thelounge/logo.png" /></p> |
||||
|
<p>The Lounge</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/lazylibrarian"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/lazylibrarian/logo.png" /></p> |
||||
|
<p>Lazylibrarian</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/adguard"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/adguard/logo.png" /></p> |
||||
|
<p>Adguard</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/gaps"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/gaps/logo.png" /></p> |
||||
|
<p>Gaps</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/bitwarden"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/bitwarden/logo.png" /></p> |
||||
|
<p>Bitwarden</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/duplicacy"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/duplicacy/logo.png" /></p> |
||||
|
<p>Duplicacy</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/kitana"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/kitana/logo.png" /></p> |
||||
|
<p>Kitana</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/webtools"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/webtools/logo.png" /></p> |
||||
|
<p>Webtools</p> |
||||
|
</a> |
||||
|
<a class="col app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/resilio-sync"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/resilio-sync/logo.png" /></p> |
||||
|
<p>Resilio-Sync</p> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="container"> |
||||
|
<div class="row justify-content-md-center"> |
||||
|
<a class="col align-self-center app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/gitea"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/gitea/logo.png" /></p> |
||||
|
<p>Gitea</p> |
||||
|
</a> |
||||
|
<a class="col align-self-center app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/unraid"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/unraid/logo.png" /></p> |
||||
|
<p>Unraid</p> |
||||
|
</a> |
||||
|
<a class="col align-self-center app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/moviematch"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/moviematch/logo.png" /></p> |
||||
|
<p>Moviematch</p> |
||||
|
</a> |
||||
|
<a class="col align-self-center app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/petio"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/petio/logo.png" /></p> |
||||
|
<p>Petio</p> |
||||
|
</a> |
||||
|
<a class="col align-self-center app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/flood"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/flood/logo.png" /></p> |
||||
|
<p>Flood</p> |
||||
|
</a> |
||||
|
<a class="col align-self-center app-container text-center p-2 m-1" href="https://docs.theme-park.dev/themes/dozzle"> |
||||
|
<p><img class="app-container-image"src="https://docs.theme-park.dev/site_assets/dozzle/logo.png" /></p> |
||||
|
<p>Dozzle</p> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</section> |
||||
|
<!-- Services--> |
||||
|
<section class="page-section" id="services"> |
||||
|
<div class="container"> |
||||
|
<h2 class="text-center mt-0">How to get started</h2> |
||||
|
<hr class="divider my-4" /> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-3 col-md-6 text-center"> |
||||
|
<div class="mt-5"> |
||||
|
<i class="fas fa-4x fa-book text-primary mb-4"></i> |
||||
|
<h3 class="h4 mb-2">Theme Docs</h3> |
||||
|
<p class="text-muted mb-0">Head over to the <a href="https://docs.theme-park.dev/">documentation</a> page for more information on each theme!</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-lg-3 col-md-6 text-center"> |
||||
|
<div class="mt-5"> |
||||
|
<i class="fab fa-4x fa-github text-primary mb-4"></i> |
||||
|
<h3 class="h4 mb-2">Find us on Github</h3> |
||||
|
<p class="text-muted mb-0">Having issues with a theme? Let us know on Github!</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-lg-3 col-md-6 text-center"> |
||||
|
<div class="mt-5"> |
||||
|
<i class="fab fa-4x fa-discord text-primary mb-4"></i> |
||||
|
<h3 class="h4 mb-2">Discord Community</h3> |
||||
|
<p class="text-muted mb-0">Need live support? Head over to our <a href="https://docs.theme-park.dev/discord">Discord</a> server!</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-lg-3 col-md-6 text-center"> |
||||
|
<div class="mt-5"> |
||||
|
<i class="fas fa-4x fa-heart text-primary mb-4"></i> |
||||
|
<h3 class="h4 mb-2">Made with Love</h3> |
||||
|
<p class="text-muted mb-0">Is it really open source if it's not made with love?</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</section> |
||||
|
<!-- Portfolio--> |
||||
|
<div id="portfolio"> |
||||
|
<div class="container-fluid p-0"> |
||||
|
<div class="row no-gutters theme-overview"> |
||||
|
<div class="col-lg-4 col-sm-6 p-1"> |
||||
|
<a class="portfolio-box" href="Resources/landing-page/assets/img/aquamarine.png"> |
||||
|
<img class="img-fluid" src="Resources/landing-page/assets/img/aquamarine-small.png" alt="..." /> |
||||
|
<div class="portfolio-box-caption aquamarine-hover"> |
||||
|
<div class="project-category text-white-50">Theme</div> |
||||
|
<div class="project-name">Aquamarine</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="col-lg-4 col-sm-6 p-1"> |
||||
|
<a class="portfolio-box" href="Resources/landing-page/assets/img/hotline.png"> |
||||
|
<img class="img-fluid" src="Resources/landing-page/assets/img/hotline-small.png" alt="..." /> |
||||
|
<div class="portfolio-box-caption hotline-hover"> |
||||
|
<div class="project-category text-white-50">Theme</div> |
||||
|
<div class="project-name">Hotline</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="col-lg-4 col-sm-6 p-1"> |
||||
|
<a class="portfolio-box" href="Resources/landing-page/assets/img/space-gray.png"> |
||||
|
<img class="img-fluid" src="Resources/landing-page/assets/img/space-gray-small.png" alt="..." /> |
||||
|
<div class="portfolio-box-caption space-gray-hover"> |
||||
|
<div class="project-category text-white-50">Theme</div> |
||||
|
<div class="project-name">Space Gray</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="col-lg-4 col-sm-6 p-1"> |
||||
|
<a class="portfolio-box" href="Resources/landing-page/assets/img/organizr-dark.png"> |
||||
|
<img class="img-fluid" src="Resources/landing-page/assets/img/organizr-dark-small.png" alt="..." /> |
||||
|
<div class="portfolio-box-caption organizr-dark-hover"> |
||||
|
<div class="project-category text-white-50">Theme</div> |
||||
|
<div class="project-name">Organizr Dark</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="col-lg-4 col-sm-6 p-1"> |
||||
|
<a class="portfolio-box" href="Resources/landing-page/assets/img/dark.png"> |
||||
|
<img class="img-fluid" src="Resources/landing-page/assets/img/dark-small.png" alt="..." /> |
||||
|
<div class="portfolio-box-caption dark-hover" style="width: 562px; height: 295px !important;"> |
||||
|
<div class="project-category text-white-50">Theme</div> |
||||
|
<div class="project-name">Dark</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
<div class="col-lg-4 col-sm-6 p-1"> |
||||
|
<a class="portfolio-box" href="Resources/landing-page/assets/img/plex.png"> |
||||
|
<img class="img-fluid" src="Resources/landing-page/assets/img/plex-small.png" alt="..." /> |
||||
|
<div class="portfolio-box-caption p-3 plex-hover"> |
||||
|
<div class="project-category text-white-50">Theme</div> |
||||
|
<div class="project-name">Plex</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- Call to action--> |
||||
|
<!-- <section class="page-section bg-dark text-white"> |
||||
|
<div class="container text-center"> |
||||
|
<h2 class="mb-4">Free Download at Start Bootstrap!</h2> |
||||
|
<a class="btn btn-light btn-xl" href="https://startbootstrap.com/theme/creative/">Download Now!</a> |
||||
|
</div> |
||||
|
</section> --> |
||||
|
<!-- Contact--> |
||||
|
<!-- <section class="page-section" id="contact"> |
||||
|
<div class="container"> |
||||
|
<div class="row justify-content-center"> |
||||
|
<div class="col-lg-8 text-center"> |
||||
|
<h2 class="mt-0">Let's Get In Touch!</h2> |
||||
|
<hr class="divider my-4" /> |
||||
|
<p class="text-muted mb-5">Ready to start your next project with us? Give us a call or send us an |
||||
|
email and we will get back to you as soon as possible!</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="row"> |
||||
|
<div class="col-lg-4 ml-auto text-center mb-5 mb-lg-0"> |
||||
|
<i class="fas fa-phone fa-3x mb-3 text-muted"></i> |
||||
|
<div>+1 (555) 123-4567</div> |
||||
|
</div> |
||||
|
<div class="col-lg-4 mr-auto text-center"> |
||||
|
<i class="fas fa-envelope fa-3x mb-3 text-muted"></i> |
||||
|
<!-- Make sure to change the email address in BOTH the anchor text and the link target below!--> |
||||
|
<!-- <a class="d-block" href="mailto:contact@yourwebsite.com">contact@yourwebsite.com</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</section> --> |
||||
|
<!-- Footer--> |
||||
|
<footer class="theme-overview py-5"> |
||||
|
<div class="container"> |
||||
|
<div class="small text-center text-muted"> |
||||
|
Copyright © |
||||
|
<!-- This script automatically adds the current year to your website footer--> |
||||
|
<!-- (credit: https://updateyourfooter.com/)--> |
||||
|
<script> |
||||
|
document.write(new Date().getFullYear()); |
||||
|
</script> |
||||
|
- GilbN |
||||
|
</div> |
||||
|
</div> |
||||
|
</footer> |
||||
|
<!-- Bootstrap core JS--> |
||||
|
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> |
||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script> |
||||
|
<!-- Third party plugin JS--> |
||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js"></script> |
||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script> |
||||
|
<!-- Core theme JS--> |
||||
|
<script src="Resources/landing-page/js/scripts.js"></script> |
||||
|
<script src="Resources/landing-page/js/jquery-bg-slideshow.js"></script> |
||||
|
<script type="text/javascript"> |
||||
|
$(function () { |
||||
|
$(".bg").bgSlideShow(); |
||||
|
}); |
||||
|
</script> |
||||
|
</body> |
||||
|
|
||||
|
</html> |
||||
Loading…
Reference in new issue