Register field in frontend. still needs some design things

This commit is contained in:
cami 2021-06-21 04:55:31 +02:00
parent 514de0e4ae
commit 9621a12f0c
5 changed files with 18 additions and 15 deletions

View file

@ -7,7 +7,7 @@
:root { :root {
--primary: rgb(41, 63, 87); --primary: rgb(41, 63, 87);
--secondary: #fff; --secondary: rgb(218,218,218);
--third: rgb(171, 183, 183); --third: rgb(171, 183, 183);
} }
@ -28,29 +28,24 @@
font-size: 100px; font-size: 100px;
} }
.products {
background-image: url('images/img-9.jpg');
background-position: center;
background-size: fill;
background-repeat: no-repeat;
color: var(--primary);
font-size: 100px;
}
.sign-up { .sign-up {
background-image: url('images/img-9.jpg'); background-image: url("images/img-9.jpg");
background-position: center; background-position: center;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #fff; color: var(--primary);
font-size: 100px; font-size: 100px;
} }
.sitePage { .sitePage {
height: 90vh; height: 90vh;
display: flex; display: flex;
justify-content: center; flex-direction: column;
align-content: center;
align-items: center;
background-color: var(--secondary);
} }
.sitePage h1 { .sitePage h1 {
font-size: 80px; font-size: 80px;
margin: 0.7em auto;
} }

View file

@ -0,0 +1,6 @@
.input-field {
width: auto;
}
.input-field input {
border-color: var(--primary);
}

View file

@ -1,8 +1,9 @@
import React from "react"; import React from "react";
import "./Input.css";
function InputField(props) { function InputField(props) {
return ( return (
<label> <label className="input-field">
<p>{props.LabelName}</p> <p>{props.LabelName}</p>
<input name={props.InputName} type={props.InputType} /> <input name={props.InputName} type={props.InputType} />
</label> </label>

View file

@ -146,7 +146,7 @@
background-color: transparent; background-color: transparent;
color: var(--primary); color: var(--primary);
padding: 14px 20px; padding: 14px 20px;
border: 1px solid #fff; border: 1px solid var(--primary);
transition: all 0.3s ease-out; transition: all 0.3s ease-out;
} }

View file

@ -20,6 +20,7 @@ export default function Login() {
InputType="password" InputType="password"
InputName="password" InputName="password"
/> />
<br />
<SubmitField LabelName="Einloggen" /> <SubmitField LabelName="Einloggen" />
</form> </form>
</div> </div>