1
0
mirror of https://github.com/gilbN/theme.park.git synced 2024-08-18 07:59:37 +02:00

some fixes

This commit is contained in:
Marius 2021-05-16 18:35:04 +02:00
parent 0334c5d4d5
commit 2eddb40b83
3 changed files with 304 additions and 229 deletions

View File

@ -1,8 +1,28 @@
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
#mainNav,
#mainNav.navbar-scrolled {
box-shadow: none;
background-color: rgba(0, 0, 0, 0.55);
-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)) {
#mainNav,
#mainNav.navbar-scrolled {
box-shadow: none;
background-color: rgba(0, 0, 0, 0.9);
}
}
@media (min-width: 992px) {
#mainNav {
box-shadow: none;
background-color: rgba(0, 0, 0, 0.55);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
#mainNav .navbar-brand {
@ -30,6 +50,7 @@
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
background-color: rgba(0, 0, 0, 0.55);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
#mainNav.navbar-scrolled .navbar-brand {
@ -49,13 +70,12 @@
color: #12afa0;
}
}
#mainNav {
box-shadow: none;
background-color: rgba(0, 0, 0, 0.55);
backdrop-filter: blur(10px);
}
#mainNav .navbar-nav .nav-item .nav-link:hover, #mainNav .navbar-nav .nav-item .nav-link:active {
color: #12afa0;
}
#mainNav .navbar-nav .nav-item .nav-link.active {
color: #12afa0 !important;
}
.navbar-light .navbar-toggler-icon {
filter: invert(1);
}
@ -138,12 +158,7 @@ header.masthead {
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;
}
@ -172,24 +187,22 @@ header.masthead {
.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);
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 1.0), rgba(87, 109, 117, 1.0));
background: -moz-linear-gradient(top, rgba(0, 0, 0, 1.0), rgba(87, 109, 117, 1.0));
background: linear-gradient(to bottom, rgba(0, 0, 0, 1.0), rgba(87, 109, 117, 1.0));
/* 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);
background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1.0), rgba(87, 109, 117, 1.0));
background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 1.0), rgba(87, 109, 117, 1.0));
background: linear-gradient(to top, rgba(0, 0, 0, 1.0), rgba(87, 109, 117, 1.0));
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
font-family: var(--font-family-sans-serif);
}
#services {
background: #2d2d2d;
background: rgba(87, 109, 117, 1.0);
color: white;
padding: 0rem 0 8rem 0;
}
@ -198,6 +211,8 @@ header.masthead {
background: rgba(0, 0, 0, 0.2);
color:rgba(255, 255, 255, 0.7);
border-radius: 5px;
max-width: 120px;
min-width: 120px;
}
.app-container:hover {
color: white;
@ -233,29 +248,35 @@ p {
#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;
width: 562.4px;
}
#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;
width: 562.4px;
}
#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;
width: 562.4px;
}
#portfolio .container-fluid .portfolio-box .portfolio-box-caption.organizr-dark-hover:hover {
background: #1f1f1f;
opacity: .9;
width: 562.4px;
}
#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;
width: 562.4px;
}
#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;
width: 562.4px;
}

View File

@ -232,7 +232,7 @@
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] + ")");
$(element).css("background", "url(" + settings.images[imageOffset] + ")");
updateCurrentSlideElement(settings, settings.current - 1);
console.log("clicked on [" + $(this).attr("id") + "]");
});
@ -283,9 +283,9 @@
image = settings.initialBackground;
}
if(settings.gradient) {
$(element).css("background-image", settings.gradient + ", url(" + image + ")");
$(element).css("background", settings.gradient + ", url(" + image + ") center center/cover no-repeat fixed");
}else {
$(element).css("background-image", "url(" + image + ")");
$(element).css("background", "url(" + image + ") center center/cover no-repeat fixed");
}
}
@ -314,15 +314,15 @@
settings.cloned = $(element).clone();
if(settings.gradient) {
$(settings.cloned).addClass("jquery-bg-slideshow-cloned").css({
"background-image": settings.gradient+", url(" + nextImage + ")"
"background": settings.gradient+", url(" + nextImage + ") center center/cover no-repeat fixed"
}).insertAfter($(element));
} else {
$(settings.cloned).addClass("jquery-bg-slideshow-cloned").css({
"background-image": "url(" + nextImage + ")"
"background": "url(" + nextImage + ") center center/cover no-repeat fixed"
}).insertAfter($(element));
}
$(settings.cloned).addClass("jquery-bg-slideshow-cloned").css({
"background-image": settings.gradient+", url(" + nextImage + ")"
"background": settings.gradient+", url(" + nextImage + ") center center/cover no-repeat fixed"
}).insertAfter($(element));
$(settings.cloned).css("display", settings.defaultDisplay);
debug(settings.debug, "Before element fadeout");
@ -330,13 +330,13 @@
debug(settings.debug, "Fading out is done - should remove cloned element");
if(settings.gradient) {
$(this).css({
"background-image": settings.gradient+", url(" + nextImage + ")",
"background": settings.gradient+", url(" + nextImage + ") center center/cover no-repeat fixed",
"position": "absolute",
"display": settings.defaultDisplay
});
} else {
$(this).css({
"background-image": "url(" + nextImage + ")",
"background": "url(" + nextImage + ") center center/cover no-repeat fixed",
"position": "absolute",
"display": settings.defaultDisplay
});

View File

@ -28,8 +28,8 @@
<!-- 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>
<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>
@ -54,7 +54,7 @@
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="fade-in" data-randomize="false"
data-initialBackground="4" data-debug="false" data-slidecontrols.enabled="false"
data-gradient="linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.404) 100%)">
data-gradient="linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 50%)">
<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">
@ -62,7 +62,8 @@
<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 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>
@ -76,195 +77,245 @@
<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>
<p class="text-white-50 mb-1">theme.park contains 47 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 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/emby">
<p><img class="app-container-image"
src="https://docs.theme-park.dev/site_assets/emby/logo.png" /></p>
<p>Emby</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>
<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>
<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>
<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>
</section>
<!-- Services-->
<section class="page-section" id="services">
@ -274,37 +325,40 @@
<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>
<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>
<p class="text-white-50 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>
<p class="text-white-50 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>
<p class="text-white-50 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>
<p class="text-white-50 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 id="portfolio" class="theme-overview">
<div class="container-fluid p-0">
<div class="row no-gutters theme-overview">
<div class="col-lg-4 col-sm-6 p-1">
@ -378,27 +432,27 @@
<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
<p class="text-white-50 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>
<i class="fas fa-phone fa-3x mb-3 text-white-50"></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>
<i class="fas fa-envelope fa-3x mb-3 text-white-50"></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>
<!-- <a class="d-block" href="mailto:contact@yourwebsite.com">contact@yourwebsite.com</a>
</div>
</div>
</div>
</section> -->
<!-- Footer-->
<footer class="theme-overview py-5">
<footer class=" py-5">
<div class="container">
<div class="small text-center text-muted">
<div class="small text-center text-white-50">
Copyright &copy;
<!-- This script automatically adds the current year to your website footer-->
<!-- (credit: https://updateyourfooter.com/)-->