197 lines
9.6 KiB
Plaintext
197 lines
9.6 KiB
Plaintext
<!-- NAVBAR START -->
|
|
<nav class="navbar navbar-expand-lg py-lg-3 navbar-dark">
|
|
<div class="container">
|
|
<!-- logo -->
|
|
<a href="/" class="navbar-brand me-lg-5">
|
|
<%= image_pack_tag 'media/images/logo.png', alt: 'logo', height: 18, class: 'logo-dark' %>
|
|
</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">
|
|
<%= button_to user_bnet_omniauth_authorize_path, class: 'btn btn-primary nav-item', name: 'login', form: { 'data-turbo': false } do %>
|
|
Sign in with <i class="fab fa-battle-net"></i>
|
|
<% end %>
|
|
</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 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 hero-title">
|
|
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-success">Preview <i
|
|
class="mdi mdi-arrow-right ms-1"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-5 offset-md-2">
|
|
<div class="text-md-end mt-3 mt-md-0">
|
|
<%= image_pack_tag 'media/images/startup.svg', alt: 'startup', class: 'img-fluid' %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- END HERO -->
|
|
|
|
<!-- 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-4">
|
|
<div class="col-lg-4">
|
|
<div class="demo-box text-center">
|
|
<%= image_pack_tag 'media/images/layouts/layout-1.png', alt: 'demo-img-1', class: 'img-fluid shadow-sm rounded' %>
|
|
<h5 class="mt-3 f-17">Vertical Layout</h5>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="demo-box text-center mt-3 mt-lg-0">
|
|
<%= image_pack_tag 'media/images/layouts/layout-2.png', alt: 'demo-img-2', class: 'img-fluid shadow-sm rounded' %>
|
|
<h5 class="mt-3 f-17">Horizontal Layout</h5>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="demo-box text-center mt-3 mt-lg-0">
|
|
<%= image_pack_tag 'media/images/layouts/layout-3.png', alt: 'demo-img-3', class: 'img-fluid shadow-sm rounded' %>
|
|
<h5 class="mt-3 f-17">Detached Layout</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row mt-4">
|
|
|
|
<div class="col-lg-4">
|
|
<div class="demo-box text-center">
|
|
<%= image_pack_tag 'media/images/layouts/layout-5.png', alt: 'demo-img-5', class: 'img-fluid shadow-sm rounded' %>
|
|
<h5 class="mt-3 f-17">Light Sidenav Layout</h5>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="demo-box text-center mt-3 mt-lg-0">
|
|
<%= image_pack_tag 'media/images/layouts/layout-6.png', alt: 'demo-img-6', class: 'img-fluid shadow-sm rounded' %>
|
|
<h5 class="mt-3 f-17">Boxed Layout</h5>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="demo-box text-center mt-3 mt-lg-0">
|
|
<%= image_pack_tag 'media/images/layouts/layout-4.png', alt: 'demo-img-4', 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 FOOTER -->
|
|
<footer class="bg-dark py-5">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<%= image_pack_tag 'media/images/logo.png', alt: 'features-1', class: 'logo-dark', height: 18 %>
|
|
<p class="text-muted 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 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-muted">About Us</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Documentation</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Blog</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Affiliate Program</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-2 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-muted">Ecommerce Pages</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Email</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Social Feed</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Projects</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Tasks Management</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-2 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-muted">Help Center</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Our Products</a></li>
|
|
<li class="mt-2"><a href="javascript: void(0);" class="text-muted">Privacy</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="mt-5">
|
|
<p class="text-muted mt-4 text-center mb-0">© 2018 - 2021 Hyper. Design and coded by
|
|
Coderthemes</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
<!-- END FOOTER -->
|