Merge branch 'main' into pages-prodi

src/App.js

@@ -20,7 +20,7 @@ import "./App.css";
 function App() {
   return (
     <div className="App">
-      <Listenansicht></Listenansicht>
+    
     </div>
   );
 }

src/Components/card.jsx

@@ -1,13 +1,18 @@
 import React from "react";
 import bild from "../paparoy.jpg";
 import ButtonPrimary from "./buttonPrimary";
+import Ueberschrift2 from "./ueberschrift2";
 
 function Card(props) {
   return (
-    <div class="w-full rounded-xl overflow-hidden shadow-lg bg-gray1 ">
-      <img class="w-full max-h-60 object-fill" src={props.bild || bild} alt="Papa Roy"></img>
+    <div class="w-full rounded-xl overflow-hidden shadow-lg bg-gray1">
+      <div class="h-60">
+        <img class="w-full h-full object-cover" src={props.bild || bild} alt="Papa Roy"></img>
+      </div>
       <div class="px-6 py-4 flex justify-between">
-        <div class="font-bold text-xl flex justify-start m-3">{props.name || "Restaurant"}</div>
+        <div class="font-bold text-xl flex justify-start m-3">
+          <Ueberschrift2 name={props.name} />
+        </div>
         <ButtonPrimary name="Speisekarte" />
       </div>
     </div>

src/Components/endpage.jsx

@@ -0,0 +1,24 @@
+import React from "react";
+import ButtonSecondary from "./buttonSecondary";
+import HeaderBig from "./header_big";
+import Ueberschrift2 from "./ueberschrift2";
+
+function EndPage() {
+  return (
+    <div class="h-screen overflow-hidden">
+      <div>
+        <HeaderBig name=" " />
+      </div>
+      <div class="flex justify-center content-center items-center h-full w-full">
+        <div class="bg-primary h-1/2 w-1/2 p-10 lg:w-1/3 rounded-3xl flex justify-center items-center flex-col">
+          <Ueberschrift2 name="Vielen Dank!" />
+          <Ueberschrift2 name="Deine Bestellung wurde erfolgreich aufgegeben." />
+          <div class="p-5"></div>
+          <ButtonSecondary name="Zur Startseite" />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default EndPage;

src/Components/header_big.jsx

@@ -0,0 +1,14 @@
+import React from "react";
+import p_logo_light from "../pizza_logo_light.png";
+import Ueberschrift1 from "./ueberschrift1";
+
+function HeaderBig(props) {
+  return (
+    <div class="bg-primary h-40 w-full p-2 pl-10 pr-10 flex justify-between items-center">
+      <img src={p_logo_light} alt="Logo" class="h-28"></img>
+      <Ueberschrift1 name={props.name} />
+    </div>
+  );
+}
+
+export default HeaderBig;

src/Components/mainpage.jsx

@@ -0,0 +1,21 @@
+import React from "react";
+import Header1 from "../Components/header_1";
+import ButtonPrimary from "./buttonPrimary";
+import img_paparoy from "../paparoy.jpg";
+import img_alaturca from "../alaturca.jpg";
+import Card from "./card";
+
+function MainPage() {
+  return (
+    <div>
+      <Header1 />
+      <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4">
+        <Card name="Papa Roy" bild={img_paparoy} />
+        <Card name="A la Turca" bild={img_alaturca} />
+        <Card name="Pizza Olive" bild={img_paparoy} />
+      </div>
+    </div>
+  );
+}
+
+export default MainPage;

src/Components/ueberschrift1.jsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+function Ueberschrift1(props) {
+  return <p class="font-bold text-4xl text-white">{props.name || "Text"}</p>;
+}
+
+export default Ueberschrift1;

src/Components/ueberschrift2.jsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+function Ueberschrift2(props) {
+  return <p class="font-bold text-xl">{props.name || "Text"}</p>;
+}
+
+export default Ueberschrift2;