From 0c4e9e83c40ee0aa3d3424f8e2d0a26f24a85908 Mon Sep 17 00:00:00 2001 From: Janis M Date: Tue, 29 Mar 2022 12:40:18 +0200 Subject: [PATCH] a --- static/css/auth_header.css | 34 ++++++++ static/css/header.css | 19 +++-- static/css/product.css | 53 +++--------- static/css/style.css | 33 +++++++- views/partials/auth_header.ejs | 6 ++ views/partials/footer.ejs | 32 +++---- views/partials/head.ejs | 3 +- views/partials/header.ejs | 4 +- views/product.ejs | 54 ++++++------ views/register.ejs | 147 +++++++++++++++++---------------- 10 files changed, 211 insertions(+), 174 deletions(-) create mode 100644 static/css/auth_header.css create mode 100644 views/partials/auth_header.ejs diff --git a/static/css/auth_header.css b/static/css/auth_header.css new file mode 100644 index 0000000..748cc23 --- /dev/null +++ b/static/css/auth_header.css @@ -0,0 +1,34 @@ +/* Header */ +.auth-header { + width: 100%; + display: block; + height: 50px; + background-color: rgb(97, 102, 141); + margin-top: 0px; + padding: 0px; +} + +.auth-header p{ + float:left; + color:white; + font-weight: bold; + font-size: 14pt; + padding:0; + margin-left: 10px; + margin-top: 14px; +} + +.auth-header .auth-header-image-container{ + display: block; + margin-left: auto; + margin-right: auto; + height: 45px; + width: 45px; + background-color: red; + padding-top: 2px; +} + +.auth-header .auth-header-image-container img{ + width: 100%; + height: 100%; +} diff --git a/static/css/header.css b/static/css/header.css index 7e85d4e..834382f 100644 --- a/static/css/header.css +++ b/static/css/header.css @@ -6,10 +6,6 @@ transform: translateY(-50%); } -body { - margin: 0; -} - /* BACKGROUND */ .headerDIV > div { height: 100%; @@ -20,13 +16,17 @@ body { /* LOGO PART */ .headerDIVLogo { - width: 35px; + width: 75px; } -.headerDIVLogo > img { + +.headerDIVLogo a { + width: 100%; + height: 100%; +} +.headerDIVLogo a img { + margin-top: 10px; float: left; - height: 80%; - position: relative; - top: 10%; + width: 100%; } /* SEARCH PART */ @@ -91,6 +91,7 @@ body { height: 65px; background-color: #414854; margin: 0; + display: block; } @media only screen and (max-width: 800px) { diff --git a/static/css/product.css b/static/css/product.css index 7dd5805..8a7c7b4 100644 --- a/static/css/product.css +++ b/static/css/product.css @@ -1,14 +1,3 @@ -*{ - padding:0; -} - -h1, h2{ - margin-left: 0px; - text-align: left; - padding-bottom: 0; - margin-bottom: 0px; -} - .seller{ display: block; height: 30px; @@ -34,13 +23,7 @@ h1, h2{ border: 2px solid rgb(143, 143, 143); float:left; } -#content -{ - width: 1000px; - background-color: rgb(244, 244, 244); - margin:auto; - padding-top: 10px; -} + #productPicture { width: 40%; @@ -110,7 +93,6 @@ h1, h2{ } #reviews{ width: 100%; - height: 1600px; display: block; float: left; background-color: rgba(39, 39, 39, 0); @@ -122,15 +104,6 @@ h1, h2{ float: left; margin-bottom: 20px; } -#reviewTemplatePicture -{ - width: 200px; - height: 200px; - display: block; - float: left; - background-color: rgb(85, 158, 255); -} - #data { @@ -154,14 +127,14 @@ h1, h2{ background-color: rgb(235, 196, 228); } -form{ +.form{ display:block; margin-left: auto; margin-right: auto; width: 500px; } -form label{ +.form label{ display:block; margin-left: auto; margin-right: auto; @@ -169,7 +142,7 @@ form label{ margin-top: 20px; } -form label p{ +.form label p{ width: 100%; display:block; margin-left: auto; @@ -178,7 +151,7 @@ form label p{ font-weight: bold; letter-spacing: 1.5px; } -form label input{ +.form label input{ width: 100%; display:block; margin-left: auto; @@ -192,7 +165,7 @@ form label input{ outline: none !important; } /* Submit button with blue background horizontal center*/ -form input[type="submit"]{ +.form input[type="submit"]{ color: rgb(255, 255, 255); font-weight: bold; letter-spacing: 1.5px; @@ -214,21 +187,21 @@ form input[type="submit"]{ /* Hover */ -form label input:hover{ +.form label input:hover{ border: 2px solid rgb(1, 197, 246); } -form label input:focus{ +.form label input:focus{ border: 2px solid rgb(1, 197, 246); box-shadow: 0 0 5px #719ece62; } -form input[type="submit"]:hover{ +.form input[type="submit"]:hover{ border: 2px solid rgb(7, 130, 200); background-color: rgb(7, 130, 200); } -textarea{ +.form textarea{ resize: vertical; width: 100%; display:block; @@ -237,9 +210,3 @@ textarea{ } -@media only screen and (max-width: 1030px) { - #content - { - width: 100%; - } - } \ No newline at end of file diff --git a/static/css/style.css b/static/css/style.css index 004bdb2..89a55d2 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -1,18 +1,26 @@ *{ font-family: Arial, Helvetica, sans-serif; + margin: 0; + padding: 0; } html,body{ min-height: 100% !important; - height: 100%; + height: 100% !important; + width: 100%; } -h1{ +h1, h2{ + margin-left: 0px; + text-align: left; + padding-bottom: 0; + margin-bottom: 0px; +} + +.text-center{ text-align: center; } - - #error-text{ color: red; font-weight: bold; @@ -35,4 +43,21 @@ h1{ margin-right: auto; display: block; padding-top: 10px; +} + +#content +{ + width: 1000px; + background-color: rgb(244, 244, 244); + margin-left: auto; + margin-right: auto; + padding-top: 10px; + padding-bottom: 20px; +} + +@media only screen and (max-width: 1030px) { + #content + { + width: 100%; + } } \ No newline at end of file diff --git a/views/partials/auth_header.ejs b/views/partials/auth_header.ejs new file mode 100644 index 0000000..3795db5 --- /dev/null +++ b/views/partials/auth_header.ejs @@ -0,0 +1,6 @@ +
+

OnlineShop | <%= title %>

+
+ +
+
\ No newline at end of file diff --git a/views/partials/footer.ejs b/views/partials/footer.ejs index 7b1df18..2d539fb 100644 --- a/views/partials/footer.ejs +++ b/views/partials/footer.ejs @@ -6,26 +6,26 @@ \ No newline at end of file diff --git a/views/partials/head.ejs b/views/partials/head.ejs index 58d93d6..f5330ea 100644 --- a/views/partials/head.ejs +++ b/views/partials/head.ejs @@ -4,4 +4,5 @@ Shop - <%= title %> - \ No newline at end of file + + \ No newline at end of file diff --git a/views/partials/header.ejs b/views/partials/header.ejs index ac5ba4b..15b9e19 100644 --- a/views/partials/header.ejs +++ b/views/partials/header.ejs @@ -1,6 +1,8 @@
diff --git a/views/product.ejs b/views/product.ejs index aa6775d..c21d19c 100644 --- a/views/product.ejs +++ b/views/product.ejs @@ -11,38 +11,36 @@
+
+ +
+
+

<%= product.productName %>


+

Nr.:<%= product.id %>


-
-
- -
-
-

<%= product.productName %>


-

Nr.:<%= product.id %>


+

Verkäufer: <%= product.sellerName%>


-

Verkäufer: <%= product.sellerName%>


+

Preis: <%= product.price %> € / Stück +

Kategorie: <%= category.name %> +

+
+

+
+ +
+ +
+ <% } else { %> + color: red; font-weight:bold;"> + Aktuell nicht lieferbar! + <% } %>
+

Beschreibung

@@ -51,7 +49,7 @@ <% if(loggedIn){ %>

Rezensionen

-
+