third Commit

2024-06-10 21:11:24 +02:00
parent 7bd704dd04
commit 346b485310
74 changed files with 1079 additions and 0 deletions
@@ -0,0 +1,45 @@
+Produkt;Preis;Lagerbestand;Lieferzeit;Kategorie;Dateiname
+ZTE Blade 10 Smart;198,99;7;7;Handys;zte_blade_10.png
+ZTE Blade 10 Smart;198,99;7;7;ZTE;zte_blade_10.png
+ZTE Blade 10 Smart;198,99;7;7;Sale;zte_blade_10.png
+Apple iPhone 11 Pro Max;1.566,99;3;14;Handys;apple_iphone_11.png
+Apple iPhone 11 Pro Max;1.566,99;3;14;Apple;apple_iphone_11.png
+Samsung A10;131,99;0;7;Handys;samsung_a10.png
+Samsung A10;131,99;0;7;Samsung;samsung_a10.png
+Huawei P Smart;147,99;20;7;Huawei;huawei_p_smart.png
+Huawei P Smart;147,99;20;7;Handys;huawei_p_smart.png
+Xiamoi Redmi Note 8 Pro;239,99;35;7;Handys;xiamoi_redmi_note_8.png
+Ulefone Note 7;131,99;10;7;Handys;ulefone_note_7.png
+Acer Aspire 3;399,99;2;7;Laptops;acer_aspire_3.png
+Acer Aspire 3;399,99;2;7;Acer;acer_aspire_3.png
+Miscrosoft Surface Laptop 3;1.119,99;9;7;Laptops;miscrosoft_surface_laptop_3.png
+Miscrosoft Surface Laptop 3;1.119,99;9;7;Sale;miscrosoft_surface_laptop_3.png
+Lenovo Gaming Notebook;499,99;15;14;Laptops;lenovo_gaming_notebook.png
+ASUS Gaming Notebook;519,99;40;14;Laptops;asus_gaming_notebook.png
+ASUS Gaming Notebook;519,99;40;14;Sale;asus_gaming_notebook.png
+Jumper Ezbook X3;239,99;1;14;Laptops;jumper_ezbook_x3.png
+CHUWI Lapbook Pro;379,99;29;14;Laptops;chuwi_lapbook_pro.png
+Dell 24 Zoll Monitor Full HD;149,99;10;7;Monitore;dell_zoll_monitor_full_24.png
+Dell 24 Zoll Monitor Full HD;149,99;10;7;Sale;dell_zoll_monitor_full_24.png
+Samsung 28 Zoll Monitor 4k;247,9;25;14;Monitore;samsung_zoll_monitor_4.png
+Samsung 28 Zoll Monitor 4k;247,9;25;14;Samsung;samsung_zoll_monitor_4.png
+Samsung 49 Zoll Curved Gaming Full HD;809,99;3;14;Monitore;samsung_zoll_curved_gaming_full_49.png
+Samsung 49 Zoll Curved Gaming Full HD;809,99;3;14;Samsung;samsung_zoll_curved_gaming_full_49.png
+BenQ 32 Zoll Curved Gaming 144Hz;406,11;0;14;Monitore;benq_zoll_curved_gaming_144.png
+AOC 24 Zoll Full HD;114,4;19;14;Monitore;aoc_24_zoll.png
+Acer KG1 24 Zoll Full HD;129,99;12;14;Monitore;acer_kg_zoll_full_hd.png
+Acer KG1 24 Zoll Full HD;129,99;12;14;Acer;acer_kg_zoll_full_hd.png
+Aufziehbares Ladekabel 0,6m;9,79;100;14;Handys;aufziehbares_ladekabel_m_6m.png
+Aufziehbares Ladekabel 0,6m;9,79;100;14;Samsung;aufziehbares_ladekabel_m_6m.png
+Aufziehbares Ladekabel 0,6m;9,79;100;14;ZTE;aufziehbares_ladekabel_m_6m.png
+BONTEC Monitorhalterung fuer Tische;48,99;17;7;Monitore;bontec_monitorhalterung_fuer_tische.png
+BONTEC Monitorhalterung fuer Tische;48,99;17;7;Samsung;bontec_monitorhalterung_fuer_tische.png
+BONTEC Monitorhalterung fuer Tische;48,99;17;7;Acer;bontec_monitorhalterung_fuer_tische.png
+BONTEC Monitorhalterung fuer Tische;48,99;17;7;Sonstiges;bontec_monitorhalterung_fuer_tische.png
+Logitech G512 Mechanische Tastatur;99;5;7;Laptops;logitech_g_mechanische_tastatur.png
+Logitech G512 Mechanische Tastatur;99;5;7;Monitore;logitech_g_mechanische_tastatur.png
+Logitech G512 Mechanische Tastatur;99;5;7;Sonstiges;logitech_g_mechanische_tastatur.png
+Razer Kraken X USB Gaming Headset;82,9;1;7;Sonstiges;razer_kraken_x_usb_gaming_Gaming.png
+Razer Kraken X USB Gaming Headset;82,9;1;7;Laptops;razer_kraken_x_usb_gaming_Gaming.png
+Willful Bluetooth Kopfhoerer In Ear;22,94;13;14;Sonstiges;willful_bluetooth_kopfhoerer_in_In.png
+Sharkoon Shark Force Pro Gaming Maus;14,9;22;7;Sonstiges;sharkoon_shark_force_pro_gaming_Gaming.png
@@ -0,0 +1,93 @@
+Copyright 2011 The Montserrat Project Authors (https://github.com/JulietaUla/Montserrat)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
@@ -0,0 +1,2 @@
+[LocalizedFileNames]
+Montserrat.zip=@Montserrat.zip,0
@@ -0,0 +1,9 @@
+<svg id="Gruppe_12" data-name="Gruppe 12" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+  <g id="Komponente_2_1" data-name="Komponente 2 – 1">
+    <g id="Rechteck_7" data-name="Rechteck 7" fill="none" stroke="#e1e1e1" stroke-width="1">
+      <rect width="20" height="20" stroke="none"/>
+      <rect x="0.5" y="0.5" width="19" height="19" fill="none"/>
+    </g>
+  </g>
+  <rect id="Rechteck_13" data-name="Rechteck 13" width="12" height="12" transform="translate(4 4)" fill="#afd96f"/>
+</svg>
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+  <g id="Rechteck_7" data-name="Rechteck 7" fill="none" stroke="#e1e1e1" stroke-width="1">
+    <rect width="20" height="20" stroke="none"/>
+    <rect x="0.5" y="0.5" width="19" height="19" fill="none"/>
+  </g>
+</svg>
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="21.29" height="21.296" viewBox="0 0 21.29 21.296">
+  <path id="Icon_ionic-ios-search" data-name="Icon ionic-ios-search" d="M25.54,24.247,19.619,18.27a8.438,8.438,0,1,0-1.281,1.3l5.882,5.938a.911.911,0,0,0,1.286.033A.917.917,0,0,0,25.54,24.247ZM12.988,19.64A6.663,6.663,0,1,1,17.7,17.688,6.622,6.622,0,0,1,12.988,19.64Z" transform="translate(-4.5 -4.493)" fill="#505050"/>
+</svg>
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="15.965" height="9.128" viewBox="0 0 15.965 9.128">
+  <path id="Icon_ionic-ios-arrow-down" data-name="Icon ionic-ios-arrow-down" d="M14.173,17.623l6.036-6.041a1.136,1.136,0,0,1,1.611,0,1.15,1.15,0,0,1,0,1.616l-6.84,6.844a1.139,1.139,0,0,1-1.573.033L6.52,13.2a1.141,1.141,0,1,1,1.611-1.616Z" transform="translate(-6.188 -11.246)" fill="#505050"/>
+</svg>
@@ -0,0 +1,5 @@
+Link:
+
+https://xd.adobe.com/view/ca7542de-d985-4871-7afb-c06a5fb3a6ff-bc44/?fullscreen
+
+Passwort: Schommer2020
@@ -0,0 +1,6 @@
+Dieses Projekt habe ich in der Ausbildung bekommen um meine ersten Berührungen mit PHP zu erfahren.
+Dazu wurde mein Wissen über Datenbanken und MySQL getestet.
+
+Das Projekt benötigt eine Datenbank mit zwei Tabellen.
+Einmal die Tabelle mit den Produkten.
+Und eine Tabelle für die Kategorien, welche mit der Tabelle mit den Produkten per m:n Relation verbunden ist.
@@ -0,0 +1,380 @@
+/*DETEILANSICHT*/
+#prodbild img {
+    width: 500px;
+    height: 500px;
+    float: left;
+}
+
+#prodbild {
+    display: block;
+    width: 60%;
+}
+
+#preis {
+    margin-top: 3em;
+}
+
+#vorschl {
+    margin-top: 3.125em;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 15px;
+}
+
+.vprod h2 {
+    margin-top: 0;
+    margin-bottom: 0.5em;
+}
+
+.vprod h1 {
+    margin-bottom: 0;
+}
+
+.vprodinfo {
+    width: 360px;
+    height: auto;
+    display: block;
+    margin-left: 1em;
+    float: left;
+}
+
+.vprod {
+    width: 22.5em;
+    height: 27.546em;
+    text-align: left;
+    margin-left: 0.2em;
+}
+
+.vprod img {
+    width: 350px;
+    height: 360px;
+    border-left: solid 0.5px grey;
+}
+
+#vortit {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 25px;
+    font-weight: 700;
+    color: #505050;
+    line-height: 24px;
+    margin-top: 3.75em;
+}
+
+#vorschl h1 {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 25px;
+    font-weight: 400;
+    color: #505050;
+    line-height: 30px;
+}
+
+#details #prodname {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 25px;
+    font-weight: 700;
+    color: #505050;
+    line-height: 24px;
+    margin-right: 1em;
+}
+
+#details h2 {
+    display: inline-block;
+    height: 0;
+    width: auto;
+}
+
+#details h1 {
+    display: block;
+    margin-top: 0;
+    width: auto;
+}
+
+#details {
+    float: left;
+    width: 80%;
+}
+
+#oben {
+    display: flex;
+    margin-top: 4em;
+}
+
+#backbutton {
+    height: 2.25em;
+    display: block;
+    width: 8em;
+}
+
+#backbutton a {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    color: #505050;
+    line-height: 19px;
+    text-decoration: none !important;
+}
+
+#kaufbutton:hover {
+    cursor: pointer;
+    background-color: #AFD96F;
+}
+
+#kaufbutton {
+    float: left;
+    margin-top: 2em;
+    margin-right: 6em;
+    border-radius: 28px;
+    border: 1px solid #AFD96F;
+    height: 50px;
+    width: 200px;
+    font-family: 'Montserrat', sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    color: #505050;
+    line-height: 19px;
+}
+
+/*STARTSEITE*/
+.grid-container {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 15px;
+}
+
+.grid-container a {
+    text-decoration: none !important;
+}
+
+.grid-item {
+    width: 500px;
+    height: 500px;
+    margin-bottom: 50px;
+    border-left: solid 0.5px grey;
+    text-align: left;
+    margin-left: 10px;
+}
+
+img {
+    width: 375px;
+    height: 360px;
+}
+
+#seiten {
+    margin: 50px auto auto auto;
+    width: 50%;
+    text-align: center;
+}
+
+.pagebtn {
+    border: solid 1px;
+    height: 20px;
+    border-radius: 0;
+}
+
+.pagebtn:hover {
+    cursor: pointer;
+}
+
+#soldindex {
+    display: block;
+    margin-left: 45px;
+}
+
+.sold {
+    color: #DF2727;
+}
+
+.grau {
+    -webkit-filter: grayscale(100%);
+    -moz-filter: grayscale(100%);
+    -ms-filter: grayscale(100%);
+    -o-filter: grayscale(100%);
+    filter: grayscale(100%);
+
+}
+
+h1 {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 25px;
+    font-weight: 400;
+    color: #505050;
+    line-height: 30px;
+}
+
+h2 {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 20px;
+    font-weight: 700;
+    color: #AFD96F;
+    line-height: 24px;
+}
+
+.prodname {
+    display: block;
+    margin-left: 45px;
+}
+
+.price {
+    display: block;
+    margin-top: -15px;
+    margin-left: 45px;
+}
+
+html,
+body {
+    height: 100%;
+}
+
+#filter {
+    float: left;
+    width: 300px;
+    min-height: 100%;
+    height: auto !important;
+    height: 100%;
+    display: block;
+    text-align: center;
+    box-shadow: rgba(0, 0, 0, 0.15) 3.95px 0px 6px;
+    align-content: center;
+}
+
+::placeholder {
+    padding-top: 10px;
+    padding-left: 20px;
+    padding-bottom: 10px;
+}
+
+#suche {
+    height: 30px;
+    margin-top: 20px;
+    margin-bottom: 10px;
+    margin-left: -10px;
+    display: inline-block;
+    border: solid 1px;
+
+}
+
+#kategorien input[type="checkbox"] {
+    appearance: none;
+    box-sizing: border-box;
+    padding: 0;
+    width: 1.15em;
+    height: 1.15em;
+    position: absolute;
+    display: grid;
+    font: inherit;
+    color: currentColor;
+    border: 0.1em solid grey;
+    border-radius: 0;
+    margin-top: 0em;
+    margin-left: -2.0em;
+    transform: translateY(-0.075em);
+    place-content: center;
+    content: "";
+
+}
+
+input[type="checkbox"]::before {
+    content: "";
+    width: 0.65em;
+    height: 0.55em;
+    transform: scale(0);
+    content: "";
+    border: 0.1em solid white;
+    background-color: #AFD96F;
+    transition: 120ms transform ease-in-out;
+    box-shadow: inset 1em 1em var(--form-control-color);
+}
+
+input[type="checkbox"]:checked::before {
+    transform: scale(1);
+}
+
+[type="search"] {
+    border: none;
+}
+
+#checkboxen {
+    display: inline;
+
+    margin-left: 40px;
+    width: 50px;
+}
+
+.kategorie {
+    margin-bottom: 20px;
+    width: 20px;
+
+}
+
+#suchleiste {
+    height: inherit;
+    position: relative;
+    top: -6px;
+    left: -0px;
+    display: inline-block;
+}
+
+input:focus {
+    outline: none;
+}
+
+
+#kategorien {
+    position: relative;
+    width: 60px;
+    height: auto !important;
+    min-height: 150px;
+    margin-top: 2.375em;
+    margin-left: 3.25em;
+}
+
+
+label {
+    font-family: 'Montserrat', sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    color: #505050;
+    line-height: 19px;
+    display: block;
+    margin-top: 0.625em;
+    text-align: left;
+}
+
+button[type="submit"]:hover {
+    background-color: gray;
+}
+
+button[type="submit"] {
+    display: inline-block;
+    height: inherit;
+    background: none;
+    border-width: 0;
+    border-style: none;
+    outline: none;
+}
+
+#h2price {
+    display: inline-block;
+    position: absolute;
+    margin-left: -6.5em;
+    border: none;
+}
+
+#h2kat {
+    display: inline-block;
+    position: absolute;
+    margin-top: 3.375em;
+    margin-left: -10.5em;
+    text-align: left;
+    border: none;
+}
+
+#prices {
+    height: 30px;
+    margin-top: 3.625em;
+    width: 215px;
+    margin-left: 1.5em;
+    display: block;
+    border: solid 1px;
+
+}
@@ -0,0 +1,30 @@
+<?php
+$servername = "ioannisdev.de";
+$dbuser = "samp";
+$dbpas = "password";
+$dbname = "shopseite";
+
+$dbhandle = new mysqli($servername, $dbuser, $dbpas,$dbname);
+
+if ($dbhandle->connect_error) {
+    die("Verbindung fehlgeschlagen: " . $dbhandle->connect_error);
+} else {
+
+   // echo "VERBINDUNG: ERFOLG! <br>";
+}
+
+function dbaction($handle, $query)
+{
+    if ($handle->connect_error) {
+        die("Verbindung fehlgeschlagen: " . $handle->connect_error);
+    } else {
+
+        if ($handle->query($query) === TRUE) {
+            echo "QUERY: ERFOLG! <br>";
+        } else {
+            echo "QUERY: FEHLER( " . $handle->error . ")<br>";
+        }
+    }
+}
+
+?>
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="./css/style.css">
+
+</head>
+
+<body>
+    <div id="oben">
+        <div id="backbutton">
+            <a href="./index.php">&#706; zurück</a>
+        </div>
+        <div id="prodbild">
+            <img src="./alle_produkte/acer_aspire_3.png" alt="">
+        </div>
+
+        <div id="details">
+            <h1 id="prodname">Apple iPhone 15 Pro Max</h1>
+            <div id="preis">
+                <h2>Preis</h2>
+                <h1>1.556,99€</h1>
+            </div>
+            <div id="versand">
+                <h2>Versand</h2>
+                <h1>Lieferung bis Dienstag 2. Juni</h1>
+            </div>
+            <div id="lager">
+                <h2>Lagerbestand</h2>
+                <h1>Auf Lager.</h1>
+            </div>
+
+            <form action="./kauf.html">
+                <button id="kaufbutton" type="submit">Kaufen</button>
+            </form>
+        </div>
+    </div>
+
+    <div id="unten">
+        <h1 id="vortit">Ähnliche Suchvorschläge</h1>
+
+        <div id="vorschl">
+            <div class="vprod">
+                <div class="vprodinfo">
+                    <h1>Samsung A10</h1>
+                    <h2>155,99€</h2>
+                </div>
+                <img src="./alle_produkte/zte_blade_10.png" alt="">
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
@@ -0,0 +1,134 @@
+<!DOCTYPE html>
+<html lang="de">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+    <link rel="stylesheet" href="./css/style.css">
+    <title>Detailseite</title>
+</head>
+
+<body>
+    <div id='oben'>
+        <div id='backbutton'>
+            <a href='./index.php'>&#706; zurück</a>
+        </div>
+        <?php
+
+        include_once "db.php";
+
+        if (isset($_GET["prodid"])) {
+            $prodid = $_GET['prodid'];
+            $sql = "SELECT * FROM produkte WHERE id = " . $prodid;
+
+            $result = $dbhandle->query($sql);
+            if (!$result) {
+                die('SQL-Fehler: ' . mysqli_error($conn));
+            }
+            if ($result && $result->num_rows == 1) {
+                while ($row = $result->fetch_assoc()) {
+                    $preis = number_format($row["preis"], 2, ',', '.');
+                    echo '<div id="prodbild">
+                    <img src="./alle_produkte/' . $row["dateiname"] . '" alt="">
+                </div>';
+
+                    echo '<div id="details">
+                <h1 id="prodname">' . $row["produkt"] . '</h1>';
+
+                    echo ' <div id="preis">
+                            <h2>Preis</h2>
+                            <h1>' . $row["preis"] . '€</h1>
+                    </div>';
+
+                    echo '<div id="versand">
+                     <h2>Versand</h2>
+                    <h1>Lieferung in ' . $row["lieferzeit"] . ' Tagen</h1>
+                 </div>';
+
+                    echo '<div id="lager">
+                    <h2>Lagerbestand</h2>';
+                    if ($row["lager"] == 0) {
+                        echo '<h1 class="sold">AUSVERKAUFT</h1>';
+                    } else {
+                        echo '<h1>' . $row["lager"] . ' auf Lager </h1>.';
+                    }
+                   echo '</div>';
+                    echo '<form action="./kauf.html">
+                         <button id="kaufbutton" type="submit">Kaufen</button>
+                 </form>
+                </div>
+            </div>';
+                }
+            }
+
+            $produktid = $_GET["prodid"];
+            $sql1 = "SELECT * FROM mapping WHERE produktid = $produktid";
+            $ergebnis1 = $dbhandle->query($sql1);
+
+            if ($ergebnis1) {
+                $row = $ergebnis1->fetch_assoc();
+                $kategorieid = $row['kategorieid'];
+
+                // Schritt 1: Versuche, genau 5 Produkte derselben Kategorie abzurufen
+                $sql2 = "SELECT * FROM produkte
+                     JOIN mapping ON produkte.id = mapping.produktid
+                     WHERE mapping.kategorieid = $kategorieid AND produkte.id <> $produktid
+                     LIMIT 6"; // Maximal 5 Produkte anzeigen
+                $ergebnis2 = $dbhandle->query($sql2);
+
+                if ($ergebnis2 && $ergebnis2->num_rows > 0) {
+                    // Es gibt mindestens 1 Produkt derselben Kategorie (außer dem ausgewählten Produkt)
+                    while ($row = $ergebnis2->fetch_assoc()) {
+                        showalt($row, $ergebnis2);
+                    }
+                } /*else {
+
+                    $sql3 = "SELECT * FROM produkte WHERE produkt LIKE '%$produktname%' AND id <> $produktid LIMIT 6"; // Maximal 5 Produkte anzeigen
+                    $ergebnis3 = $dbhandle->query($sql3);
+
+                    if ($ergebnis3 && $ergebnis3->num_rows > 0) {
+                        // Es gibt ähnliche Produkte
+                        while ($row = $ergebnis3->fetch_assoc()) {
+                            showalt($row, $ergebnis3);
+                        }
+                    } else {
+                        echo "Keine weiteren Produkte gefunden";
+                    }
+                }*/
+            } else {
+                echo "Fehler bei der Abfrage: " . $dbhandle->error;
+            }
+        } else {
+            header('location: ./index.php');
+        }
+
+
+
+
+        function showalt($ro, $res)
+        {
+            echo '<div id="unten">';
+            echo '<h1 id="vortit">Ähnliche Produkte</h1>';
+            echo '<div id="vorschl">';
+            while ($ro = $res->fetch_assoc()) {
+                echo '<div class="vprod">
+                    <div class="vprodinfo">';
+                echo '<h1>' . $ro["produkt"] . '</h1>';
+                echo '<h2>' . $ro["preis"] . '€</h1>';
+                echo "</div>";
+                echo '<img src="./alle_produkte/' . $ro["dateiname"] . '">';
+                echo "</div>";
+            }
+
+            echo "</div>";
+            echo "</div>";
+        }
+        ?>
+</body>
+
+</html>
@@ -0,0 +1,84 @@
+<?php
+ini_set('display_errors', 1);
+ini_set('display_startup_errors', 1);
+error_reporting(E_ALL);
+require_once "db.php";
+
+// Datenbankverbindung 
+$servername = "ioannisdev.de";
+$username = "samp";
+$password = "password";
+$dbname = "shopseite";
+
+$conn = new mysqli($servername, $username, $password, $dbname);
+
+if ($conn->connect_error) {
+    die("FEHLER: " . $conn->connect_error);
+}
+
+// CSV-Datei einlesen und Daten importieren
+
+if (($handle = fopen("CSV.csv", "r")) !== FALSE) {
+    fgetcsv($handle);
+    while (($data = fgetcsv($handle, 1000, ";")) !== FALSE) {
+        $produkt = $data[0];
+        $preis = $data[1];
+        $lager = $data[2];
+        $lieferzeit = $data[3];
+        $kategorie = $data[4];
+        $dateiname = $data[5];
+
+        // Produkt existent?
+        $prodid = 0;
+        $prodquery = "SELECT id FROM produkte WHERE produkt = '$produkt'";
+        $prodres = $conn->query($prodquery);
+
+        if ($prodres !== false && $prodres->num_rows > 0) {
+            $row = $prodres->fetch_assoc();
+            $prodid = $row["id"];
+        } else {
+
+            $preis = str_replace('.', '', $preis);
+            $preis = str_replace(',', '.', $preis);
+            $preis = (float)$preis;
+            // Produkt in DB einfügen
+            $insprodquery = "INSERT INTO produkte (produkt, preis, lager, lieferzeit, dateiname) 
+                VALUES ('$produkt', '$preis', $lager, $lieferzeit, '$dateiname')";
+            $conn->query($insprodquery);
+            $prodid = $conn->insert_id;
+        }
+
+        // Kategorie existent?
+        $katid = 0;
+        $katquery = "SELECT id FROM kategorien WHERE kategorie = '$kategorie'";
+        $katres = $conn->query($katquery);
+
+
+        if ($katres->num_rows > 0) {
+            $row = $katres->fetch_assoc();
+            $katid = $row["id"];
+        } else {
+            // Kategorie anlegen
+            $inskat = "INSERT INTO kategorien (kategorie) VALUES ('$kategorie')";
+            $conn->query($inskat);
+            $katid = $conn->insert_id;
+        }
+
+        // Verknüpfung zwischen Produkt und Kategorie herstellen
+        $checklinkq = "SELECT * FROM mapping WHERE produktid = '$prodid' AND kategorieid = '$katid'";
+        $checklinkres = $conn->query($checklinkq);
+        if (!$checklinkres) {
+            die("Fehler in der Abfrage: " . $conn->error);
+        }
+        if ($checklinkres && $checklinkres->num_rows == 0) {
+            $insprodkat = "INSERT INTO mapping (produktid, kategorieid) 
+                VALUES ($prodid, $katid)";
+            dbaction($conn, $insprodkat);
+        }
+    }
+    fclose($handle);
+} else {
+    echo "Fehler beim Öffnen der CSV-Datei.";
+}
+
+$conn->close();
@@ -0,0 +1,134 @@
+<!DOCTYPE html>
+<html lang="de">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>shopseite</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+    <link rel="stylesheet" href="./css/style.css">
+</head>
+
+<body>
+
+    <div id="filter">
+        <div id="suche">
+            <form method="POST" action="./index.php">
+                
+                <input type="search" name="suchbegriff" id="suchleiste" placeholder="Suchen...">
+                <button type="submit">
+                    <span class="material-symbols-outlined">search</span>
+                </button>
+
+        </div>
+        <h2 id="h2kat">Kategorien</h2>
+
+        <div id="checkboxen">
+            <div id="kategorien">
+                <?php
+                include_once "db.php";
+
+                $sql = "SELECT * FROM kategorien";
+                $result = $dbhandle->query($sql);
+                if ($result && $result->num_rows > 0) {
+                    while ($row = $result->fetch_assoc()) {
+                        echo "<label><input type='checkbox' name='geraet' value='" . $row['kategorie'] . "'/>" . $row['kategorie'] . "</label>";
+                    }
+                }
+
+                ?>
+            </div>
+        </div>
+        <h2 id="h2price">Preis</h2>
+        <div id="pricefilter">
+            <select name="prices" id="prices" onchange="this.form.submit()">
+                <option value="" selected>Preisspanne wählen...</option>
+                <option value="100" value="Select * From produkte Where preis > 0 and preis > 100">0€ - 100€</option>
+                <option value="500">100€ - 500€</option>
+                <option value="1000">500€ - 1000€</option>
+                <option value="2000">100€ - 2000€</option>
+            </select>
+        </div>
+        </form>
+    </div>
+
+    <div class="grid-container">
+        <?php
+        include_once "db.php";
+        include_once "import.php";
+        include_once "suche.php";
+
+        // Verbindungsdaten zur Datenbank
+        $servername = 'localhost';
+        $username = 'root';
+        $password = '';
+        $dbname = 'shopseite';
+
+
+        if (isset($_GET["page"])) {
+            $offset = (6 * $_GET["page"]) - 6;
+            if ($_GET["page"] > 1) {
+                $sql = "SELECT * FROM produkte LIMIT 6 OFFSET " . $offset;
+                $result = $dbhandle->query($sql);
+                //echo $offset;
+            } else {
+                //echo $offset;
+                $sql = "SELECT * FROM produkte LIMIT 6 OFFSET 0";
+                $result = $dbhandle->query($sql);
+            }
+        } else {
+            //echo $offset;
+            $sql = "SELECT * FROM produkte LIMIT 6 OFFSET 0";
+            $result = $dbhandle->query($sql);
+        }
+
+
+        if (isset($_GET["kategorie"])) {
+            $sql = "SELECT * FROM produkte WHERE id =1";
+            $result = $dbhandle->query($sql);
+            $kat = mysqli_fetch_assoc($result);
+            print_r($kat);
+        }
+
+        if (!isset($_GET["suchbegriff"])) {
+            if ($result && $result->num_rows > 0) {
+                while ($row = $result->fetch_assoc()) {
+                    $preis = number_format($row["preis"], 2, ',', '.');
+                    echo '<a href="detail.php?prodid='.$row["id"].'">';
+                    echo "<div class='grid-item'>";
+                    echo "<h1 class='prodname'>";
+                    echo $row["produkt"];
+                    echo "</h1>";
+                    echo "<h2 class='price'>$preis €</h2>";
+                    if ($row["lager"] == 0) {
+                        echo "<h1 id='soldindex' class='sold'>AUSVERKAUFT</h1>";
+                        echo '<img class="grau" src="' . './alle_produkte/' . $row["dateiname"] . '">';
+                    } else {
+                        echo '<img draggable="false" src="' . './alle_produkte/' . $row["dateiname"] . '">';
+                    }
+                    echo "</div>";
+                    echo "</a>";
+                }
+            } else {
+                echo "Keine Daten gefunden.";
+            }
+        }
+
+        ?>
+    </div>
+
+    <div id="seiten">
+        <a href="http://localhost/shop/?page=1"><button class="pagebtn">1</button></a>
+        <a href="http://localhost/shop/?page=2"><button class="pagebtn">2</button></a>
+        <a href="http://localhost/shop/?page=3"><button class="pagebtn">3</button></a>
+        <a href="http://localhost/shop/?page=4"><button class="pagebtn">4</button></a>
+    </div>
+
+
+</body>
+
+</html>
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <h1>Du hast was gekauft!</h1>
+</body>
+</html>
@@ -0,0 +1,43 @@
+<?php
+require_once "db.php";
+
+
+// CSV-Datei einlesen + Daten importieren
+if (($handle = fopen("csv.csv", "r")) !== FALSE) {
+    while (($data = fgetcsv($handle, 1000, ";")) !== FALSE) {
+        $produkt = $data[0];
+        $preis = $data[1];
+        $lager = $data[2];
+        $lieferzeit = $data[3];
+        $kategorie = $data[4];
+        $dateiname = $data[5];
+        
+        // Überprüfen, ob die Kategorie bereits existent
+        $katid = 0;
+        $katquery = "SELECT id FROM kategorien WHERE kategorie = '$kategorie'";
+        $katres = $dbhandle->query($katquery);
+        if ($katres !== false &&  $katres->num_rows > 0) {
+            $row = $katres->fetch_assoc();
+            $katid = $row["id"];
+        } else {
+            // Kategorie anlegen, wenn  nicht existent
+            $insert_katquery = "INSERT INTO kategorien (kategorie) VALUES ('$kategorie')";
+            $dbhandle->query($insert_katquery);
+            $katid = $dbhandle->insert_id;
+        }
+        
+        // Produkt in die Datenbank einfügen
+        $prodquery = "INSERT INTO produkte (produkt, preis, lager, lieferzeit, kategorie, dateiname) 
+            VALUES ('$produkt', '$preis', $lager, $lieferzeit, '$kategorie','$dateiname')";
+        $dbhandle->query($prodquery);
+        
+        // Verknüpfung zwischen Produkt und Kategorie 
+        $prodkatquery = "INSERT INTO mapping (produktid, kategorieid) 
+            VALUES (" . $dbhandle->insert_id . ", $katid)";
+        $dbhandle->query($prodkatquery);
+    }
+    fclose($handle);
+}
+
+$dbhandle->close();
+?>
@@ -0,0 +1,34 @@
+<?php
+require_once "db.php";
+
+$conn = $dbhandle;
+
+
+if (isset($_GET['suchbegriff'])) {
+    $suchbegriff = $_GET['suchbegriff'];
+
+    $sql = "SELECT * FROM produkte WHERE produkt LIKE '%$suchbegriff%'";
+    $result = $conn->query($sql);
+    if (!$result) {
+        die('SQL-Fehler: ' . mysqli_error($conn));
+    }
+    if ($result && $result->num_rows > 0) {
+        while ($row = $result->fetch_assoc()) {
+            $preis = number_format($row["preis"], 2, ',', '.');
+            echo "<div class='grid-item'>";
+            echo "<h1 class='prodname'>";
+            echo $row["produkt"];
+            echo "</h1>";
+            echo "<h2 class='price'>$preis €</h2>";
+            if ($row["lager"] == 0) {
+                echo "<h1 id='sold'>AUSVERKAUFT</h1>";
+                echo '<img class="grau" src="' . './alle_produkte/' . $row["dateiname"] . '">';
+            } else {
+                echo '<img draggable="false" src="' . './alle_produkte/' . $row["dateiname"] . '">';
+            }
+            echo "</div>";
+        }
+    } else {
+        echo "<b>Es wurden keine Produkte gefunden, welche ihrer Suchanfrage entsprechen.</b>";
+    }
+}