mirror of
https://github.com/gilbN/theme.park.git
synced 2024-08-18 07:59:37 +02:00
fancy landing page
This commit is contained in:
gilbN
parent
0f829f5bf8
commit
d7a20650fc
BIN
Resources/landing-page/assets/img/aquamarine-small.png
Normal file
BIN
Resources/landing-page/assets/img/aquamarine-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 MiB After Width: | Height: | Size: 1.6 MiB |
BIN
Resources/landing-page/assets/img/dark-small.png
Normal file
BIN
Resources/landing-page/assets/img/dark-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.8 MiB After Width: | Height: | Size: 1.3 MiB |
BIN
Resources/landing-page/assets/img/hotline-small.png
Normal file
BIN
Resources/landing-page/assets/img/hotline-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 53 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 MiB After Width: | Height: | Size: 2.4 MiB |
BIN
Resources/landing-page/assets/img/organizr-dark-small.png
Normal file
BIN
Resources/landing-page/assets/img/organizr-dark-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.5 MiB After Width: | Height: | Size: 841 KiB |
BIN
Resources/landing-page/assets/img/plex-small.png
Normal file
BIN
Resources/landing-page/assets/img/plex-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.7 MiB After Width: | Height: | Size: 3.0 MiB |
BIN
Resources/landing-page/assets/img/slides/1.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 449 KiB |
BIN
Resources/landing-page/assets/img/slides/10.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/10.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 107 KiB |
BIN
Resources/landing-page/assets/img/slides/2.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 252 KiB |
BIN
Resources/landing-page/assets/img/slides/3.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 316 KiB |
BIN
Resources/landing-page/assets/img/slides/4.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 250 KiB |
BIN
Resources/landing-page/assets/img/slides/5.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/5.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 390 KiB |
BIN
Resources/landing-page/assets/img/slides/6.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/6.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 454 KiB |
BIN
Resources/landing-page/assets/img/slides/7.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/7.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 365 KiB |
BIN
Resources/landing-page/assets/img/slides/8.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/8.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 287 KiB |
BIN
Resources/landing-page/assets/img/slides/9.jpg
Normal file
BIN
Resources/landing-page/assets/img/slides/9.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 121 KiB |
BIN
Resources/landing-page/assets/img/space-gray-small.png
Normal file
BIN
Resources/landing-page/assets/img/space-gray-small.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
256
Resources/landing-page/css/custom.css
Normal file
256
Resources/landing-page/css/custom.css
Normal file
@ -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;
|
||||
}
|
||||
@ -10105,12 +10105,12 @@ hr.light {
|
||||
header.masthead {
|
||||
padding-top: 10rem;
|
||||
padding-bottom: calc(10rem - 4.5rem);
|
||||
background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.404) 100%), url("../assets/img/aquamarine.png");
|
||||
background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.404) 100%), url("../assets/img/slides/2.jpg");
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: scroll;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
header.masthead h1 {
|
||||
font-size: 2.25rem;
|
||||
}
|
||||
|
||||
@ -1,218 +0,0 @@
|
||||
<!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="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="css/styles.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="css/jquery-bg-slideshow.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="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">
|
||||
<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 your favorite 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">We've got what you need!</h2>
|
||||
<hr class="divider light my-4" />
|
||||
<p class="text-white-50 mb-4">Start Bootstrap has everything you need to get your new website up and running in no time! Choose one of our open source, free to download, and easy to use themes! No strings attached!</p>
|
||||
<a class="btn btn-light btn-xl js-scroll-trigger" href="#services">Get Started!</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- Services-->
|
||||
<section class="page-section" id="services">
|
||||
<div class="container">
|
||||
<h2 class="text-center mt-0">At Your Service</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-gem text-primary mb-4"></i>
|
||||
<h3 class="h4 mb-2">Sturdy Themes</h3>
|
||||
<p class="text-muted mb-0">Our themes are updated regularly to keep them bug free!</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6 text-center">
|
||||
<div class="mt-5">
|
||||
<i class="fas fa-4x fa-laptop-code text-primary mb-4"></i>
|
||||
<h3 class="h4 mb-2">Up to Date</h3>
|
||||
<p class="text-muted mb-0">All dependencies are kept current to keep things fresh.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6 text-center">
|
||||
<div class="mt-5">
|
||||
<i class="fas fa-4x fa-globe text-primary mb-4"></i>
|
||||
<h3 class="h4 mb-2">Ready to Publish</h3>
|
||||
<p class="text-muted mb-0">You can use this design as is, or you can make changes!</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">
|
||||
<div class="col-lg-4 col-sm-6">
|
||||
<a class="portfolio-box" href="assets/img/portfolio/fullsize/1.jpg">
|
||||
<img class="img-fluid" src="assets/img/portfolio/thumbnails/1.jpg" alt="..." />
|
||||
<div class="portfolio-box-caption">
|
||||
<div class="project-category text-white-50">Category</div>
|
||||
<div class="project-name">Project Name</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-lg-4 col-sm-6">
|
||||
<a class="portfolio-box" href="assets/img/portfolio/fullsize/2.jpg">
|
||||
<img class="img-fluid" src="assets/img/portfolio/thumbnails/2.jpg" alt="..." />
|
||||
<div class="portfolio-box-caption">
|
||||
<div class="project-category text-white-50">Category</div>
|
||||
<div class="project-name">Project Name</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-lg-4 col-sm-6">
|
||||
<a class="portfolio-box" href="assets/img/portfolio/fullsize/3.jpg">
|
||||
<img class="img-fluid" src="assets/img/portfolio/thumbnails/3.jpg" alt="..." />
|
||||
<div class="portfolio-box-caption">
|
||||
<div class="project-category text-white-50">Category</div>
|
||||
<div class="project-name">Project Name</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-lg-4 col-sm-6">
|
||||
<a class="portfolio-box" href="assets/img/portfolio/fullsize/4.jpg">
|
||||
<img class="img-fluid" src="assets/img/portfolio/thumbnails/4.jpg" alt="..." />
|
||||
<div class="portfolio-box-caption">
|
||||
<div class="project-category text-white-50">Category</div>
|
||||
<div class="project-name">Project Name</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-lg-4 col-sm-6">
|
||||
<a class="portfolio-box" href="assets/img/portfolio/fullsize/5.jpg">
|
||||
<img class="img-fluid" src="assets/img/portfolio/thumbnails/5.jpg" alt="..." />
|
||||
<div class="portfolio-box-caption">
|
||||
<div class="project-category text-white-50">Category</div>
|
||||
<div class="project-name">Project Name</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-lg-4 col-sm-6">
|
||||
<a class="portfolio-box" href="assets/img/portfolio/fullsize/6.jpg">
|
||||
<img class="img-fluid" src="assets/img/portfolio/thumbnails/6.jpg" alt="..." />
|
||||
<div class="portfolio-box-caption p-3">
|
||||
<div class="project-category text-white-50">Category</div>
|
||||
<div class="project-name">Project Name</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="bg-light 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>
|
||||
- Company Name
|
||||
</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="js/scripts.js"></script>
|
||||
<script src="js/jquery-bg-slideshow.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
45
Resources/landing-page/js/jquery-bg-slideshow.js
vendored
45
Resources/landing-page/js/jquery-bg-slideshow.js
vendored
@ -31,7 +31,7 @@
|
||||
|
||||
*
|
||||
*/
|
||||
(function($) {
|
||||
(function($) {
|
||||
$.fn.bgSlideShow = function(options) {
|
||||
var preloadedImages = new Array();
|
||||
|
||||
@ -46,6 +46,8 @@
|
||||
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
|
||||
@ -118,20 +120,21 @@
|
||||
thisSetting.images = s.images;
|
||||
thisSetting.slideControls = s.slideControls;
|
||||
// List controls
|
||||
thisSetting.slideControls.enabled = $(elmt).data("slidecontrols.enabled") || s.slideControls.enabled;
|
||||
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);
|
||||
@ -279,7 +282,11 @@
|
||||
} else {
|
||||
image = settings.initialBackground;
|
||||
}
|
||||
$(element).css("background-image", "url(" + image + ")");
|
||||
if(settings.gradient) {
|
||||
$(element).css("background-image", settings.gradient + ", url(" + image + ")");
|
||||
}else {
|
||||
$(element).css("background-image", "url(" + image + ")");
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@ -305,18 +312,36 @@
|
||||
$(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": "url(" + nextImage + ")"
|
||||
"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");
|
||||
$(this).css({
|
||||
"background-image": "url(" + nextImage + ")",
|
||||
"position": "absolute",
|
||||
"display": settings.defaultDisplay
|
||||
});
|
||||
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) {
|
||||
|
||||
428
index.html
Normal file
428
index.html
Normal file
@ -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
Block a user