Renaming and autoformatting
- renamed the react files to jsx - autoformat with vscode
This commit is contained in:
parent
e762032f00
commit
85e484bf0b
32 changed files with 127 additions and 129 deletions
|
|
@ -31,7 +31,10 @@
|
||||||
<title>BA - Marco Camenzind</title>
|
<title>BA - Marco Camenzind</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>Diese Anwendung funktioniert leider nur mit JavaScript. Bitte aktivieren JavaScript in den Einstellungen</noscript>
|
<noscript
|
||||||
|
>Diese Anwendung funktioniert leider nur mit JavaScript. Bitte aktivieren
|
||||||
|
JavaScript in den Einstellungen</noscript
|
||||||
|
>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
<!--
|
<!--
|
||||||
This HTML file is a template.
|
This HTML file is a template.
|
||||||
|
|
|
||||||
|
|
@ -81,7 +81,6 @@ h1 {
|
||||||
margin-bottom: 0.7em;
|
margin-bottom: 0.7em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.errorMessage {
|
.errorMessage {
|
||||||
color: var(--error);
|
color: var(--error);
|
||||||
max-width: 60%;
|
max-width: 60%;
|
||||||
|
|
|
||||||
|
|
@ -92,45 +92,6 @@
|
||||||
color: #b1b1b1;
|
color: #b1b1b1;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Social Icons */
|
|
||||||
.social-icon-link {
|
|
||||||
color: var(--forth);
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-media {
|
|
||||||
max-width: 1000px;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-media-wrap {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
width: 99%;
|
|
||||||
max-width: 1000px;
|
|
||||||
margin: 40px auto 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-icons {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
width: 240px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social-logo {
|
|
||||||
color: var(--forth);
|
|
||||||
justify-self: start;
|
|
||||||
margin-left: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
text-decoration: none;
|
|
||||||
font-size: 2rem;
|
|
||||||
display: flex;
|
|
||||||
align-self: center;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 820px) {
|
@media screen and (max-width: 820px) {
|
||||||
.footer-links {
|
.footer-links {
|
||||||
padding-top: 2rem;
|
padding-top: 2rem;
|
||||||
|
|
@ -148,7 +109,4 @@
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.social-media-wrap {
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,7 +0,0 @@
|
||||||
import React from "react";
|
|
||||||
|
|
||||||
function AuthorDate() {
|
|
||||||
return <div></div>;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AuthorDate;
|
|
||||||
|
|
@ -11,7 +11,7 @@ export default function BehaviorPhone(props) {
|
||||||
Sie sich vor, dass Sie gerade am Telefonieren sind. Verwenden Sie bitte
|
Sie sich vor, dass Sie gerade am Telefonieren sind. Verwenden Sie bitte
|
||||||
kein Headset oder Ähnliches.
|
kein Headset oder Ähnliches.
|
||||||
</p>
|
</p>
|
||||||
<GeneratedPassword genPassword={props.genPassword}/>
|
<GeneratedPassword genPassword={props.genPassword} />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
@ -1,14 +0,0 @@
|
||||||
import React from "react";
|
|
||||||
import "../App.css";
|
|
||||||
import GeneratedPassword from "./GeneratedPassword"
|
|
||||||
|
|
||||||
export default function BehaviorStanding(props) {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<p>
|
|
||||||
In dieser Situation geht es darum, dass Sie das Passwort im Stehen eingeben. Stehen Sie also vor den Computer und geben Sie den Benutzernamen und das Passwort wie gewohnt ein.
|
|
||||||
</p>
|
|
||||||
<GeneratedPassword genPassword={props.genPassword}/>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
16
frontend/src/components/BehaviorStanding.jsx
Normal file
16
frontend/src/components/BehaviorStanding.jsx
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
import React from "react";
|
||||||
|
import "../App.css";
|
||||||
|
import GeneratedPassword from "./GeneratedPassword";
|
||||||
|
|
||||||
|
export default function BehaviorStanding(props) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<p>
|
||||||
|
In dieser Situation geht es darum, dass Sie das Passwort im Stehen
|
||||||
|
eingeben. Stehen Sie also vor den Computer und geben Sie den
|
||||||
|
Benutzernamen und das Passwort wie gewohnt ein.
|
||||||
|
</p>
|
||||||
|
<GeneratedPassword genPassword={props.genPassword} />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -5,10 +5,13 @@ export default function BehaviorStudyEnd() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<p>
|
<p>
|
||||||
Vielen Dank, dass Sie an der Studie teilgenommen haben. Sie helfen mir mit Ihrer Teilnahme enorm für die Bachelorthesis weiter.
|
Vielen Dank, dass Sie an der Studie teilgenommen haben. Sie helfen mir
|
||||||
|
mit Ihrer Teilnahme enorm für die Bachelorthesis weiter.
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Damit ich möglichst aussagekräftige Ergebnisse erhalte, ist es für mich wichtig, dass Sie mehrmals an der Studie teilnehmen. Daher bitte ich Sie, dass Sie zu einem anderen Zeitpunkt die Studie wiederholen.
|
Damit ich möglichst aussagekräftige Ergebnisse erhalte, ist es für mich
|
||||||
|
wichtig, dass Sie mehrmals an der Studie teilnehmen. Daher bitte ich
|
||||||
|
Sie, dass Sie zu einem anderen Zeitpunkt die Studie wiederholen.
|
||||||
</p>
|
</p>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
@ -14,7 +14,6 @@ export default function BehaviorStudyInfo() {
|
||||||
Bitte klicken Sie auf weiter, um mit der Studie zu beginnen. Bitte lesen
|
Bitte klicken Sie auf weiter, um mit der Studie zu beginnen. Bitte lesen
|
||||||
Sie die jeweilige Aufgabe jeweils genau.
|
Sie die jeweilige Aufgabe jeweils genau.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
@ -31,7 +31,7 @@
|
||||||
font-size: 1.3em;
|
font-size: 1.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn--full{
|
.btn--full {
|
||||||
padding: 12px 26px;
|
padding: 12px 26px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
|
|
@ -44,4 +44,3 @@
|
||||||
color: var(--secondary);
|
color: var(--secondary);
|
||||||
transition: 250ms;
|
transition: 250ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,8 +2,6 @@ import React from "react";
|
||||||
import "../App.css";
|
import "../App.css";
|
||||||
|
|
||||||
export default function GeneratedPassword(props) {
|
export default function GeneratedPassword(props) {
|
||||||
|
|
||||||
const genPassword = "PASSWORT_MANUELL"
|
|
||||||
const handleOnCopyEvent = (e) => {
|
const handleOnCopyEvent = (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
return false;
|
return false;
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
import React from "react";
|
|
||||||
import "../../App.css";
|
|
||||||
import Footer from "../../Footer";
|
|
||||||
|
|
||||||
export default function Lizenzen() {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="sitePage license">
|
|
||||||
<h1>Lizenzen und Bildnachweise</h1>
|
|
||||||
<p>
|
|
||||||
Nachfolgend sollen die verwendeten Bibliotheken inklusive der Lizenz
|
|
||||||
aufgeführt werden. Neben den Bibliotheken sollen vorallem auch
|
|
||||||
Bildnachweise notiert werden.
|
|
||||||
</p>
|
|
||||||
<h2>Verwendete Bibliotheken</h2>
|
|
||||||
<h3>Frontend</h3>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
ReactJS (MIT-Lizenz):{" "}
|
|
||||||
<a href="https://github.com/facebook/react">
|
|
||||||
https://github.com/facebook/react
|
|
||||||
</a>{" "}
|
|
||||||
</li>
|
|
||||||
<li>Behametrics Web-Logger (MIT-Lizenz): <a href="https://gitlab.com/behametrics/logger-web">https://gitlab.com/behametrics/logger-web</a></li>
|
|
||||||
<li>Fortawesome Icons (CC-BY-4.0): <a href="https://github.com/FortAwesome/Font-Awesome">https://github.com/FortAwesome/Font-Awesome</a></li>
|
|
||||||
<li>React-Token-Auth (ISC-Lizenz): <a href="https://github.com/obabichev/react-token-auth">https://github.com/obabichev/react-token-auth</a></li>
|
|
||||||
<li>react-router-dom (MIT-Lizenz)<a href="https://github.com/ReactTraining/react-router">https://github.com/ReactTraining/react-router</a></li>
|
|
||||||
</ul>
|
|
||||||
<h3>Backend</h3>
|
|
||||||
<ul>
|
|
||||||
<li>Flask (BSD-3-Lizenz): <a href="https://github.com/pallets/flask/">https://github.com/pallets/flask/</a></li>
|
|
||||||
<li>flask-sqlalchemy (BSD-3-Lizenz): <a href="https://github.com/pallets/flask-sqlalchemy">https://github.com/pallets/flask-sqlalchemy</a></li>
|
|
||||||
<li>flask-praetorian (MIT-Lizenz): <a href="https://github.com/dusktreader/flask-praetorian">https://github.com/dusktreader/flask-praetorian</a></li>
|
|
||||||
<li>Flask-CORS (MIT-Lizenz): <a href="https://github.com/corydolphin/flask-cors">https://github.com/corydolphin/flask-cors</a></li>
|
|
||||||
<li>Behametrics Serverimplementierung (MIT-Lizenz)<a href="https://gitlab.com/behametrics/server">https://gitlab.com/behametrics/server</a></li>
|
|
||||||
</ul>
|
|
||||||
<h2>Bildnachweise</h2>
|
|
||||||
<ul className="bildnachweise">
|
|
||||||
<li>
|
|
||||||
Originalbild für die Startseite: <a href="https://pixabay.com/illustrations/virtual-identity-digital-identity-69996/">
|
|
||||||
https://pixabay.com/illustrations/virtual-identity-digital-identity-69996/
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<Footer />
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
95
frontend/src/components/pages/Lizenzen.jsx
Normal file
95
frontend/src/components/pages/Lizenzen.jsx
Normal file
|
|
@ -0,0 +1,95 @@
|
||||||
|
import React from "react";
|
||||||
|
import "../../App.css";
|
||||||
|
import Footer from "../../Footer";
|
||||||
|
|
||||||
|
export default function Lizenzen() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="sitePage license">
|
||||||
|
<h1>Lizenzen und Bildnachweise</h1>
|
||||||
|
<p>
|
||||||
|
Nachfolgend sollen die verwendeten Bibliotheken inklusive der Lizenz
|
||||||
|
aufgeführt werden. Neben den Bibliotheken sollen vorallem auch
|
||||||
|
Bildnachweise notiert werden.
|
||||||
|
</p>
|
||||||
|
<h2>Verwendete Bibliotheken</h2>
|
||||||
|
<h3>Frontend</h3>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
ReactJS (MIT-Lizenz):{" "}
|
||||||
|
<a href="https://github.com/facebook/react">
|
||||||
|
https://github.com/facebook/react
|
||||||
|
</a>{" "}
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Behametrics Web-Logger (MIT-Lizenz):{" "}
|
||||||
|
<a href="https://gitlab.com/behametrics/logger-web">
|
||||||
|
https://gitlab.com/behametrics/logger-web
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Fortawesome Icons (CC-BY-4.0):{" "}
|
||||||
|
<a href="https://github.com/FortAwesome/Font-Awesome">
|
||||||
|
https://github.com/FortAwesome/Font-Awesome
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
React-Token-Auth (ISC-Lizenz):{" "}
|
||||||
|
<a href="https://github.com/obabichev/react-token-auth">
|
||||||
|
https://github.com/obabichev/react-token-auth
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
react-router-dom (MIT-Lizenz)
|
||||||
|
<a href="https://github.com/ReactTraining/react-router">
|
||||||
|
https://github.com/ReactTraining/react-router
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<h3>Backend</h3>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
Flask (BSD-3-Lizenz):{" "}
|
||||||
|
<a href="https://github.com/pallets/flask/">
|
||||||
|
https://github.com/pallets/flask/
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
flask-sqlalchemy (BSD-3-Lizenz):{" "}
|
||||||
|
<a href="https://github.com/pallets/flask-sqlalchemy">
|
||||||
|
https://github.com/pallets/flask-sqlalchemy
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
flask-praetorian (MIT-Lizenz):{" "}
|
||||||
|
<a href="https://github.com/dusktreader/flask-praetorian">
|
||||||
|
https://github.com/dusktreader/flask-praetorian
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Flask-CORS (MIT-Lizenz):{" "}
|
||||||
|
<a href="https://github.com/corydolphin/flask-cors">
|
||||||
|
https://github.com/corydolphin/flask-cors
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Behametrics Serverimplementierung (MIT-Lizenz)
|
||||||
|
<a href="https://gitlab.com/behametrics/server">
|
||||||
|
https://gitlab.com/behametrics/server
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Bildnachweise</h2>
|
||||||
|
<ul className="bildnachweise">
|
||||||
|
<li>
|
||||||
|
Originalbild für die Startseite:{" "}
|
||||||
|
<a href="https://pixabay.com/illustrations/virtual-identity-digital-identity-69996/">
|
||||||
|
https://pixabay.com/illustrations/virtual-identity-digital-identity-69996/
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<Footer />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -33,9 +33,7 @@ export default function Manual() {
|
||||||
Studie.
|
Studie.
|
||||||
</p>
|
</p>
|
||||||
<h2>War schon einmal hier</h2>
|
<h2>War schon einmal hier</h2>
|
||||||
<p>
|
<p>Wenn Sie schon einmal hier waren, gibt es zwei mögliche Zustände:</p>
|
||||||
Wenn Sie schon einmal hier waren, gibt es zwei mögliche Zustände:
|
|
||||||
</p>
|
|
||||||
<ul>
|
<ul>
|
||||||
<li>Sie sind noch eingeloggt</li>
|
<li>Sie sind noch eingeloggt</li>
|
||||||
<li>Sie sind nicht mehr eingeloggt</li>
|
<li>Sie sind nicht mehr eingeloggt</li>
|
||||||
Loading…
Reference in a new issue