add regisitrierung

added registrierung in mobile view and finished anmeldepage in mobile view
This commit is contained in:
Manuel Prodinger
2022-05-01 10:55:49 +02:00
parent 336f498849
commit ea00cc4c02
4 changed files with 74 additions and 4 deletions
+2 -2
View File
@@ -12,13 +12,13 @@ import img_alaturca from "./alaturca.jpg";
import Eingabefeld from "./Components/eingabefeld"; import Eingabefeld from "./Components/eingabefeld";
import "../node_modules/font-awesome/css/font-awesome.min.css"; import "../node_modules/font-awesome/css/font-awesome.min.css";
import Liste from "./Components/liste"; import Liste from "./Components/liste";
import Anmeldefeld from "./Pages/anmeldepage";
import Anmeldepage from "./Pages/anmeldepage"; import Anmeldepage from "./Pages/anmeldepage";
import Registrierung from "./Pages/registrierung";
function App() { function App() {
return ( return (
<div className="App"> <div className="App">
<Anmeldepage></Anmeldepage> <Registrierung></Registrierung>
</div> </div>
); );
} }
+1 -1
View File
@@ -3,7 +3,7 @@ import React, { useState } from "react";
function Eingabefeld(props) { function Eingabefeld(props) {
const [usepollName, setPollName] = useState(""); const [usepollName, setPollName] = useState("");
return ( return (
<div> <div class="pb-2">
<br /> <br />
<input <input
className="form-control className="form-control
+12 -1
View File
@@ -1,4 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import ButtonPrimary from "../Components/buttonPrimary";
import Eingabefeld from "../Components/eingabefeld"; import Eingabefeld from "../Components/eingabefeld";
import bild from "../pizza_logo_dark.png"; import bild from "../pizza_logo_dark.png";
@@ -12,10 +13,20 @@ function Anmeldepage(props) {
alt="Logo"></img> alt="Logo"></img>
</div> </div>
<br></br> <br></br>
<br></br>
<label class="font-medium leading-tight text-3xl mt-0 mb-2">Anmelden</label> <label class="font-medium leading-tight text-3xl mt-0 mb-2">Anmelden</label>
<br></br> <br></br>
<br></br>
<label class="absolute left-0">E-Mail:</label> <label class="absolute left-0">E-Mail:</label>
<Eingabefeld isPassword={false}></Eingabefeld> <Eingabefeld isPassword={false} placeholder="Mail"></Eingabefeld>
<label class="absolute left-0">Passwort:</label>
<Eingabefeld isPassword={true} placeholder="Passwort"></Eingabefeld>
<br></br>
<br></br>
<div class="sm: flex justify-between">
<ButtonPrimary name="Registieren"></ButtonPrimary>
<ButtonPrimary name="Anmelden"></ButtonPrimary>
</div>
</div> </div>
); );
} }
+59
View File
@@ -0,0 +1,59 @@
import React, { useState } from "react";
import ButtonPrimary from "../Components/buttonPrimary";
import Eingabefeld from "../Components/eingabefeld";
import bild from "../pizza_logo_dark.png";
function Registrierung(props) {
return (
<div class="sm: m-5">
<div class="sm: grid grid-cols-5 items-center">
<img
class="sm:w-60 h-45 p-5 grid col-span-3 col-start-2 place-content-center"
src={props.bild || bild}
alt="Logo"></img>
</div>
<br></br>
<br></br>
<label class="font-medium leading-tight text-3xl mt-0 mb-2">Registrieren</label>
<br></br>
<br></br>
<div class="grid grid-cols-2 grid-rows-2 justify-items-start p-0 gap-x-1 gap-y-0 h-10">
<label class="col-start-1 col-end-1 row-start-1 row-end-1">Vorname:</label>
<label class="col-start-2 col-end-2 row-start-1 row-end-1">Passwort:</label>
<Eingabefeld
isPassword={false}
placeholder="Mail"
class="col-start-1 col-end-1 row-start-2 row-end-2"></Eingabefeld>
<Eingabefeld
isPassword={true}
placeholder="Passwort"
class="col-start-2 col-end-2 row-start-2 row-end-2"></Eingabefeld>
</div>
<br></br>
<br></br>
<div class="pt-2">
<label class="absolute left-2">E-Mail:</label>
<Eingabefeld isPassword={false} placeholder="Mail"></Eingabefeld>
</div>
<div class="pt-2">
<label class="absolute left-2">Passwort:</label>
<Eingabefeld isPassword={true} placeholder="Passwort"></Eingabefeld>
</div>
<div class="pt-2">
<label class="absolute left-2">Passwort erneut:</label>
<Eingabefeld isPassword={false} placeholder="Passwort erneut"></Eingabefeld>
</div>
<br></br>
<br></br>
<div class="sm: flex justify-between">
<ButtonPrimary name="Registieren"></ButtonPrimary>
<ButtonPrimary name="Anmelden"></ButtonPrimary>
</div>
</div>
);
}
export default Registrierung;