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

Initial commit

Browse Source
This commit is contained in:
Janis M
2022-03-26 11:26:10 +01:00
commit bfe995158e
18 changed files with 2843 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
views/search.ejs Normal file
View File

@@ -0,0 +1,102 @@
<!DOCTYPE html>
<html lang="en">
<head>
<%- include('partials/head'); %>
</head>
<body>
<header>
<%- include('partials/header'); %>
</header>
<div class="allProductsDIV">
<% for(var i=0; i < products.length; i++) { var prod = products[i]; %>
<div class="productDIV">
<h4><%=prod.name %></h4>
<div class="productImage">
<img src="<%= prod.src %>">
</div>
<div class="productInfo"><%=prod.desc %></div>
</div>
<% } %>
</div>
</body>
</html>
<style type="text/css">
.productDIV > img {
position: absolute;
margin: auto;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.productDIV > .productImage {
width: calc(50% - 15px);
height: calc(100% - 120px);
position: absolute;
background-color: red;
left: 10px;
bottom: 10px;
}
.productDIV > .productInfo {
width: calc(50% - 15px);
height: calc(100% - 120px);
position: absolute;
overflow-y: hidden;
background-color: blue;
right: 10px;
bottom: 10px;
}
.productDIV > h4 {
padding: 0px;
margin: 0px;
}
.productDIV {
font-size: 16px;
margin: 10px;
padding: 5px;
display: inline-block;
background-color: white;
border-style: solid;
border-width: 2px;
position: relative;
height: 250px;
}
.allProductsDIV {
font-size: 0;
margin: 0px;
width: calc(80% - 20px);
left: 10%;
position: absolute;
height: 100%;
padding: 10px;
background-color: white;
display: grid;
}
@media (max-width: 400px) {
.allProductsDIV {
grid-template-columns: 1fr;
}
}
@media (min-width: 800px) {
.allProductsDIV {
grid-template-columns: 1fr 1fr;
}
}
@media (min-width: 1200px) {
.allProductsDIV {
grid-template-columns: 1fr 1fr 1fr;
}
}
</style>