Template Files

This commit is contained in:
2025-11-20 23:11:58 -06:00
parent 26b49edfb4
commit ede00c44c6
133 changed files with 288792 additions and 0 deletions

643
landing.html Normal file
View File

@@ -0,0 +1,643 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Landing Page | Hyper - Responsive Bootstrap 5 Admin Dashboard</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description" />
<meta content="Coderthemes" name="author" />
<!-- App favicon -->
<link rel="shortcut icon" href="assets/images/favicon.ico">
<!-- Theme Config Js -->
<script src="assets/js/hyper-config.js"></script>
<!-- Vendor css -->
<link href="assets/css/vendor.min.css" rel="stylesheet" type="text/css" />
<!-- App css -->
<link href="assets/css/app-saas.min.css" rel="stylesheet" type="text/css" id="app-style" />
<!-- Icons css -->
<link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!-- NAVBAR START -->
<nav class="navbar navbar-expand-lg py-lg-3 navbar-dark">
<div class="container">
<!-- logo -->
<a href="index.html" class="navbar-brand me-lg-5">
<img src="assets/images/logo.png" alt="logo" class="logo-dark" height="22" />
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<i class="mdi mdi-menu"></i>
</button>
<!-- menus -->
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<!-- left menu -->
<ul class="navbar-nav me-auto align-items-center">
<li class="nav-item mx-lg-1">
<a class="nav-link active" href="">Home</a>
</li>
<li class="nav-item mx-lg-1">
<a class="nav-link" href="">Features</a>
</li>
<li class="nav-item mx-lg-1">
<a class="nav-link" href="">Pricing</a>
</li>
<li class="nav-item mx-lg-1">
<a class="nav-link" href="">FAQs</a>
</li>
<li class="nav-item mx-lg-1">
<a class="nav-link" href="">Clients</a>
</li>
<li class="nav-item mx-lg-1">
<a class="nav-link" href="">Contact</a>
</li>
</ul>
<!-- right menu -->
<ul class="navbar-nav ms-auto align-items-center">
<li class="nav-item me-0">
<a href="https://themes.getbootstrap.com/product/hyper-responsive-admin-dashboard-template/" target="_blank" class="nav-link d-lg-none">Purchase now</a>
<a href="https://themes.getbootstrap.com/product/hyper-responsive-admin-dashboard-template/" target="_blank" class="btn btn-sm btn-light rounded-pill d-none d-lg-inline-flex">
<i class="mdi mdi-basket me-2"></i> Purchase Now
</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- NAVBAR END -->
<!-- START HERO -->
<section class="hero-section">
<div class="container">
<div class="row align-items-center">
<div class="col-md-5">
<div class="mt-md-4">
<div>
<span class="badge bg-danger font-13 rounded-pill">New</span>
<span class="text-white-50 ms-1">Welcome to new landing page</span>
</div>
<h2 class="text-white fw-normal mb-4 mt-3 lh-base">
Hyper - Responsive Web UI Kit & Dashboard Template
</h2>
<p class="mb-4 font-16 text-white-50">Hyper is a fully featured dashboard and admin template
comes with tones of well designed UI elements, components, widgets and pages.</p>
<a href="" target="_blank" class="btn btn-lg font-16 btn-success">Get Free Trial <i class="mdi mdi-arrow-right ms-1"></i></a>
<a href="" target="_blank" class="btn btn-lg font-16 btn-info">Check Demos</a>
</div>
</div>
<div class="col-md-5 offset-md-2">
<div class="text-md-end mt-3 mt-md-0">
<img src="assets/images/svg/startup.svg" alt="" class="img-fluid" />
</div>
</div>
</div>
</div>
</section>
<!-- END HERO -->
<!-- START SERVICES -->
<section class="py-5">
<div class="container">
<div class="row py-4">
<div class="col-lg-12">
<div class="text-center">
<h1 class="mt-0"><i class="mdi mdi-infinity"></i></h1>
<h3>The admin is fully <span class="text-primary">responsive</span> and easy to <span class="text-primary">customize</span></h3>
<p class="text-muted mt-2">The clean and well commented code allows easy customization of the
theme.It's designed for
<br>describing your app, agency or business.
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="text-center p-2 p-sm-3">
<div class="avatar-sm m-auto">
<span class="avatar-title bg-primary-lighten rounded-circle">
<i class="uil uil-desktop text-primary font-24"></i>
</span>
</div>
<h4 class="mt-3">Responsive Layouts</h4>
<p class="text-muted mt-2 mb-0">Et harum quidem rerum as expedita distinctio nam libero tempore
cum soluta nobis est cumque quo.
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="text-center p-2 p-sm-3">
<div class="avatar-sm m-auto">
<span class="avatar-title bg-primary-lighten rounded-circle">
<i class="uil uil-vector-square text-primary font-24"></i>
</span>
</div>
<h4 class="mt-3">Based on Bootstrap UI</h4>
<p class="text-muted mt-2 mb-0">Temporibus autem quibusdam et aut officiis necessitatibus saepe
eveniet ut sit et recusandae.
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="text-center p-2 p-sm-3">
<div class="avatar-sm m-auto">
<span class="avatar-title bg-primary-lighten rounded-circle">
<i class="uil uil-presentation text-primary font-24"></i>
</span>
</div>
<h4 class="mt-3">Creative Design</h4>
<p class="text-muted mt-2 mb-0">Nam libero tempore, cum soluta a est eligendi minus id quod
maxime placeate facere assumenda est.
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="text-center p-2 p-sm-3">
<div class="avatar-sm m-auto">
<span class="avatar-title bg-primary-lighten rounded-circle">
<i class="uil uil-apps text-primary font-24"></i>
</span>
</div>
<h4 class="mt-3">Multiple Applications</h4>
<p class="text-muted mt-2 mb-0">Et harum quidem rerum as expedita distinctio nam libero tempore
cum soluta nobis est cumque quo.
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="text-center p-2 p-sm-3">
<div class="avatar-sm m-auto">
<span class="avatar-title bg-primary-lighten rounded-circle">
<i class="uil uil-shopping-cart-alt text-primary font-24"></i>
</span>
</div>
<h4 class="mt-3">Ecommerce Pages</h4>
<p class="text-muted mt-2 mb-0">Temporibus autem quibusdam et aut officiis necessitatibus saepe
eveniet ut sit et recusandae.
</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="text-center p-2 p-sm-3">
<div class="avatar-sm m-auto">
<span class="avatar-title bg-primary-lighten rounded-circle">
<i class="uil uil-grids text-primary font-24"></i>
</span>
</div>
<h4 class="mt-3">Multiple Layouts</h4>
<p class="text-muted mt-2 mb-0">Nam libero tempore, cum soluta a est eligendi minus id quod
maxime placeate facere assumenda est.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- END SERVICES -->
<!-- START FEATURES 1 -->
<section class="py-5 bg-light-lighten border-top border-bottom border-light">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
<h3>Flexible <span class="text-primary">Layouts</span></h3>
<p class="text-muted mt-2">There are three different layout options available to cater need for
any <br /> modern web
application.</p>
</div>
</div>
</div>
<div class="row mt-1">
<div class="col-lg-4 col-md-6">
<div class="demo-box text-center mt-3">
<img src="assets/images/layouts/layout-1.png" alt="demo-img" class="img-fluid shadow-sm rounded">
<h5 class="mt-3 f-17">Vertical Layout</h5>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="demo-box text-center mt-3">
<img src="assets/images/layouts/layout-2.png" alt="demo-img" class="img-fluid shadow-sm rounded">
<h5 class="mt-3 f-17">Horizontal Layout</h5>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="demo-box text-center mt-3">
<img src="assets/images/layouts/layout-3.png" alt="demo-img" class="img-fluid shadow-sm rounded">
<h5 class="mt-3 f-17">Detached Layout</h5>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="demo-box text-center mt-3">
<img src="assets/images/layouts/layout-5.png" alt="demo-img" class="img-fluid shadow-sm rounded">
<h5 class="mt-3 f-17">Light Sidenav Layout</h5>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="demo-box text-center mt-3">
<img src="assets/images/layouts/layout-6.png" alt="demo-img" class="img-fluid shadow-sm rounded">
<h5 class="mt-3 f-17">Boxed Layout</h5>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="demo-box text-center mt-3">
<img src="assets/images/layouts/layout-4.png" alt="demo-img" class="img-fluid shadow-sm rounded">
<h5 class="mt-3 f-17">Semi Dark Layout</h5>
</div>
</div>
</div>
</div>
</section>
<!-- END FEATURES 1 -->
<!-- START FEATURES 2 -->
<section class="py-5">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
<h1 class="mt-0"><i class="mdi mdi-heart-multiple-outline"></i></h1>
<h3>Features you'll <span class="text-danger">love</span></h3>
<p class="text-muted mt-2">Hyper comes with next generation ui design and have multiple benefits
</p>
</div>
</div>
</div>
<div class="row mt-2 py-5 align-items-center">
<div class="col-lg-5 col-md-6">
<img src="assets/images/svg/features-1.svg" class="img-fluid" alt="">
</div>
<div class="col-lg-6 offset-md-1 col-md-5">
<h3 class="fw-normal">Inbuilt applications and pages</h3>
<p class="text-muted mt-3">Hyper comes with a variety of ready-to-use applications and pages that help to speed up the development</p>
<div class="mt-4">
<p class="text-muted"><i class="mdi mdi-circle-medium text-primary"></i> Projects & Tasks</p>
<p class="text-muted"><i class="mdi mdi-circle-medium text-primary"></i> Ecommerce Application Pages</p>
<p class="text-muted"><i class="mdi mdi-circle-medium text-primary"></i> Profile, pricing, invoice</p>
<p class="text-muted"><i class="mdi mdi-circle-medium text-primary"></i> Login, signup, forget password</p>
</div>
<a href="" class="btn btn-primary rounded-pill mt-3">Read More <i class="mdi mdi-arrow-right ms-1"></i></a>
</div>
</div>
<div class="row pb-3 pt-5 align-items-center">
<div class="col-lg-6 col-md-5">
<h3 class="fw-normal">Simply beautiful design</h3>
<p class="text-muted mt-3">The simplest and fastest way to build dashboard or admin panel. Hyper is built using the latest tech and tools and provide an easy way to customize anything, including an overall color schemes, layout, etc.</p>
<div class="mt-4">
<p class="text-muted"><i class="mdi mdi-circle-medium text-success"></i> Built with latest Bootstrap</p>
<p class="text-muted"><i class="mdi mdi-circle-medium text-success"></i> Extensive use of SCSS variables</p>
<p class="text-muted"><i class="mdi mdi-circle-medium text-success"></i> Well documented and structured code</p>
<p class="text-muted"><i class="mdi mdi-circle-medium text-success"></i> Detailed Documentation</p>
</div>
<a href="" class="btn btn-success rounded-pill mt-3">Read More <i class="mdi mdi-arrow-right ms-1"></i></a>
</div>
<div class="col-lg-5 col-md-6 offset-md-1">
<img src="assets/images/svg/features-2.svg" class="img-fluid" alt="">
</div>
</div>
</div>
</section>
<!-- END FEATURES 2 -->
<!-- START PRICING -->
<section class="py-5 bg-light-lighten border-top border-bottom border-light">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
<h1 class="mt-0"><i class="mdi mdi-tag-multiple"></i></h1>
<h3>Choose Simple <span class="text-primary">Pricing</span></h3>
<p class="text-muted mt-2">The clean and well commented code allows easy customization of the
theme.It's designed for
<br>describing your app, agency or business.
</p>
</div>
</div>
</div>
<div class="row mt-5 pt-3">
<div class="col-md-4">
<div class="card card-pricing">
<div class="card-body text-center">
<p class="card-pricing-plan-name fw-bold text-uppercase">Standard License </p>
<i class="card-pricing-icon ri-user-line text-primary"></i>
<h2 class="card-pricing-price">$49 <span>/ License</span></h2>
<ul class="card-pricing-features">
<li>10 GB Storage</li>
<li>500 GB Bandwidth</li>
<li>No Domain</li>
<li>1 User</li>
<li>Email Support</li>
<li>24x7 Support</li>
</ul>
<button class="btn btn-primary mt-4 mb-2 rounded-pill">Choose Plan</button>
</div>
</div>
<!-- end Pricing_card -->
</div>
<!-- end col -->
<div class="col-md-4">
<div class="card card-pricing card-pricing-recommended">
<div class="card-body text-center">
<div class="card-pricing-plan-tag">Recommended</div>
<p class="card-pricing-plan-name fw-bold text-uppercase">Multiple License</p>
<i class="card-pricing-icon ri-briefcase-line text-primary"></i>
<h2 class="card-pricing-price">$99 <span>/ License</span></h2>
<ul class="card-pricing-features">
<li>50 GB Storage</li>
<li>900 GB Bandwidth</li>
<li>2 Domain</li>
<li>10 User</li>
<li>Email Support</li>
<li>24x7 Support</li>
</ul>
<button class="btn btn-primary mt-4 mb-2 rounded-pill">Choose Plan</button>
</div>
</div>
<!-- end Pricing_card -->
</div>
<!-- end col -->
<div class="col-md-4">
<div class="card card-pricing">
<div class="card-body text-center">
<p class="card-pricing-plan-name fw-bold text-uppercase">Extended License</p>
<i class="card-pricing-icon ri-store-2-line text-primary"></i>
<h2 class="card-pricing-price">$599 <span>/ License</span></h2>
<ul class="card-pricing-features">
<li>100 GB Storege</li>
<li>Unlimited Bandwidth</li>
<li>10 Domain</li>
<li>Unlimited User</li>
<li>Email Support</li>
<li>24x7 Support</li>
</ul>
<button class="btn btn-primary mt-4 mb-2 rounded-pill">Choose Plan</button>
</div>
</div>
<!-- end Pricing_card -->
</div>
<!-- end col -->
</div>
</div>
</section>
<!-- END PRICING -->
<!-- START FAQ -->
<section class="py-5">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
<h1 class="mt-0"><i class="mdi mdi-frequently-asked-questions"></i></h1>
<h3>Frequently Asked <span class="text-primary">Questions</span></h3>
<p class="text-muted mt-2">Here are some of the basic types of questions for our customers. For more
<br>information please contact us.
</p>
<button type="button" class="btn btn-success btn-sm mt-2"><i class="mdi mdi-email-outline me-1"></i> Email us your question</button>
<button type="button" class="btn btn-info btn-sm mt-2 ms-1"><i class="mdi mdi-twitter me-1"></i> Send us a tweet</button>
</div>
</div>
</div>
<div class="row mt-5">
<div class="col-lg-5 offset-lg-1">
<!-- Question/Answer -->
<div>
<div class="faq-question-q-box">Q.</div>
<h4 class="faq-question text-body">Can I use this template for my client?</h4>
<p class="faq-answer mb-4 pb-1 text-muted">Yup, the marketplace license allows you to use this theme
in any end products.
For more information on licenses, please refere <a href="https://themes.getbootstrap.com/licenses/" target="_blank">here</a>.</p>
</div>
<!-- Question/Answer -->
<div>
<div class="faq-question-q-box">Q.</div>
<h4 class="faq-question text-body">How do I get help with the theme?</h4>
<p class="faq-answer mb-4 pb-1 text-muted">Use our dedicated support email (support@coderthemes.com) to send your issues or feedback. We are here to help anytime.</p>
</div>
</div>
<!--/col-lg-5 -->
<div class="col-lg-5">
<!-- Question/Answer -->
<div>
<div class="faq-question-q-box">Q.</div>
<h4 class="faq-question text-body">Can this theme work with Wordpress?</h4>
<p class="faq-answer mb-4 pb-1 text-muted">No. This is a HTML template. It won't directly with
wordpress, though you can convert this into wordpress compatible theme.</p>
</div>
<!-- Question/Answer -->
<div>
<div class="faq-question-q-box">Q.</div>
<h4 class="faq-question text-body">Will you regularly give updates of Hyper?</h4>
<p class="faq-answer mb-4 pb-1 text-muted">Yes, We will update the Hyper regularly. All the
future updates would be available without any cost.</p>
</div>
</div>
<!--/col-lg-5-->
</div>
<!-- end row -->
</div> <!-- end container-->
</section>
<!-- END FAQ -->
<!-- START CONTACT -->
<section class="py-5 bg-light-lighten border-top border-bottom border-light">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="text-center">
<h3>Get In <span class="text-primary">Touch</span></h3>
<p class="text-muted mt-2">Please fill out the following form and we will get back to you shortly. For more
<br>information please contact us.
</p>
</div>
</div>
</div>
<div class="row align-items-center mt-3">
<div class="col-md-4">
<p class="text-muted"><span class="fw-bold">Customer Support:</span><br> <span class="d-block mt-1">+1 234 56 7894</span></p>
<p class="text-muted mt-4"><span class="fw-bold">Email Address:</span><br> <span class="d-block mt-1">info@gmail.com</span></p>
<p class="text-muted mt-4"><span class="fw-bold">Office Address:</span><br> <span class="d-block mt-1">4461 Cedar Street Moro, AR 72368</span></p>
<p class="text-muted mt-4"><span class="fw-bold">Office Time:</span><br> <span class="d-block mt-1">9:00AM To 6:00PM</span></p>
</div>
<div class="col-md-7">
<form>
<div class="row mt-4">
<div class="col-lg-6">
<div class="mb-2">
<label for="fullname" class="form-label">Your Name</label>
<input class="form-control form-control-light py-2" type="text" id="fullname" placeholder="Name...">
</div>
</div>
<div class="col-lg-6">
<div class="mb-2">
<label for="emailaddress" class="form-label">Your Email</label>
<input class="form-control form-control-light py-2" type="email" required="" id="emailaddress" placeholder="Enter you email...">
</div>
</div>
</div>
<div class="row mt-1">
<div class="col-lg-12">
<div class="mb-2">
<label for="subject" class="form-label">Your Subject</label>
<input class="form-control form-control-light py-2" type="text" id="subject" placeholder="Enter subject...">
</div>
</div>
</div>
<div class="row mt-1">
<div class="col-lg-12">
<div class="mb-2">
<label for="comments" class="form-label">Message</label>
<textarea id="comments" rows="4" class="form-control form-control-light" placeholder="Type your message here..."></textarea>
</div>
</div>
</div>
<div class="row mt-2">
<div class="col-12 text-end">
<button class="btn btn-primary">Send a Message <i class="mdi mdi-telegram ms-1"></i> </button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- END CONTACT -->
<!-- START FOOTER -->
<footer class="bg-dark py-5">
<div class="container">
<div class="row">
<div class="col-lg-6">
<img src="assets/images/logo.png" alt="logo" class="logo-dark" height="22" />
<p class="text-light text-opacity-50 mt-4">Hyper makes it easier to build better websites with
<br> great speed. Save hundreds of hours of design
<br> and development by using it.
</p>
<ul class="social-list list-inline mt-3">
<li class="list-inline-item text-center">
<a href="javascript: void(0);" class="social-list-item border-primary text-primary"><i class="mdi mdi-facebook"></i></a>
</li>
<li class="list-inline-item text-center">
<a href="javascript: void(0);" class="social-list-item border-danger text-danger"><i class="mdi mdi-google"></i></a>
</li>
<li class="list-inline-item text-center">
<a href="javascript: void(0);" class="social-list-item border-info text-info"><i class="mdi mdi-twitter"></i></a>
</li>
<li class="list-inline-item text-center">
<a href="javascript: void(0);" class="social-list-item border-secondary text-secondary"><i class="mdi mdi-github"></i></a>
</li>
</ul>
</div>
<div class="col-lg-2 col-md-4 mt-3 mt-lg-0">
<h5 class="text-light">Company</h5>
<ul class="list-unstyled ps-0 mb-0 mt-3">
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">About Us</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Documentation</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Blog</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Affiliate Program</a></li>
</ul>
</div>
<div class="col-lg-2 col-md-4 mt-3 mt-lg-0">
<h5 class="text-light">Apps</h5>
<ul class="list-unstyled ps-0 mb-0 mt-3">
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Ecommerce Pages</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Email</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Social Feed</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Projects</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Tasks Management</a></li>
</ul>
</div>
<div class="col-lg-2 col-md-4 mt-3 mt-lg-0">
<h5 class="text-light">Discover</h5>
<ul class="list-unstyled ps-0 mb-0 mt-3">
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Help Center</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Our Products</a></li>
<li class="mt-2"><a href="javascript: void(0);" class="text-light text-opacity-50">Privacy</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="mt-5">
<p class="text-light text-opacity-50 mt-4 text-center mb-0">© 2018 -
<script>document.write(new Date().getFullYear())</script> Hyper. Design and coded by
Coderthemes
</p>
</div>
</div>
</div>
</div>
</footer>
<!-- END FOOTER -->
<!-- Vendor js -->
<script src="assets/js/vendor.min.js"></script>
<!-- App js -->
<script src="assets/js/app.min.js"></script>
</body>
</html>