impl. bonuspoints

This commit is contained in:
CodeSteak 2020-01-25 19:11:41 +01:00
parent 1d36c54e69
commit 5911bb2fd1
3 changed files with 93 additions and 1 deletions

View File

@ -140,6 +140,19 @@
.huge {
--u5: calc(3.375rem * 1.5 * 1.5 * 1.5 * 1.5 * 1.5);
--u4: calc(3.375rem * 1.5 * 1.5 * 1.5 * 1.5);
--u3: calc(3.375rem * 1.5 * 1.5 * 1.5);
--u2: calc(3.375rem * 1.5 * 1.5);
--u1: calc(3.375rem * 1.5);
--u0: calc(3.375rem);
--u-1: calc(3.375rem * 0.666);
--u-2: calc(3.375rem * 0.666 * 0.666);
--u-3: calc(3.375rem * 0.666 * 0.666 * 0.666);
--u-4: calc(3.375rem * 0.666 * 0.666 * 0.666 * 0.666);
}
.smaller {
--u5: calc(0.666em * 1.5 * 1.5 * 1.5 * 1.5 * 1.5);
--u4: calc(0.666em * 1.5 * 1.5 * 1.5 * 1.5);
@ -154,6 +167,7 @@
}
* {
margin: 0em;
padding: 0em;
@ -684,6 +698,27 @@ fieldset label {
min-width: 15rem;
}
.grid.xl > .spacer {
box-shadow: none;
margin: calc(var(--u0) * 2);
padding: 0px;
width: 80rem;
max-width: 80rem;
min-width: 30rem;
height: 0px;
padding: 0px;
}
.grid.xl > * {
width: 80rem;
max-width: 40rem;
min-width: 20rem;
}
.vertical-spacer.s {
min-height: 10rem;
}

View File

@ -0,0 +1,57 @@
<!DOCTYPE html>
<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=0.75, user-scalable=no">
<title>Bonusprogramm</title>
<link rel="stylesheet" th:href="@{/css/ecom.css}" />
</head>
<body>
<nav th:replace="/fragments/header :: header">Header</nav>
<div class="sidebar-layout content-width">
<nav></nav>
<div>
<h1>Bonusprogramm</h1>
</div>
</div>
<main class="sidebar-layout content-width">
<nav th:replace="/fragments/customer :: sidebar"></nav>
<div class="content-width">
<div class="grid xl">
<div class="card">
<h2> Ihr Bonuspunktestand beträgt: </h2>
<h1 class="huge"> 15 </h1>
</div>
<div class="s">
<h2> Bonuspunkte sichern </h2>
<p>
Sie sichern sich automatisch bei jedem Einkaufen pro Angefangenen
10 € einen Bonuspunkt.
</p>
<p>
Eine Übersicht ihrer Bonuspunkt finden sie hier auf dieser
Bonus.
</p>
<p>
Um die Bonuspunkte einzulösen hacken sie einfach
"Bonuspunkte" verwenden beim Abschließen der Bestellung
an. Für jeden Bonuspunkt wird ihnen 0,50 € gutgeschrieben.
</p>
</div>
<div class="s">
<img th:src="@{/img/undraw_gift.svg}"/>
</div>
<div class="spacer"></div>
<div class="spacer"></div>
<div class="spacer"></div>
</div>
</div>
</main>
<footer th:replace="/fragments/footer :: footer"></footer>
</body>
</html>

View File

@ -5,7 +5,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=0.75, user-scalable=no">
<title>Über uns</title>
<title>Einstellungen</title>
<link rel="stylesheet" th:href="@{/css/ecom.css}" />
</head>