register funktion

lernplattform/static/javascript.js

@@ -0,0 +1,20 @@
+function validateForm() {
+    var username = document.forms["loginForm"]["username"].value;
+    var password = document.forms["loginForm"]["password"].value;
+    if (username == "" || password == "") {
+        alert("Benutzername und Passwort müssen ausgefüllt werden.");
+        return false;
+    }
+    return true;
+}
+
+function checkPasswords() {
+    var password = document.forms["registerForm"]["password"].value;
+    var confirmPassword = document.forms["registerForm"]["password_repeat"].value;
+
+    if (password != confirmPassword) {
+        alert("Passwörter stimmen nicht überein.");
+        return false;
+    }
+    return true;
+}

lernplattform/static/style.css

@@ -0,0 +1,103 @@
+:root {
+    --primary-color: #102037; /* Definieren Sie die primäre Farbe */
+    --secondary-color: #f78b47; /* Definieren Sie die sekundäre Farbe */
+    --link-default-color: #ffffff; /* Definieren Sie die Link-Hover-Farbe */
+    --link-hover-color: #ffcc00; /* Definieren Sie die Link-Hover-Farbe */
+    --link-active-color: #ffcc00; /* Definieren Sie die Link-Hover-Farbe */
+    --background-color: #d4c4c4; /* Definieren Sie die Hintergrundfarbe */
+    --nav-background-color: #102037; /* Definieren Sie die Hintergrundfarbe */
+    --box-background-color: #102037;
+}
+body {
+    color: #ffffff;
+    background-color: var(--background-color);
+}
+.light {
+    color: #cdcdcd;
+    font-weight: 400;
+    font-size: small;
+}
+.sidebar {
+    height: 100%;
+    position: sticky;
+    top: 0;
+    background-color: var(--background-color);
+}
+.main-content {
+    background-color: var(--background-color);
+}
+.profile-card,
+.story,
+.post,
+.who-to-follow,
+.news {
+    background-color: var(--box-background-color);
+    padding: 20px;
+    border-radius: 15px;
+    margin-bottom: 20px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
+}
+.headbar {
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
+}
+.profile-card img,
+.who-to-follow img {
+    width: 60px;
+    height: 60px;
+    object-fit: cover;
+    border-radius: 50%;
+}
+.story input {
+    border-radius: 30px;
+}
+.story button {
+    border-radius: 20px;
+}
+.post img {
+    width: 100%;
+    border-radius: 15px;
+    margin-top: 10px;
+}
+.who-to-follow button {
+    border-radius: 20px;
+}
+.navbar {
+    background-color: var(--nav-background-color);
+    padding: 0;
+}
+.navbar-nav .nav-link  {
+    color: var(--link-default-color)
+}
+
+.navbar-nav .nav-link:hover {
+    color: var(--link-hover-color);
+}
+
+.navbar-nav .nav-link.active {
+    color: var(--link-active-color);
+}
+
+a  {
+    color: #ffcc00;
+}
+a:hover {
+    color: #c07427;
+}
+
+.logo {
+    display:inline;
+    width: 50px;
+    margin: 0;
+    padding: 0;
+}
+
+.footer {
+    background-color: var(--nav-background-color);
+    padding: 0;
+    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.3);
+}
+
+.errormsg {
+    color: red;
+    font-size: 15px;
+}