1
0
Fork 0
mirror of https://gitlab.com/nekoya/web.git synced 2025-04-25 21:48:01 +02:00
This commit is contained in:
Moe Poi ~ 2021-11-09 08:29:54 +07:00
commit 773c772473
6 changed files with 805 additions and 1 deletions

View file

@ -5,7 +5,7 @@ const app = express()
app.use(express.static('public'))
app.set('view engine', 'ejs')
const indexRouter = require('./routers/product');
const indexRouter = require('./routes/product');
app.use('/', indexRouter);

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>

View file

@ -0,0 +1,189 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta name="theme-color" content="#2f0001">
<link href="assets/favicon.webp" rel="shortcut icon" type="image/webp" />
<title>Register</title>
<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://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://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
background-color: #1b1c1e;
}
.nav-color {
background-color: #212226;
}
.nav-radius {
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}
.card {
position: center;
margin: auto;
text-align: center;
border-radius: 20px;
background-color: #212226;
}
.btn {
background-color: darkred;
border-color: darkred;
border-radius: 100px;
}
.btn:hover {
background-color: red;
border-color: red;
}
.icon {
position: center;
margin: auto;
width: 70%;
height: 70%;
}
@media screen and (max-width: 766px) {
.card h2 {
font-size: 7vw;
}
.card h6 {
font-size: 5vw;
}
.card a {
font-size: 5vw;
}
.navbar-brand {
width: 11vw;
height: 11vw;
}
}
@media screen and (min-width: 767px) {
.card h2 {
font-size: 4vw;
}
.card h6 {
font-size: 2vw;
}
.card a {
font-size: 2.5vw;
}
.navbar-brand {
width: 8vw;
height: 8vw;
}
}
@media screen and (min-width: 993px) {
.card h2 {
font-size: 3vw;
}
.card h6 {
font-size: 1.3vw;
}
.card a {
font-size: 1.5vw;
}
.navbar-brand {
width: 6vw;
height: 6vw;
}
}
@media screen and (min-width: 1400px) {
.card h2 {
font-size: 4vw;
}
.card h6 {
font-size: 2vw;
}
.card a {
font-size: 3vw;
}
.navbar-brand {
width: 6vw;
height: 6vw;
}
: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-dark nav-color ml-5 mr-5 nav-radius">
<a href="/"><img alt="Banner" class="navbar-brand lazyload" src="assets/logo_transparent.webp" style="margin-top: 0%;"></a>
<ul class="navbar-nav">
<li class="nav-item">
<a style="color: white; font-size: 16pt;">Register</a>
</li>
</ul>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01"></div>
</nav>
<br>
<div data-aos="fade-in" data-aos-delay="500" class="container">
<div class="row">
<div class="col">
<div class="card col-md-6 col-lg-6 col-xl-8">
<div class="card-header" style="color: white;">
<h2>Verification Completed !!</h2>
</div>
<lottie-player style="display: -webkit-box;-webkit-box-pack: center;" autoplay background="transparent" class="icon" loop speed="1"
src="https://assets10.lottiefiles.com/private_files/lf30_hlzxxlfs.json"></lottie-player>
<div class="card-body">
<h6 class="card-text" style="color: #dedede;">Your Email Has Been Verified !! Please Sign in
Using the button
below..</h6>
<br style="display: block;content: ' ';margin: 1vw 0;line-height: 1vw;">
<a class="btn btn-primary" href="login.html">Sign in</a>
</div>
</div>
</div>
</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>
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
</body>
</html>

View file

@ -0,0 +1,161 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta name="theme-color" content="#2f0001">
<link href="assets/favicon.webp" rel="shortcut icon" type="image/webp" />
<title>Register</title>
<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://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://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
background-color: #1b1c1e;
}
.nav-color {
background-color: #212226;
}
.nav-radius {
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}
.card {
position: center;
margin: auto;
text-align: center;
border-radius: 20px;
background-color: #212226;
}
.icon {
position: center;
margin: auto;
width: 70%;
height: 70%;
}
@media screen and (max-width: 766px) {
.card h2 {
font-size: 7vw;
}
.card h5 {
font-size: 5vw;
}
.navbar-brand {
width: 11vw;
height: 11vw;
}
}
@media screen and (min-width: 767px) {
.card h2 {
font-size: 4vw;
}
.card h5 {
font-size: 2vw;
}
.navbar-brand {
width: 8vw;
height: 8vw;
}
}
@media screen and (min-width: 993px) {
.card h2 {
font-size: 3vw;
}
.card h5 {
font-size: 1.3vw;
}
.navbar-brand {
width: 6vw;
height: 6vw;
}
}
@media screen and (min-width: 1400px) {
.card h2 {
font-size: 4vw;
}
.card h5 {
font-size: 2vw;
}
.navbar-brand {
width: 6vw;
height: 6vw;
}
: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-dark nav-color ml-5 mr-5 nav-radius">
<a href="/"><img alt="Banner" class="navbar-brand lazyload" src="assets/logo_transparent.webp" style="margin-top: 0%;"></a>
<ul class="navbar-nav">
<li class="nav-item">
<a style="color: white; font-size: 16pt;">Register</a>
</li>
</ul>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01"></div>
</nav>
<br>
<div data-aos="fade-in" data-aos-delay="500" class="container">
<div class="row">
<div class="col">
<div class="card col-md-6 col-lg-6 col-xl-8">
<div class="card-header" style="color: white;">
<h2>Verify Your Email Address</h2>
</div>
<lottie-player style="display: -webkit-box;-webkit-box-pack: center;" autoplay background="transparent" class="icon" loop speed="1"
src="https://assets1.lottiefiles.com/packages/lf20_IUWMcw.json"></lottie-player>
<div class="card-body">
<h5 class="card-text" style="color: #dedede;">Before proceeding, please check your email for a
verification link
to verify your email address.</h5>
</div>
</div>
</div>
</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>
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
</body>
</html>

296
views/pages/register.ejs Normal file
View file

@ -0,0 +1,296 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta name="theme-color" content="#2f0001">
<link href="assets/favicon.webp" rel="shortcut icon" type="image/webp" />
<title>Register</title>
<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://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">
<script src="https://unpkg.com/feather-icons"></script>
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
background-color: #1b1c1e;
}
.input-group-text {
background-color: #212226;
color: white;
}
.form-control {
background-color: #212226;
color: white;
}
.form-control:valid {
background-color: #212226;
color: white;
}
.form-control:invalid {
background-color: #2f0001;
color: white;
}
.nav-color {
background-color: #212226;
}
.nav-radius {
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}
.btn-register {
width: 100%;
background-color: darkred;
border-color: darkred;
border-radius: 100px;
}
.btn-register:hover {
background-color: red;
border-color: red;
}
.hoversignin-1 a {
color: white;
background-color: transparent;
position: center;
margin: auto;
text-align: center;
}
.hoversignin-1 a:hover {
background-color: transparent;
color: red;
text-decoration: underline;
}
.card {
position: center;
margin: auto;
text-align: center;
border-radius: 20px;
background-color: #212226;
}
.icon {
position: center;
margin: auto;
width: 80%;
height: 80%;
}
@media screen and (max-width: 426px) {
.card a,
input {
font-size: 3vw;
}
.card-header {
font-size: 6vw;
}
.navbar-brand {
width: 15vw;
height: 15vw;
}
}
@media screen and (min-width: 427px) {
.card a,
input {
font-size: 2vw;
}
.card-header {
font-size: 5vw;
}
.navbar-brand {
width: 11vw;
height: 11vw;
}
}
@media screen and (min-width: 767px) {
.card a,
input {
font-size: 2vw;
}
.card-header {
font-size: 4vw;
}
.navbar-brand {
width: 8vw;
height: 8vw;
}
}
@media screen and (min-width: 993px) {
.card a,
input {
font-size: 1vw;
}
.card-header {
font-size: 2.5vw;
}
.navbar-brand {
width: 6vw;
height: 6vw;
}
}
@media screen and (min-width: 1400px) {
.card a,
input {
font-size: 1vw;
}
.card-header {
font-size: 2.5vw;
}
.navbar-brand {
width: 6vw;
height: 6vw;
}
: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-dark nav-color ml-5 mr-5 nav-radius">
<a href="/"><img alt="Banner" class="navbar-brand lazyload" src="assets/logo_transparent.webp" style="margin-top: 0%;"></a>
<ul class="navbar-nav">
<li class="nav-item">
<a style="color: white; font-size: 16pt;">Register</a>
</li>
</ul>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01"></div>
</nav>
<br>
<div class="container" data-aos="fade-in" data-aos-delay="500">
<div class="row">
<div class="col">
<div class="card text-white col-md-8 col-lg-6 col-xl-5">
<h1 class="card-header text-white">Register</h1>
<lottie-player style="display: -webkit-box;-webkit-box-pack: center;" autoplay background="transparent" class="icon" loop speed="1"
src="https://assets10.lottiefiles.com/datafiles/JAmX1SNojoncImC/data.json"></lottie-player>
<div class="card-body">
<form class="px-4 py-3">
<div class="form-group">
<input class="form-control input-sm text-center" id="first_name" name="first_name"
placeholder="First Name" type="text">
</div>
<div class="form-group">
<input class="form-control input-sm text-center" id="last_name" name="last_name"
placeholder="Last Name" type="text">
</div>
<div class="form-group">
<input class="form-control text-center" id="birthDate" style="color: gray" type="date">
</div>
<div class="form-group">
<input class="form-control input-sm text-center" id="email" name="email"
placeholder="Email Address" type="email">
</div>
<div class="form-group">
<div class="input-group">
<input class="form-control input-sm text-center" id="password" name="password"
placeholder="Password" type="password">
<div class="input-group-append">
<span class="input-group-text">
<i class="fa fa-eye" onclick="revealhidePassword()"></i>
</span>
</div>
</div>
</div>
<div class="form-group">
<div class="input-group">
<input class="form-control input-sm text-center" id="password_confirmation"
name="password_confirmation" placeholder="Confirm Password" type="password">
<div class="input-group-append">
<span class="input-group-text">
<i class="fa fa-eye" onclick="revealhideConfirmationPassword()"></i>
</span>
</div>
</div>
</div>
<a class="btn btn-register btn-primary" type="submit"
href="register-verification-sent.html">Register</a>
<br style="display: block;content: ' '; margin: 1vw 0; line-height: 1vw;">
<div class="hoversignin-1 text-center">
<a href="login.html">Already have an account ?? Click here to Sign In !!</a>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script>
function revealhidePassword() {
const x = document.getElementById("password");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
function revealhideConfirmationPassword() {
const x = document.getElementById("password_confirmation");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
</script>
<script>
feather.replace()
</script>
<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>
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
</body>
</html>