Added About-Us Page

This commit is contained in:
Matthew Patrick 2021-11-09 08:26:55 +07:00
parent 0879aef4cf
commit 384a508049

158
views/pages/about-us.ejs Normal file
View file

@ -0,0 +1,158 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
<meta name="theme-color" content="#2f0001">
<link href="assets/favicon.webp" rel="shortcut icon" type="image/webp" />
<title>About Us</title>
<link href="https://fonts.googleapis.com" rel="preconnect">
<link crossorigin href="https://fonts.gstatic.com" rel="preconnect">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css" rel="stylesheet">
<link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css"
integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
background-color: #1b1c1e;
}
.comp-color {
background-color: #212226;
}
.nav-radius {
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}
video {
opacity: 0.5;
}
@media screen {
.card {
width: 70%;
margin: auto;
}
}
.card-img-overlay {
position: absolute;
text-align: center;
}
.navbar-brand {
width: 5%;
}
br {
display: block;
content: " ";
margin: 3vw 0;
line-height: 4vw;
}
.card-img-overlay h1 {
font-size: 5vw;
}
.card-img-overlay h3 {
font-size: 2vw;
}
.card-img-overlay p {
font-size: 1.4vw;
}
@media screen and (max-width: 500px) {
.card-img-overlay {
top: -2.7vw;
}
.navbar-brand {
width: 15vw;
height: 15vw;
}
}
@media screen and (min-width: 501px) {
.card-img-overlay {
top: 2.7vw;
}
}
:focus {
outline: 0 !important;
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lazysizes/5.3.2/lazysizes.min.js"></script>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark comp-color ml-5 mr-5 nav-radius">
<img alt="Banner" class="navbar-brand lazyload" src="assets/logo_transparent.webp">
<button aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation"
class="navbar-toggler" data-target="#navbarTogglerDemo01" data-toggle="collapse" type="button">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01">
<ul class="navbar-nav mx-auto">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/product-list.html">Products</a>
</li>
<li class="nav-item active">
<a aria-disabled="true" class="nav-link disabled" href="/about-us.html">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="faq.html">FAQ</a>
</li>
</ul>
<span class="navbar-nav my-2 my-lg-0 text-white">
<div class="my-4">
<a href="login.html"><button class="btn btn-outline-success mt-auto mb-auto mr-3"
type="button">Login</button></a>
</div>
<a href="bag.html" class="mt-auto mb-auto" style="color: inherit;"><i class="fas fa-shopping-cart"><span
class="ml-2 mt-auto mb-auto">Rp 999.999</span></i></a>
</span>
</div>
</nav>
<br style="display: block;content: ' '; margin: 1vw 0; line-height: 1vw;">
<div data-aos="fade-in" data-aos-delay="500" class="card text-white" style="background-color: black">
<video autoplay class="card-img" loop muted src="assets/AboutUs.mp4"></video>
<div class="card-img-overlay">
<h1 class="card-title"><b>About Us</b></h1>
<p class="card-text">Nekoya is your place for sneakers for the entire family from many name brands. Youll
discover styles for
ladies, men and children from brands like Nike, Converse, Vans, Sperry, Madden Girl, Skechers, ASICS and
then some! Nekoya is a main family footwear goal for the popular brands you know and love.</p>
<br>
<br>
<h1 class="card-title"><b>Contact Us</b></h1>
<br>
<h3 class="card-text"><i class="bi bi-envelope"></i> Info@Nekoya.com</h3>
</div>
</div>
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
AOS.init();
</script>
<script crossorigin="anonymous" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script crossorigin="anonymous" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns"
src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>