janis/shop-ejs-expressjs
1
0
Fork 0
mirror of https://github.com/DerTyp7/shop-ejs-expressjs.git synced 2025-10-29 12:32:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

ganz viel merge und so

Browse Source
This commit is contained in:
Janis M
2022-03-28 14:03:53 +02:00
parent 3ff13bfd25
commit a0f059d955
16 changed files with 613 additions and 235 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
index.js
View File

@@ -23,6 +23,32 @@ app.use(bodyParser.json());
app.use(express.static(__dirname + "/static"));
// Authentication Handlers
// Check if user is authenticated and NO redirect
function authNoRedirectHandler(req, res, next){
const authcookie = req.cookies.authcookie; // Get authcookie from cookie
jwt.verify(authcookie, SECRET_KEY, (err, data) =>{ // Verify authcookie
if(err){ // If authcookie is invalid
console.log(err);
next();
} else if(data.user){ // If authcookie is valid
req.user = data.user; // Set user to data.user
mysql_handler.con.query(`SELECT * FROM users WHERE id = "${req.user}"`, (err, result) => { // Get user from database
if(err) console.log(err);
let user = JSON.parse(JSON.stringify(result))[0]; // Parse user from database
// Set user to req.user
req.isAdmin = user.isAdmin;
req.username = user.username;
req.firstname = user.firstname;
req.lastname = user.lastname;
next(); // Continue to next handler
});
}
});
}
// Check if user is authenticated and redirect to login if not
function authenticatedHandler(req, res, next){
const authcookie = req.cookies.authcookie; // Get authcookie from cookie
@@ -62,32 +88,70 @@ function notAuthenticatedHandler(req, res, next){
}
// Homepage
app.get("/", authenticatedHandler, (req, res) => {
let dict = {
title: "Hallo",
isAdmin: req.isAdmin
}
app.get("/", authNoRedirectHandler, (req, res) => {
mysql_handler.con.query("SELECT * FROM products", function(err, result){
if(err) throw err;
res.render('index', dict)
let dict = {
title: "Startseite",
user: req.user,
products: JSON.parse(JSON.stringify(result))
}
res.render('index', dict)
});
});
// Product Page
app.get("/product/:productId", (req, res) => {
let productId = req.params.productId;
console.log(productId);
mysql_handler.con.query(`SELECT * FROM products WHERE id=${productId}` , function(err, result){
mysql_handler.con.query(`SELECT s.name AS sellerName, p.name AS productName, p.description AS productDescription, p.id AS id, price,quantity, delivery_time, p.categoryId
FROM products AS p LEFT JOIN sellers AS s ON p.sellerId= s.id WHERE p.id=${productId}` , function(err, result){
if(err) throw err;
let product = JSON.parse(JSON.stringify(result))[0];
let dict = {
title: "product",
product: product
}
res.render('product', dict)
mysql_handler.con.query(`SELECT title, content ,rating, u.username AS name FROM reviews AS r LEFT JOIN users AS u ON r.userId = u.id WHERE productId=${productId}`,function(err,result){
if(err) throw err;
let reviews = JSON.parse(JSON.stringify(result));
console.log(product)
mysql_handler.con.query(`SELECT * FROM categories WHERE id='${product.categoryId}'`,function(err,result){
if(err) throw err;
let category = JSON.parse(JSON.stringify(result))[0];
let dict = {
title: product.productName,
product: product,
shippingDays: 3,
stockAmount: 50,
productDescription: "ez",
loggedIn: true,
reviews: reviews,
category: category,
}
res.render('product', dict)
});
});
});
});
// Reviews
app.post("/review/create/:productId", authenticatedHandler,(req, res) => {
let productId = req.params.productId;
let rating = req.body.rating;
let title = req.body.title;
let content = req.body.content;
mysql_handler.con.query(`INSERT INTO reviews(title, content, rating, userId, productId)
VALUES('${title}', '${content}', '${rating}', (SELECT id FROM users WHERE id = ${req.user}), (SELECT id FROM products WHERE id = ${productId}))`, (err, result) => {
if(err) throw err;
res.redirect("/product/" + productId);
});
});
// Search Page
app.get("/search", (req, res) => {
var products = [
@@ -304,4 +368,4 @@ app.post("/auth/login", notAuthenticatedHandler, (req, res) =>{
app.listen(port, () =>{ // Start server
console.log("Listining to " + port)
})
});

0
static/auth.css → static/css/auth.css
View File

92
static/css/header.css Normal file
View File

@@ -0,0 +1,92 @@
/* UTIL */
.vertical-center {
float: left;
top: 50%;
position: relative;
transform: translateY(-50%);
}
body {
margin: 0;
}
/* BACKGROUND */
.headerDIV > div {
height: 100%;
text-align: center;
display: inline-block;
vertical-align: top;
}
/* LOGO PART */
.headerDIVLogo {
width: 20%;
}
.headerDIVLogo > img {
float: left;
height: 80%;
position: relative;
top: 10%;
}
/* SEARCH PART */
.headerDIVSearch {
width: 60%;
}
.headerDIVSearch > input {
left: 10%;
width: calc(80% - 60px);
border-radius: 5px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
height: 20px;
padding: 3px 10px;
}
.headerDIVSearch > button {
width: 40px;
left: 10%;
border-radius: 5px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
height: 30px;
}
/* BUTTON PART */
.headerDIVButton {
width: 20%;
}
.headerDIVButton > button {
height: 30px;
float: right;
margin-right: 10px;
height: 35px;
border-radius: 5px;
border: 3px solid rgb(6, 70, 107);
background-color: rgb(0, 99, 156);
transition: 0.1s;
transition-timing-function: linear;
cursor: pointer;
color:white;
font-weight: bold;
}
#headerBtnLogout{
background-color: rgb(172, 38, 38);
border-color: rgb(145, 35, 35);
}
#headerBtnLogout:hover{
background-color: rgb(206, 50, 50);
}
.headerDIVButton > button:hover {
background-color: rgb(23, 114, 167);
}
.headerDIV {
width: 100%;
height: 65px;
background-color: #414854;
margin: 0;
}

16
static/order.css → static/css/order.css
View File

@@ -3,8 +3,15 @@
margin-left: auto;
margin-right: auto;
width: 500px;
margin-top: 60px;
margin-bottom: 60px;
}
#order-info p{
height: 30px;
}
form input[type="submit"]{
color: rgb(255, 255, 255);
font-weight: bold;
@@ -27,4 +34,13 @@ form input[type="submit"]{
h3{
text-align: center;
}
hr{
width: 100%;
border: 0px;
background-color:rgba(51, 51, 51, 0.337);
height: 2px;
margin-top: 20px;
margin-bottom: 20px;
}

238
static/css/product.css Normal file
View File

@@ -0,0 +1,238 @@
*{
padding:0;
}
h1, h2{
margin-left: 0px;
text-align: left;
padding-bottom: 0;
margin-bottom: 0px;
}
.seller{
display: block;
height: 30px;
margin-top:10px;
padding: 0;
font-weight: bold;
font-size: 10pt;
}
.badge{
background-color: rgb(224, 224, 224);
color: black;
height: 15px;
padding-left: 3px;
padding-right: 3px;
font-size: 9pt;
display: block;
margin-top: -5;
border-radius: 5px;
padding-top: 0;
padding-bottom: 0;
margin-top: -10px;
border: 2px solid rgb(143, 143, 143);
float:left;
}
#content
{
width: 1000px;
height:3000px;
background-color: rgb(244, 244, 244);
margin:auto;
padding-top: 10px;
}
#productPicture
{
width: 40%;
height: 400px;
/*background-color: rgb(85, 85, 85);*/
display: block;
float: left;
border-bottom: 2px solid rgb(104, 117, 151);
}
#productPicture img
{
width: 90%;
display: block;
}
#info
{
width: 60%;
height: 400px;
display: block;
float: right;
/*background-color: rgb(121, 170, 182);*/
border-bottom: 2px solid rgb(104, 117, 151);;
}
.order-button{
color: rgb(255, 255, 255);
font-weight: bold;
letter-spacing: 1.5px;
padding-left: 20px;
padding-right: 20px;
display:block;
float:left;
height: 35px;
border-radius: 5px;
border: 2px solid rgb(0, 99, 156);
background-color: rgb(0, 99, 156);
transition: 0.1s;
transition-timing-function: linear;
outline: none !important;
cursor:pointer;
margin-right: 30px;
margin-top: 10px;
}
#description
{
width: 100%;
display: block;
float: left;
background-color: rgba(103, 187, 183, 0);
border-bottom: 2px solid rgb(104, 117, 151);
}
#description p,h2 {
padding-left: 30px;
padding-right: 30px;
}
#newReview{
width: 100%;
display: block;
float: left;
background-color: rgba(45, 66, 94, 0);
padding-bottom: 20px;
border-bottom: 2px solid rgb(104, 117, 151);;
}
#reviews{
width: 100%;
height: 1600px;
display: block;
float: left;
background-color: rgba(39, 39, 39, 0);
}
#reviewTemplate
{
width: 100%;
float: left;
margin-bottom: 20px;
}
#reviewTemplatePicture
{
width: 200px;
height: 200px;
display: block;
float: left;
background-color: rgb(85, 158, 255);
}
#data
{
width: 100%;
height: 50px;
display: block;
float: left;
background-color: rgb(124, 142, 212);
}
#text
{
width: 100%;
height: 150px;
display: block;
float: left;
background-color: rgb(211, 196, 247);
}
#reviewTemplateText
{
background-color: rgb(235, 196, 228);
}
form{
display:block;
margin-left: auto;
margin-right: auto;
width: 500px;
}
form label{
display:block;
margin-left: auto;
margin-right: auto;
width: 80%;
margin-top: 20px;
}
form label p{
width: 100%;
display:block;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
font-weight: bold;
letter-spacing: 1.5px;
}
form label input{
width: 100%;
display:block;
margin-left: auto;
margin-right: auto;
height: 35px;
border-radius: 5px;
border: 2px solid rgb(0, 99, 156);
background-color: rgb(255, 255, 255);
transition: 0.1s;
transition-timing-function: linear;
outline: none !important;
}
/* Submit button with blue background horizontal center*/
form input[type="submit"]{
color: rgb(255, 255, 255);
font-weight: bold;
letter-spacing: 1.5px;
width: 100%;
display:block;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
height: 35px;
border-radius: 5px;
border: 2px solid rgb(0, 99, 156);
background-color: rgb(0, 99, 156);
transition: 0.1s;
transition-timing-function: linear;
outline: none !important;
cursor:pointer;
}
/* Hover */
form label input:hover{
border: 2px solid rgb(1, 197, 246);
}
form label input:focus{
border: 2px solid rgb(1, 197, 246);
box-shadow: 0 0 5px #719ece62;
}
form input[type="submit"]:hover{
border: 2px solid rgb(7, 130, 200);
background-color: rgb(7, 130, 200);
}
textarea{
resize: vertical;
width: 100%;
display:block;
margin-left: auto;
margin-right: auto;
}

7
static/style.css → static/css/style.css
View File

@@ -2,10 +2,17 @@
font-family: Arial, Helvetica, sans-serif;
}
html,body{
min-height: 100% !important;
height: 100%;
}
h1{
text-align: center;
}
#error-text{
color: red;
font-weight: bold;

BIN
static/images/examples.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 113 KiB

105
views/index.ejs
View File

@@ -1,10 +1,103 @@
<!DOCTYPE html>
<html lang="en">
<head>
<%- include('partials/head'); %>
<html lang="en" style="">
<head>
<%- include('partials/head'); %>
</head>
<body>
<h1>isAdmin: <%= isAdmin %></h1>
<body style="">
<%- include('partials/header'); %>
<style>
html {
height: 100%;
overflow-x: auto;
overflow-y: scroll;
margin: 0;
background-color: white;
}
body {
min-height: 100%;
}
.grid-container {
display: flex;
gap: 20px;
margin: 0 auto;
grid-template-columns: auto auto auto auto;
padding: 20px;
}
.grid-item {
background-color: white;
border: 10px;
border-color: rgba(111,111,111,0.2) transparent transparent;
padding: 20px;
font-size: 20px;
height: 320px;
width: 280px;
text-align: left;
}
.grid-item p{
display:block;
height: 50px;
}
.middle-content {
background: linear-gradient(to bottom left, #313c48, white);
background-repeat: no-repeat;
width: 80%;
margin: auto;
margin-top: 50px;
}
</style>
<div class="middle-content">
<div id="headlineTop">
<h2 style="padding-left:20px; padding-top:50px">Top Angebote</h2>
</div>
<div class="grid-container" >
<% for (let i=0; i < products.length && i <=4; i++){ %>
<div class="grid-item">
<p><%= products[i].name %></p>
<img src="https://m.media-amazon.com/images/I/815eDw--FQS._AC_SL1500_.jpg" style='height: 100%; width: 100%; object-fit: contain' onclick="window.open('/product/<%- products[i].id%>','_self')">
</div>
<%}%>
</div>
<div id="headlineTop">
<h2 style="padding-left:20px;">Unsere Empfehlungen für Sie</h2>
</div>
<div class="grid-container">
<div class="grid-item">
<% let randomNr = Math.floor(Math.random() * products.length); %>
<%= products[randomNr].name %>
<img src="https://m.media-amazon.com/images/I/815eDw--FQS._AC_SL1500_.jpg" style='height: 100%; width: 100%; object-fit: contain' onclick="window.open('/product/<%- products[randomNr].id%>','_self')">
</div>
<div class="grid-item">
<% let randomNr2 = Math.floor(Math.random() * products.length); %>
<%= products[randomNr2].name %>
<img src="https://m.media-amazon.com/images/I/815eDw--FQS._AC_SL1500_.jpg" style='height: 100%; width: 100%; object-fit: contain' onclick="window.open('/product/"<%- products[randomNr2].id%>','_self')">
</div>
<div class="grid-item">
<% let randomNr3 = Math.floor(Math.random() * products.length); %>
<%= products[randomNr3].name %>
<img src="https://m.media-amazon.com/images/I/815eDw--FQS._AC_SL1500_.jpg" style='height: 100%; width: 100%; object-fit: contain' onclick="window.open('/product/"<%- products[randomNr3].id%>','_self')">
</div>
<div class="grid-item">
<% let randomNr4 = Math.floor(Math.random() * products.length); %>
<%= products[randomNr4].name %>
<img src="https://m.media-amazon.com/images/I/815eDw--FQS._AC_SL1500_.jpg" style='height: 100%; width: 100%; object-fit: contain' onclick="window.open('/product/"<%- products[randomNr4].id%>','_self')">
</div>
</div>
<div class="grid-container" style="margin-bottom: 100px;">
<% for (let i=0; i < products.length && i <=4; i++){ %>
<div class="grid-item">
<%= products[i].name %>
<img src="https://m.media-amazon.com/images/I/815eDw--FQS._AC_SL1500_.jpg" style='height: 100%; width: 100%; object-fit: contain' onclick="window.open('/product/<%- products[i].id%>','_self')">
</div>
<%}%>
</div>
</div>
<%- include('partials/footer'); %>
</body>
</html>

2
views/login.ejs
View File

@@ -2,7 +2,7 @@
<html lang="en">
<head>
<%- include('partials/head'); %>
<link rel="stylesheet" href="/auth.css">
<link rel="stylesheet" href="/css/auth.css">
</head>
<body>
<h1>Login</h1>

7
views/order.ejs
View File

@@ -2,9 +2,10 @@
<html lang="en">
<head>
<%- include('partials/head'); %>
<link rel="stylesheet" href="/order.css">
<link rel="stylesheet" href="/css/order.css">
</head>
<body>
<%- include('partials/header'); %>
<h1>Ihre Bestellung</h1>
<p id="error-text"><%- error %></p>
@@ -19,10 +20,12 @@
<!--submit button-->
<form action="/order" method="POST">
<input hidden type="text" name="productId" value="<%= product.id %>">
<input hidden type="text" name="quantity" value="<%= quantity %>">
<input hidden type="text" name="quantity" value="<%= quantity %>">
<!-- Price is calculated on backend ;) -->
<input type="submit" value="Bestellen">
</form>
</body>
</html>

2
views/order_success.ejs
View File

@@ -2,7 +2,7 @@
<html lang="en">
<head>
<%- include('partials/head'); %>
<link rel="stylesheet" href="/order.css">
<link rel="stylesheet" href="/css/order.css">
</head>
<body>
<h1 style="color:rgb(6, 170, 6)">Ihre Bestellung wurde in Auftrag gegeben!</h1>

7
views/partials/footer.ejs
View File

@@ -7,10 +7,11 @@
<style type="text/css">
.footerDIV {
width: 100%;
height:65px;
position: absolute;
bottom:-65px;
background-color: #414854;
clear: both;
position: relative;
height: 65px;
margin-top: -56px;
}
/* LOGO PART */
.footerDIVLogo {

3
views/partials/head.ejs
View File

@@ -3,4 +3,5 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shop - <%= title %></title>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="/css/header.css">
<link rel="stylesheet" href="/css/style.css">

86
views/partials/header.ejs
View File

@@ -1,82 +1,16 @@
<div class="headerDIV">
<div class="headerDIVLogo">
<div class="headerDIVLogo" style="cursor:pointer"onclick="window.open('/', '_self')">
<img src="https://bock-drauf.com/wp-content/uploads/2019/09/amazon-logo-1024x576.png">
</div><div class="headerDIVSearch">
<input placeholder="Suche" class="vertical-center"></input
><button class="vertical-center"><i class="material-icons">search</i></button>
</div><div class="headerDIVLogin">
<button class="vertical-center">Login</button>
</div><div class="headerDIVButton">
<% if(user){ %>
<button class="vertical-center" id="headerBtnLogout" onclick="window.open('/logout', '_self')">Log out</button>
<button class="vertical-center" onclick="window.open('/account', '_self')">Ihr Konto</button>
<%} else{%>
<button class="vertical-center" onclick="window.open('/register', '_self')">Registrieren</button>
<button class="vertical-center" onclick="window.open('/login', '_self')">Login</button>
<% } %>
</div>
</div>
<style type="text/css">
/* UTIL */
.vertical-center {
float: left;
top: 50%;
position: relative;
transform: translateY(-50%);
}
body {
margin: 0;
}
/* BACKGROUND */
.headerDIV > div {
height: 100%;
text-align: center;
display: inline-block;
vertical-align: top;
}
/* LOGO PART */
.headerDIVLogo {
width: 20%;
}
.headerDIVLogo > img {
float: left;
height: 80%;
position: relative;
top: 10%;
}
/* SEARCH PART */
.headerDIVSearch {
width: 60%;
}
.headerDIVSearch > input {
left: 10%;
width: calc(80% - 60px);
border-radius: 5px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
height: 20px;
padding: 3px 10px;
}
.headerDIVSearch > button {
width: 40px;
left: 10%;
border-radius: 5px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
height: 30px;
}
/* LOGIN PART */
.headerDIVLogin {
width: 20%;
}
.headerDIVLogin > button {
height: 30px;
float: right;
margin-right: 10px;
}
.headerDIV {
width: 100%;
height: 65px;
background-color: #414854;
margin: 0;
}
</style>
</div>

189
views/product.ejs
View File

@@ -2,6 +2,7 @@
<html lang="en">
<head>
<%- include('partials/head'); %>
<link rel="stylesheet" href="/css/product.css">
</head>
<body>
@@ -13,156 +14,84 @@
<div id="top">
<div id="productPicture">
<!--BILD-->
<img src="/images/examples.jpg" alt="">
</div>
<div id="info">
<h1 id="title"><%= product.name %></h1>
<h2><%= product.productName %></h2><br>
<p class="badge">Nr.:<%= product.id %></p><br>
<p class="seller">Verkäufer: <%= product.sellerName%></p><br>
<p class="product-detail"><b>Preis:</b> <%= product.price %> € / Stück</h2>
<p class="product-detail"><b>Kategorie:</b> <%= category.name %></h2>
<p style="word-wrap: break-word;"></p>
<div>
<label style="margin-right: 30px; margin-left: 30px;
<% if(stockAmount > 0){%>
color: green;">
lieferbar in <%= shippingDays %> - <%= shippingDays + 1 %> Tagen</label>
<span><input type="number" id="quantity" min="1" max="<%= stockAmount %>" style="width: 30px;" value="1" ></span>
<label>/<%= stockAmount %></label>
<% } else { %>
color: red;">
nicht lieferbar</label>
<% } %>
<label style="margin-right: 30px; margin-left: 0px;
<% if(product.quantity > 0){%>
color: green;">
Lieferbar in <%= product.delivery_time %> - <%= product.delivery_time + 1 %> Tagen</label><br><br>
<div style=" float:right;">
<span><input type="number" id="quantity" min="1" max="<%= product.quantity %>" style="width: 30px; margin-left: 20px" value="1" ></span>
<label>/<%= product.quantity %></label><br>
<button class ="order-button"onclick="window.open('/order/<%= product.id %>/' + document.getElementById('quantity').value, '_self')">Bestellen</button>
</div>
<% } else { %>
color: red; font-weight:bold;">
Aktuell nicht lieferbar!</label>
<% } %>
</div>
</div>
</div>
<div id="description">
<h1 style="margin-left: 30px;">Beschreibung</h1>
<p style="margin-left: 30px;"><%= productDescription %></p>
<h2>Beschreibung</h2>
<p><%= product.productDescription %> </p>
</div>
<% if(loggedIn){ %>
<div id="newReview">
<h1 style="padding-left: 30px;">Bewertung</h1>
<textarea name="review" id="" cols="60" rows="5" style="margin-left: 30px; resize: none;"></textarea>
<button>Post</button>
<h2 style="padding-left: 30px;">Rezensionen</h2>
<form action="/review/create/<%= product.id %>" method="post">
<label for="title">
<p>Titel: </p>
<input type="text" name="title">
</label>
<label for="rating">
<p>Bewertung (0-10): </p>
<input type="number" name="rating" max="10" min="0">
</label>
<label for="content">
<textarea name="content" id="" max="500" cols="30" rows="10"></textarea>
</label>
<input style="width: 150px" type="submit" value="Senden">
</form>
</div>
<% } %>
<div id="reviews">
<% if(reviews > 0){ %>
<div id="reviewTemplate">
<div style="width: 100%; height: 200px; display: block; float: left;">
<div id= data >
<h3 style="padding-left: 30px; width: 100%;">187Boii 12.12.12 12:12</h3>
</div>
<div id="text" >
<p style="padding-left: 30px;";">junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text junge geiler text </p>
</div>
</div>
</div>
<% if(reviews.length > 0){ %>
<% for(let i = 0; i < reviews.length; i++){ %>
<div id="reviewTemplate">
<div style="width: 100%; display: block; float: left;">
<div id= data >
<h3 style="padding-left: 20px; float:left"><%= reviews[i].name %></h3>
<p style="float:right; padding-right: 20px;">Bewertung: <%= reviews[i].rating %></p>
</div>
<div id="text" >
<h3 style="padding-left: 20px; padding-right: 20px; width: 100%;"><%= reviews[i].title %></h3>
<p style="padding-left: 20px; padding-right: 20px;"><%= reviews[i].content %></p>
</div>
</div>
</div>
<% } %>
<% }else{ %>
<div style="width: 100%; height: 100px;">Leider hat dieses Produkt noch keine Bewertung. :(</div>
<% } %>
</div>
</div>
<style>
*{
padding:0;
}
#content
{
width: 1000px;
height:3000px;
background-color: rgb(59, 59, 59);
margin:auto;
}
#productPicture
{
width: 40%;
height: 400px;
background-color: rgb(85, 85, 85);
display: block;
float: left;
}
#info
{
width: 60%;
height: 400px;
display: block;
float: right;
background-color: rgb(121, 170, 182);
}
#description
{
width: 100%;
height: 250px;
display: block;
float: left;
background-color: rgb(103, 187, 183);
}
#title
{
margin-left: 30px;
}
#newReview{
width: 100%;
height: 200px;
display: block;
float: left;
background-color: rgb(45, 66, 94);
}
#reviews{
width: 100%;
height: 1600px;
display: block;
float: left;
background-color: rgb(39, 39, 39);
}
#reviewTemplate
{
width: 100%;
height: 200px;
float: left;
}
#reviewTemplatePicture
{
width: 200px;
height: 200px;
display: block;
float: left;
background-color: rgb(85, 158, 255);
}
#data
{
width: 100%;
height: 50px;
display: block;
float: left;
background-color: rgb(58, 94, 97);
}
#text
{
width: 100%;
height: 150px;
display: block;
float: left;
background-color: rgb(78, 129, 133);
}
#reviewTemplateText
{
background-color: rgb(235, 196, 228);
}
</style>
</div>
<%- include('partials/footer'); %>
</body>
</html>

2
views/register.ejs
View File

@@ -2,7 +2,7 @@
<html lang="en">
<head>
<%- include('partials/head'); %>
<link rel="stylesheet" href="/auth.css">
<link rel="stylesheet" href="/css/auth.css">
</head>
<body>
<h1>Register</h1>