From 6852923db06e00d2d8a5b636de55f82227a1370a Mon Sep 17 00:00:00 2001 From: Karsten Tlotzek Date: Mon, 30 Jun 2025 14:01:08 +0200 Subject: [PATCH] Add login page styles and refactor authentication views - Introduced new styles for the login page, enhancing layout and responsiveness. - Updated the login view to utilize the new styles and improve user feedback for login errors and success messages. - Removed unused controllers and views related to contact and login functionalities to streamline the codebase. - Adjusted error message handling in the AuthController for better clarity on password requirements. --- CSS/style.css | 118 +++++++++++++++++- Controller/AuthController.php | 2 +- Controller/ContactController.php | 53 -------- Controller/LoginController.php | 10 -- Controller/WelcomeController.php | 18 --- Views/Auth/login.phtml | 54 ++++---- .../showAuthForm.phtml} | 2 + Views/Contact/showConfirmation.phtml | 10 -- Views/Contact/showContactForm.phtml | 34 ----- Views/Welcome/showProjects.phtml | 21 ---- Views/Welcome/showTutorials.phtml | 21 ---- Views/Welcome/showWelcome.phtml | 12 -- 12 files changed, 143 insertions(+), 212 deletions(-) delete mode 100644 Controller/ContactController.php delete mode 100644 Controller/LoginController.php delete mode 100644 Controller/WelcomeController.php rename Views/{Login/showLoginPage.phtml => Auth/showAuthForm.phtml} (99%) delete mode 100644 Views/Contact/showConfirmation.phtml delete mode 100644 Views/Contact/showContactForm.phtml delete mode 100644 Views/Welcome/showProjects.phtml delete mode 100644 Views/Welcome/showTutorials.phtml delete mode 100644 Views/Welcome/showWelcome.phtml diff --git a/CSS/style.css b/CSS/style.css index 300bf3e..c67152a 100644 --- a/CSS/style.css +++ b/CSS/style.css @@ -126,11 +126,117 @@ a { border-radius: 10px; } +/* Login Page Styles */ +.login-page-bg { + min-height: 100vh; + display: flex; + align-items: center; + justify-content: center; + background: linear-gradient(135deg, #DFF0F2 60%, #BAC8D4 100%); +} + .login-container { - position: absolute; - top: 200px; - background-color: #BAC8D4; - width: 900px; - height: 450px; - border-radius: 10px; + background: #fff; + box-shadow: 0 4px 24px rgba(0,0,0,0.10); + border-radius: 16px; + padding: 40px 32px 32px 32px; + width: 100%; + max-width: 400px; + display: flex; + flex-direction: column; + align-items: center; +} + +.login-title { + margin-bottom: 24px; + color: #4d4d4d; + font-size: 2rem; + font-weight: 600; + letter-spacing: 1px; +} + +.login-form { + width: 100%; + display: flex; + flex-direction: column; + gap: 18px; +} + +.login-field { + display: flex; + flex-direction: column; + gap: 6px; +} + +.login-field label { + font-weight: 500; + color: #4d4d4d; +} + +.login-field input { + padding: 10px 12px; + border: 1px solid #BAC8D4; + border-radius: 6px; + font-size: 1rem; + background: #F7FAFC; + transition: border 0.2s; +} + +.login-field input:focus { + border: 1.5px solid #09add0; + outline: none; +} + +.login-btn { + margin-top: 10px; + padding: 12px 0; + background: #09add0; + color: #fff; + border: none; + border-radius: 6px; + font-size: 1.1rem; + font-weight: 600; + cursor: pointer; + transition: background 0.2s; +} + +.login-btn:hover { + background: #007b9e; +} + +.login-error { + background: #ffe0e0; + color: #b30000; + border: 1px solid #ffb3b3; + border-radius: 6px; + padding: 10px 16px; + margin-bottom: 18px; + width: 100%; + text-align: center; +} + +.login-success { + background: #e0ffe6; + color: #006633; + border: 1px solid #b3ffd1; + border-radius: 6px; + padding: 10px 16px; + margin-bottom: 18px; + width: 100%; + text-align: center; +} + +.login-link { + display: inline-block; + margin-top: 10px; + color: #09add0; + font-weight: 500; + text-decoration: underline; +} + +@media (max-width: 600px) { + .login-container { + padding: 24px 8px; + max-width: 95vw; + } } \ No newline at end of file diff --git a/Controller/AuthController.php b/Controller/AuthController.php index 51de72b..7ebe3e5 100644 --- a/Controller/AuthController.php +++ b/Controller/AuthController.php @@ -76,7 +76,7 @@ class AuthController } if ($this->pwRequirementCheck($data['password'])) { - $errors + $errors['password'] = "Passwort muss mindestens 8 Zeichen lang sein und mindestens ein Großbuchstabe, ein Kleinbuchstabe, eine Zahl und ein Sonderzeichen enthalten."; } if (empty($errors)) { diff --git a/Controller/ContactController.php b/Controller/ContactController.php deleted file mode 100644 index de3862e..0000000 --- a/Controller/ContactController.php +++ /dev/null @@ -1,53 +0,0 @@ - "Name", "email" => "E-Mail-Adresse", "content" => "Nachricht"); - - - public function __construct($view) { - $this->db = new ContactModel(); - $this->view = $view; - } - - public function showContactForm() { - $this->view->setVars([ - 'labels' => $this->labels, - 'validData' => $this->validData, - 'errors' => $this->errors - ]); - } - - public function showConfirmation() { - - } - - public function validateForm() { - foreach ($this->labels as $index => $value) { - if (!isset($_POST[$index]) || empty($_POST[$index])) { - $this->errors[$index] = "Bitte " . $value . " angeben"; - } else { - $this->validData[$index] = $_POST[$index]; - } - } - - if (count($this->errors) > 0) { - $this->view->setDoMethodName("showContactForm"); - $this->showContactForm(); - } else { - if ($this->db->writeContactData($this->validData)) { - $this->view->setDoMethodName("showConfirmation"); - $this->showConfirmation(); - } - } - } -} -?> \ No newline at end of file diff --git a/Controller/LoginController.php b/Controller/LoginController.php deleted file mode 100644 index 7cd4e0a..0000000 --- a/Controller/LoginController.php +++ /dev/null @@ -1,10 +0,0 @@ - - -
- + \ No newline at end of file diff --git a/Views/Login/showLoginPage.phtml b/Views/Auth/showAuthForm.phtml similarity index 99% rename from Views/Login/showLoginPage.phtml rename to Views/Auth/showAuthForm.phtml index 812f0bb..3418048 100644 --- a/Views/Login/showLoginPage.phtml +++ b/Views/Auth/showAuthForm.phtml @@ -1,6 +1,7 @@ +
+ diff --git a/Views/Contact/showConfirmation.phtml b/Views/Contact/showConfirmation.phtml deleted file mode 100644 index 504df09..0000000 --- a/Views/Contact/showConfirmation.phtml +++ /dev/null @@ -1,10 +0,0 @@ - -
-

Ihre Anfrage wurde erfolgreich versendet.

-Weiter -
- \ No newline at end of file diff --git a/Views/Contact/showContactForm.phtml b/Views/Contact/showContactForm.phtml deleted file mode 100644 index 603c0c9..0000000 --- a/Views/Contact/showContactForm.phtml +++ /dev/null @@ -1,34 +0,0 @@ - - -

Ihre Anfrage an uns

-
- - $value) { - echo ''; - if ($index == "content") { - echo "
"; - } else { - echo '
'; - } - if (isset($errors[$index])) { - echo '
'; - } -} - -?> - - - - - - - - - -
- - \ No newline at end of file diff --git a/Views/Welcome/showProjects.phtml b/Views/Welcome/showProjects.phtml deleted file mode 100644 index 497a5ce..0000000 --- a/Views/Welcome/showProjects.phtml +++ /dev/null @@ -1,21 +0,0 @@ - -
-

Virtuelles Museum

- -

- my Oculus Rift - Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. -

-

- Proin nonummy, lacus eget pulvinar lacinia, pede felis dignissim leo, vitae tristique magna lacus sit amet eros. Nullam ornare. Praesent odio ligula, dapibus sed, tincidunt eget, dictum ac, nibh. Nam quis lacus. Nunc eleifend molestie velit. Morbi lobortis quam eu velit. Donec euismod vestibulum massa. Donec non lectus. Aliquam commodo lacus sit amet nulla. Cras dignissim elit et augue. Nullam non diam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Aenean vestibulum. Sed lobortis elit quis lectus. Nunc sed lacus at augue bibendum dapibus. -

-

- Aliquam vehicula sem ut pede. Cras purus lectus, egestas eu, vehicula at, imperdiet sed, nibh. Morbi consectetuer luctus felis. Donec vitae nisi. Aliquam tincidunt feugiat elit. Duis sed elit ut turpis ullamcorper feugiat. Praesent pretium, mauris sed fermentum hendrerit, nulla lorem iaculis magna, pulvinar scelerisque urna tellus a justo. Suspendisse pulvinar massa in metus. Duis quis quam. Proin justo. Curabitur ac sapien. Nam erat. - Praesent ut quam. -

-
- \ No newline at end of file diff --git a/Views/Welcome/showTutorials.phtml b/Views/Welcome/showTutorials.phtml deleted file mode 100644 index b91c779..0000000 --- a/Views/Welcome/showTutorials.phtml +++ /dev/null @@ -1,21 +0,0 @@ - -
-

Implement Controller

- -

- my Oculus Rift - Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. -

-

- Proin nonummy, lacus eget pulvinar lacinia, pede felis dignissim leo, vitae tristique magna lacus sit amet eros. Nullam ornare. Praesent odio ligula, dapibus sed, tincidunt eget, dictum ac, nibh. Nam quis lacus. Nunc eleifend molestie velit. Morbi lobortis quam eu velit. Donec euismod vestibulum massa. Donec non lectus. Aliquam commodo lacus sit amet nulla. Cras dignissim elit et augue. Nullam non diam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In hac habitasse platea dictumst. Aenean vestibulum. Sed lobortis elit quis lectus. Nunc sed lacus at augue bibendum dapibus. -

-

- Aliquam vehicula sem ut pede. Cras purus lectus, egestas eu, vehicula at, imperdiet sed, nibh. Morbi consectetuer luctus felis. Donec vitae nisi. Aliquam tincidunt feugiat elit. Duis sed elit ut turpis ullamcorper feugiat. Praesent pretium, mauris sed fermentum hendrerit, nulla lorem iaculis magna, pulvinar scelerisque urna tellus a justo. Suspendisse pulvinar massa in metus. Duis quis quam. Proin justo. Curabitur ac sapien. Nam erat. - Praesent ut quam. -

-
- \ No newline at end of file diff --git a/Views/Welcome/showWelcome.phtml b/Views/Welcome/showWelcome.phtml deleted file mode 100644 index c1c76d5..0000000 --- a/Views/Welcome/showWelcome.phtml +++ /dev/null @@ -1,12 +0,0 @@ - -
-
-
-
-
-
-