Merge pull request 'Komplette Version' (#3) from version_header into master
Reviewed-on: #3pull/4/head
commit
be6c118af7
|
@ -24,14 +24,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
@ -57,7 +67,7 @@
|
||||||
|
|
||||||
|
|
||||||
<h1 id="begrueßung_bestellung_abschließen">Bestellung abschließen</h1>
|
<h1 id="begrueßung_bestellung_abschließen">Bestellung abschließen</h1>
|
||||||
<div id="fehlerbox">test</div>
|
|
||||||
<form name="Bestellformular" >
|
<form name="Bestellformular" >
|
||||||
<table class="bestellung_tabelle">
|
<table class="bestellung_tabelle">
|
||||||
<tr>
|
<tr>
|
||||||
|
@ -108,6 +118,7 @@
|
||||||
|
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
<p id="tabellenbeschreibung">Die Felder mit einem * (Sternchen) sind Pflichtfelder.</p>
|
<p id="tabellenbeschreibung">Die Felder mit einem * (Sternchen) sind Pflichtfelder.</p>
|
||||||
<p id="gesamtkosten"><strong>Die Gesamtkosten (inkl. MwSt.)</br>belaufen sich auf: 5,30€</strong>
|
<p id="gesamtkosten"><strong>Die Gesamtkosten (inkl. MwSt.)</br>belaufen sich auf: 5,30€</strong>
|
||||||
|
@ -126,7 +137,7 @@
|
||||||
|
|
||||||
|
|
||||||
<div class="button_abschließen_position">
|
<div class="button_abschließen_position">
|
||||||
<p><a id="bestellbutton" class="button_abschließen" href="bestellung_erfolgreich.html" >Kostenpflichtig bestellen</a></p>
|
<p><a class="button_abschließen" onclick="checkform()" href="bestellung_erfolgreich.html" >Kostenpflichtig bestellen</a></p>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -22,14 +22,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
@ -52,7 +62,6 @@
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<br/> <br/> <br/> <br/> <br/> <br/> <br/>
|
<br/> <br/> <br/> <br/> <br/> <br/> <br/>
|
||||||
<p style="font-size: 30px"> Bestellung erfolgreich abgeschlossen</p>
|
<p style="font-size: 30px"> Bestellung erfolgreich abgeschlossen</p>
|
||||||
|
|
|
@ -22,14 +22,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
|
||||||
/* DESKTOP Version T4Web 0.1 */
|
/* DESKTOP Version T4Web 0.1 */
|
||||||
|
|
||||||
/* NONE FROM MOBILE */
|
/* NONE FROM MOBILE */
|
||||||
|
@ -5,15 +6,17 @@
|
||||||
.header_mobile {
|
.header_mobile {
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header_mobilelogo {
|
.header_mobilelogo {
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-mobile{
|
.navbar-mobile{
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#greeting-mobile {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
/* ALL-FORMAT */
|
/* ALL-FORMAT */
|
||||||
|
|
||||||
* {
|
* {
|
||||||
|
@ -509,9 +512,3 @@ label {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
#fehlerbox {
|
|
||||||
text-align: center;
|
|
||||||
display: none;
|
|
||||||
color: red;
|
|
||||||
}
|
|
|
@ -19,6 +19,22 @@
|
||||||
display:none;
|
display:none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#aktuelle_auswahl {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.beispiel_produkte {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button_produkte {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#greeting-desktop {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
/* ALL-FORMAT */
|
/* ALL-FORMAT */
|
||||||
|
|
||||||
* {
|
* {
|
||||||
|
@ -64,13 +80,8 @@
|
||||||
|
|
||||||
.navbar-mobile {
|
.navbar-mobile {
|
||||||
display:grid;
|
display:grid;
|
||||||
grid-template-columns: 380px auto;
|
grid-template-columns: 60px auto auto;
|
||||||
background-image: url('../pictures/mobile_header.png');
|
grid-template-rows: 60px;
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center;
|
|
||||||
background-size: cover;
|
|
||||||
position: sticky;
|
|
||||||
height: 60px;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
.navbar-mobile .nav-container a {
|
.navbar-mobile .nav-container a {
|
||||||
|
@ -86,16 +97,15 @@
|
||||||
color: #f4eb49;
|
color: #f4eb49;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*.nav-container {
|
.nav-container {
|
||||||
|
background-color: #476B1C;
|
||||||
}*/
|
}
|
||||||
|
|
||||||
.nav-container .checkbox {
|
.nav-container .checkbox {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
width: 60px;
|
width: 60px;
|
||||||
background: #476B1C;
|
|
||||||
top: 0px;
|
top: 0px;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
|
@ -104,10 +114,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-container .hamburger-lines {
|
.nav-container .hamburger-lines {
|
||||||
height: 26px;
|
height: 30px;
|
||||||
width: 32px;
|
width: 36px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 17px;
|
top: 20px;
|
||||||
left: 20px;
|
left: 20px;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -117,7 +127,7 @@
|
||||||
|
|
||||||
.nav-container .hamburger-lines .line {
|
.nav-container .hamburger-lines .line {
|
||||||
display: block;
|
display: block;
|
||||||
height: 6px;
|
height: 7px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-radius: 0px;
|
border-radius: 0px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
@ -142,7 +152,7 @@
|
||||||
padding-top: 15px;
|
padding-top: 15px;
|
||||||
background-color: #476B1C;
|
background-color: #476B1C;
|
||||||
height: 35vh;
|
height: 35vh;
|
||||||
width: 80%;
|
width: 380%;
|
||||||
transform: translate(-150%);
|
transform: translate(-150%);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
@ -189,10 +199,27 @@
|
||||||
|
|
||||||
/* HEADER-FORMAT */
|
/* HEADER-FORMAT */
|
||||||
|
|
||||||
header {
|
#header-mobile-farbe {
|
||||||
background-color: #9BB558;
|
background-color: #9BB558;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header-mobile-text h1 {
|
||||||
|
margin-left: 2%;
|
||||||
|
font-size:1.0em;
|
||||||
|
margin-top:0.5em;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-mobile-text p {
|
||||||
|
margin-left: 2%;
|
||||||
|
font-size:0.8em;
|
||||||
|
margin-top:-0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-mobile-logo {
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
|
||||||
/* CONTENT-FORMAT */
|
/* CONTENT-FORMAT */
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
|
@ -247,19 +274,6 @@
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.button_produkte {
|
|
||||||
background-color: #476B1C;
|
|
||||||
color: white;
|
|
||||||
padding: 5px 20px;
|
|
||||||
border-radius: 15px;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 1em;
|
|
||||||
cursor: pointer;
|
|
||||||
margin-left: -1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
a:hover {
|
||||||
color:#f4eb49;
|
color:#f4eb49;
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,14 +22,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -22,14 +22,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -21,14 +21,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
@ -62,15 +72,15 @@
|
||||||
|
|
||||||
<table>
|
<table>
|
||||||
<tr>
|
<tr>
|
||||||
<td><img src="pictures/FoodAmpel_rot.png"></td>
|
<td><img src="pictures/foodampel_rot.png"></td>
|
||||||
<td>muss sofort verarbeitet werden</td>
|
<td>muss sofort verarbeitet werden</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td><img src="pictures/FoodAmpel_gelb.png"></td>
|
<td><img src="pictures/foodampel_gelb.png"></td>
|
||||||
<td>kann ein paar Tage liegen</td>
|
<td>kann ein paar Tage liegen</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td><img src="pictures/FoodAmpel_gruen.png"></td>
|
<td><img src="pictures/foodampel_gruen.png"></td>
|
||||||
<td>lange Haltbarkeit</td>
|
<td>lange Haltbarkeit</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
@ -90,7 +100,8 @@
|
||||||
<p>
|
<p>
|
||||||
<a class= "button_produkte" href="produkte.html">zu den Produkten</a>
|
<a class= "button_produkte" href="produkte.html">zu den Produkten</a>
|
||||||
</p>
|
</p>
|
||||||
<h2>Viel Spaß bei Deinem Einkauf. Dein Second Harvest Team.</h2>
|
<h2 id="greeting-desktop">Viel Spaß bei Deinem Einkauf. Dein Second Harvest Team.</h2>
|
||||||
|
<h2 id="greeting-mobile">Viel Spaß bei Deinem Einkauf.</h2>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
|
|
|
@ -3,7 +3,7 @@ let x = Number(localStorage.getItem("gesamtpreis")).toFixed(2);
|
||||||
let y = document.getElementById("gesamtkosten");
|
let y = document.getElementById("gesamtkosten");
|
||||||
y.innerHTML = "Die Gesamtkosten (inkl. MwSt.) belaufen sich auf: " + x + "€";
|
y.innerHTML = "Die Gesamtkosten (inkl. MwSt.) belaufen sich auf: " + x + "€";
|
||||||
|
|
||||||
function checkform(event) {
|
function checkform() {
|
||||||
let vorname = document.getElementById('vorname').value;
|
let vorname = document.getElementById('vorname').value;
|
||||||
let name = document.getElementById('name').value;
|
let name = document.getElementById('name').value;
|
||||||
let straße = document.getElementById('straße').value;
|
let straße = document.getElementById('straße').value;
|
||||||
|
@ -12,23 +12,11 @@ function checkform(event) {
|
||||||
let wohnort = document.getElementById('wohnort').value;
|
let wohnort = document.getElementById('wohnort').value;
|
||||||
let email = document.getElementById('email').value;
|
let email = document.getElementById('email').value;
|
||||||
|
|
||||||
fehlerbox.innerHTML = 'Fehler: <br>';
|
if (/[a-zA-Z]{2,}/.test(vorname) === false) alert('vorname falsch');
|
||||||
|
if (/[a-zA-Z]{2,}/.test(name) === false) alert('name falsch');
|
||||||
if (/[a-zA-Z]{2,}/.test(vorname) === false) fehlerbox.innerHTML += 'Vorname: mindestens zwei Buchstaben <br>';
|
if (/[a-zA-Z]{2,}/.test(straße) === false) alert('straße falsch');
|
||||||
if (/[a-zA-Z]{2,}/.test(name) === false) fehlerbox.innerHTML += 'Name: mindestens zwei Buchstaben <br>';
|
if (/[0-9]{1,}/.test(hausnummer) === false) alert('hausnummer falsch');
|
||||||
if (/[a-zA-Z0-9]{2,}/.test(straße) === false) fehlerbox.innerHTML += 'Straße: mindestens zwei Zeichen <br>';
|
if (/[0-9]{4,5}/.test(plz) === false) alert('plz falsch');
|
||||||
if (/[0-9]{1,}/.test(hausnummer) === false) fehlerbox.innerHTML += 'Hausnummer: mindestens eine Zahl <br>';
|
if (/[a-zA-Z]{2,}/.test(wohnort) === false) alert('wohnort falsch');
|
||||||
if (/[0-9]{4,5}/.test(plz) === false) fehlerbox.innerHTML += 'Postleitzahl: mindestens vier Zahlen <br>';
|
if (/^([a-zA-Z0-9]+([-_\.]?[a-zA-Z0-9])+@[a-zA-Z0-9]+([-_\.]?[a-zA-Z0-9])+\.[a-z]{2,4}){0,}$/.test(email) === false) alert('email falsch');
|
||||||
if (/[a-zA-Z]{2,}/.test(wohnort) === false) fehlerbox.innerHTML += 'Wohnort: mindestens zwei Buchstaben <br>';
|
|
||||||
if (/^([a-zA-Z0-9]+([-_\.]?[a-zA-Z0-9])+@[a-zA-Z0-9]+([-_\.]?[a-zA-Z0-9])+\.[a-z]{2,4}){0,}$/.test(email) === false) fehlerbox.innerHTML += 'EMail: bitte nach dem Muster "email@beispiel.de" <br>';
|
|
||||||
|
|
||||||
if(fehlerbox.innerHTML.length > 12) {
|
|
||||||
event.preventDefault();
|
|
||||||
let fehlerboxstyle = document.getElementById('fehlerbox');
|
|
||||||
fehlerbox.style = 'display: block;'
|
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
const fehlerbox = document.getElementById('fehlerbox');
|
|
||||||
const bestellbutton = document.getElementById('bestellbutton');
|
|
||||||
bestellbutton.addEventListener('click', checkform, false);
|
|
|
@ -9,7 +9,7 @@ if (window.location.pathname.includes("/produkte.html")) {
|
||||||
"birnen": 0.50, // Preis für Birnen
|
"birnen": 0.50, // Preis für Birnen
|
||||||
"kiwi": 0.95, // Preis für Kiwi
|
"kiwi": 0.95, // Preis für Kiwi
|
||||||
"orangen": 2.0, //Preis für Orangen
|
"orangen": 2.0, //Preis für Orangen
|
||||||
"aepfel": 2.0 //Preis für Aepfel
|
"äpfel": 2.0 //Preis für Äpfel
|
||||||
};
|
};
|
||||||
// Hole button1 - button6
|
// Hole button1 - button6
|
||||||
for (let i = 1; i <= 6; i++) {
|
for (let i = 1; i <= 6; i++) {
|
||||||
|
@ -396,12 +396,12 @@ function createWarenkorbDiv(warenkorb) {
|
||||||
}
|
}
|
||||||
location.reload(true);
|
location.reload(true);
|
||||||
});
|
});
|
||||||
} else if (produkt.id === "aepfel") {
|
} else if (produkt.id === "äpfel") {
|
||||||
const warenkorbDiv = document.createElement("div");
|
const warenkorbDiv = document.createElement("div");
|
||||||
warenkorbDiv.setAttribute("data-id", "aepfel");
|
warenkorbDiv.setAttribute("data-id", "äpfel");
|
||||||
warenkorbDiv.classList.add("produkte_warenkorb");
|
warenkorbDiv.classList.add("produkte_warenkorb");
|
||||||
const produktBild = document.createElement("img");
|
const produktBild = document.createElement("img");
|
||||||
produktBild.src = "pictures/aepfel_ohne_preis.png.avif"
|
produktBild.src = "pictures/äpfel_ohne_preis.png.avif"
|
||||||
produktBild.alt = produkt.id;
|
produktBild.alt = produkt.id;
|
||||||
warenkorbDiv.appendChild(produktBild);
|
warenkorbDiv.appendChild(produktBild);
|
||||||
|
|
||||||
|
@ -454,10 +454,10 @@ function createWarenkorbDiv(warenkorb) {
|
||||||
produkt.anzahl--;
|
produkt.anzahl--;
|
||||||
localStorage.setItem("warenkorb", JSON.stringify(warenkorb));
|
localStorage.setItem("warenkorb", JSON.stringify(warenkorb));
|
||||||
} else {
|
} else {
|
||||||
entferneProdukt("aepfel");
|
entferneProdukt("äpfel");
|
||||||
console.log("Hier ausgabe vom Warenkorb:");
|
console.log("Hier ausgabe vom Warenkorb:");
|
||||||
console.log(warenkorb);
|
console.log(warenkorb);
|
||||||
const apfelContainer = document.querySelector('[data-id="aepfel"]');
|
const apfelContainer = document.querySelector('[data-id="äpfel"]');
|
||||||
//Löschen vom warenkorbDiv
|
//Löschen vom warenkorbDiv
|
||||||
warenkorbContainer.removeChild(apfelContainer);
|
warenkorbContainer.removeChild(apfelContainer);
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,14 +22,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 140 KiB After Width: | Height: | Size: 140 KiB |
|
@ -23,14 +23,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
@ -125,7 +135,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="produkte">
|
<div class="produkte">
|
||||||
<img src="pictures/aepfel.png" width = "300" height="300" alt="Äpfel" data-id="aepfel">
|
<img src="pictures/äpfel.png" width = "300" height="300" alt="Äpfel" data-id="äpfel">
|
||||||
<div class ="produktbottom">
|
<div class ="produktbottom">
|
||||||
<img src ="pictures/FoodAmpel_gelb.png" width ="50" height="50" alt="FoodAmpel gelb">
|
<img src ="pictures/FoodAmpel_gelb.png" width ="50" height="50" alt="FoodAmpel gelb">
|
||||||
<select name="quantity">
|
<select name="quantity">
|
||||||
|
|
|
@ -22,14 +22,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -23,14 +23,24 @@
|
||||||
<span class="line line2"></span>
|
<span class="line line2"></span>
|
||||||
<span class="line line3"></span>
|
<span class="line line3"></span>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar menu-items">
|
<div class="navbar menu-items">
|
||||||
<a href="ueber_uns.html">Über uns</a>
|
<a href="ueber_uns.html">Über uns</a>
|
||||||
<a href="produkte.html">Produkte</a>
|
<a href="produkte.html">Produkte</a>
|
||||||
<a href="warenkorb.html">Warenkorb</a>
|
<a href="warenkorb.html">Warenkorb</a>
|
||||||
<a href="kontakt.html">Kontakt</a>
|
<a href="kontakt.html">Kontakt</a>
|
||||||
<a href="impressum.html">Impressum</a>
|
<a href="impressum.html">Impressum</a>
|
||||||
<a href="datenschutz.html">Datenschutz</a>
|
<a href="datenschutz.html">Datenschutz</a>
|
||||||
</nav>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe">
|
||||||
|
<span class="header-mobile-text">
|
||||||
|
<h1>Second Harvest</h1>
|
||||||
|
<p>Gib Lebensmitteln eine zweite Chance</p>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div id="header-mobile-farbe" class="header-mobile-logo">
|
||||||
|
<a href="index.html">
|
||||||
|
<img src="pictures/logo_secondharvest_transparent.png" width="120" alt="Second Harvest Logo"></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
Loading…
Reference in New Issue