diff --git a/frontend/src/App.css b/frontend/src/App.css index 069000c..8afe2d9 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -7,8 +7,10 @@ :root { --primary: rgb(41, 63, 87); + --primary-contr: rgb(9, 11, 46); --secondary: rgb(218,218,218); --third: rgb(171, 183, 183); + --forth: rgb(255,255,255); } .home, @@ -37,7 +39,7 @@ color: var(--primary); } -.sitePage h1 { +h1 { font-size: 5em; margin: 0.7em auto; } @@ -48,7 +50,7 @@ } .sitePage p { - font-size: 2em; + font-size: 1.5em; max-width: 60%; margin-bottom: 4vh; } diff --git a/frontend/src/Footer.css b/frontend/src/Footer.css index c16ffeb..03f9900 100644 --- a/frontend/src/Footer.css +++ b/frontend/src/Footer.css @@ -1,5 +1,5 @@ .footer-container { - background-color: rgb(41, 63, 87); + background-color: var(--primary); padding: 4rem 0 2rem 0; display: flex; flex-direction: column; @@ -15,7 +15,7 @@ text-align: center; margin-bottom: 24px; padding: 24px; - color: #fff; + color: var(--secondary); } .footer-subscription > p { @@ -41,7 +41,7 @@ border: none; font-size: 18px; margin-bottom: 16px; - border: 1px solid #fff; + border: 1px solid var(--secondary); } .footer-links { @@ -70,11 +70,11 @@ } .footer-link-items > h2 { - color: #fff; + color: var(--secondary); } .footer-link-items a { - color: #fff; + color: var(--secondary); text-decoration: none; margin-bottom: 8px; } @@ -94,7 +94,7 @@ /* Social Icons */ .social-icon-link { - color: #fff; + color: var(--forth); font-size: 24px; } @@ -120,7 +120,7 @@ } .social-logo { - color: #fff; + color: var(--forth); justify-self: start; margin-left: 20px; cursor: pointer; @@ -131,11 +131,6 @@ margin-bottom: 16px; } -.website-rights { - color: #fff; - margin-bottom: 16px; -} - @media screen and (max-width: 820px) { .footer-links { padding-top: 2rem; diff --git a/frontend/src/auth/PrivateRoute.js b/frontend/src/auth/PrivateRoute.js index fda4abd..decf7ce 100644 --- a/frontend/src/auth/PrivateRoute.js +++ b/frontend/src/auth/PrivateRoute.js @@ -1,4 +1,3 @@ -import { Component } from "react"; import { Redirect, Route } from "react-router-dom"; import { useAuth } from "./AuthProvider"; diff --git a/frontend/src/components/Button.js b/frontend/src/components/Button.js index a7bef2f..f7312df 100644 --- a/frontend/src/components/Button.js +++ b/frontend/src/components/Button.js @@ -2,7 +2,6 @@ import React from "react"; import "./Button.css"; import { Link } from "react-router-dom"; -const newTo = (props) => "#"; const STYLES = ["btn--primary", "btn--outline"]; diff --git a/frontend/src/components/Input.css b/frontend/src/components/Input.css index 3b23b35..4738348 100644 --- a/frontend/src/components/Input.css +++ b/frontend/src/components/Input.css @@ -1,11 +1,27 @@ .input-field { - width: auto; + width: auto; } -.input-field p{ - font-size: 36px; +.input-field p { + font-size: 1.5em; } + .input-field input { - width: 100%; - border-color: var(--primary); + width: 100%; + border-color: var(--primary); + background-color: var(--secondary); + padding: 0.25em 0.5em; + border: 3px solid var(--primary); + border-radius: 10.5em; +} + +.input-field input[type="submit"] { + margin-top: 1em; + border-radius: 10.5em; + background-color: var(--primary); + color: var(--secondary); +} + +.input-field input[type="submit"]:hover { + background-color: var(--primary-contr); } \ No newline at end of file diff --git a/frontend/src/components/InputField.js b/frontend/src/components/InputField.js index 14fcab3..664f218 100644 --- a/frontend/src/components/InputField.js +++ b/frontend/src/components/InputField.js @@ -5,7 +5,7 @@ function InputField(props) { return ( {props.LabelName} - + ); } diff --git a/frontend/src/components/Navbar.css b/frontend/src/components/Navbar.css index 23680d3..1c60c65 100644 --- a/frontend/src/components/Navbar.css +++ b/frontend/src/components/Navbar.css @@ -29,11 +29,6 @@ align-items: center; } -.fa-typo3 { - margin-left: 0.5rem; - font-size: 1.8rem; -} - .nav-menu { display: grid; grid-template-columns: repeat(4, auto); @@ -59,14 +54,10 @@ } .nav-links:hover { - border-bottom: 4px solid var(--secondary); + border-bottom: 4px dotted var(--secondary); transition: all 0.2s ease-out; } -.fa-bars { - color: var(--secondary); -} - .nav-links-mobile { display: none; } @@ -109,7 +100,7 @@ .nav-links:hover { background-color: var(--secondary); - color: #000; + color: var(--primary); border-radius: 0; } diff --git a/frontend/src/components/SubmitField.js b/frontend/src/components/SubmitField.js index a709cd5..968ec7f 100644 --- a/frontend/src/components/SubmitField.js +++ b/frontend/src/components/SubmitField.js @@ -5,7 +5,7 @@ import "./Button.css" function SubmitField(props) { const InputValue = props.LabelName; return ( - + ); diff --git a/frontend/src/components/pages/Login.js b/frontend/src/components/pages/Login.js index a71e73c..b5a4687 100644 --- a/frontend/src/components/pages/Login.js +++ b/frontend/src/components/pages/Login.js @@ -1,10 +1,10 @@ import React from "react"; -import { useState, useEffect } from "react/cjs/react.development"; +import { useState } from "react/cjs/react.development"; import "../../App.css"; import Footer from "../../Footer"; import InputField from "../InputField"; import SubmitField from "../SubmitField"; -import { login, authFetch, useAuth, logout } from "../../auth/AuthProvider"; +import { login, useAuth, logout } from "../../auth/AuthProvider"; import Secret from "./Secret"; export default function Login() { @@ -49,24 +49,26 @@ export default function Login() { {!logged ? ( ) : ( <> - - logout()}>Logout + + logout()}>Logout > )} diff --git a/frontend/src/components/pages/Manual.js b/frontend/src/components/pages/Manual.js index d3a1fbf..46ae5ef 100644 --- a/frontend/src/components/pages/Manual.js +++ b/frontend/src/components/pages/Manual.js @@ -1,15 +1,13 @@ -import React, {useState, useEffect} from "react"; +import React from "react"; import "../../App.css"; import Footer from "../../Footer"; export default function Manual() { - const [currentTime, setCurrentTime] = useState(0); - return ( <> - - Anleitung / Bedienungshinweise - + + Anleitung / Bedienungshinweise + > ); diff --git a/frontend/src/components/pages/Register.js b/frontend/src/components/pages/Register.js index 014a97b..a72f41d 100644 --- a/frontend/src/components/pages/Register.js +++ b/frontend/src/components/pages/Register.js @@ -36,7 +36,7 @@ export default function Login() { Registrierung
{props.LabelName}