From ad8308794c5d95c13f52727a755e360947920ca1 Mon Sep 17 00:00:00 2001
From: Alex Tselegidis <alextselegidis@gmail.com>
Date: Mon, 24 Jan 2022 13:42:13 +0100
Subject: [PATCH] The login/logout/recovery page have a better structure.

---
 application/views/pages/login.php    | 40 +++++++++++++--------------
 application/views/pages/logout.php   | 26 ++++++++++--------
 application/views/pages/recovery.php | 41 +++++++++++++++++-----------
 3 files changed, 59 insertions(+), 48 deletions(-)

diff --git a/application/views/pages/login.php b/application/views/pages/login.php
index 57c34289..03499e88 100644
--- a/application/views/pages/login.php
+++ b/application/views/pages/login.php
@@ -4,38 +4,38 @@
 
 <h2><?= lang('backend_section') ?></h2>
 
-<p><?= lang('you_need_to_login') ?></p>
+<p>
+    <small>
+        <?= lang('you_need_to_login') ?>
+    </small>
+</p>
 
 <hr>
 <div class="alert d-none"></div>
 
 <form id="login-form">
-    <div class="mb-3">
-        <label for="username"><?= lang('username') ?></label>
-        <input type="text" id="username"
-               placeholder="<?= lang('enter_username_here') ?>"
-               class="form-control"/>
-    </div>
-    <div class="mb-3">
-        <label for="password"><?= lang('password') ?></label>
-        <input type="password" id="password"
-               placeholder="<?= lang('enter_password_here') ?>"
-               class="form-control"/>
+    <div class="mb-3 mt-5">
+        <label for="username" class="form-label">
+            <?= lang('username') ?>
+        </label>
+        <input type="text" id="username" placeholder="<?= lang('enter_username_here') ?>" class="form-control"/>
     </div>
 
-    <div class="mb-3">
+    <div class="mb-5">
+        <label for="password" class="form-label">
+            <?= lang('password') ?>
+        </label>
+        <input type="password" id="password" placeholder="<?= lang('enter_password_here') ?>" class="form-control"/>
+    </div>
+
+    <div class="d-flex justify-content-between align-items-center mb-5">
+        <a href="<?= site_url('recovery') ?>" class="forgot-password"><?= lang('forgot_your_password') ?></a>
+
         <button type="submit" id="login" class="btn btn-primary">
             <i class="fas fa-sign-in-alt me-2"></i>
             <?= lang('login') ?>
         </button>
     </div>
-
-    <a href="<?= site_url('recovery') ?>" class="forgot-password"><?= lang('forgot_your_password') ?></a>
-    |
-    <span id="select-language" class="badge bg-success">
-        <?= ucfirst(config('language')) ?>
-    </span>
-
 </form>
 <?php section('content') ?>
 
diff --git a/application/views/pages/logout.php b/application/views/pages/logout.php
index 8e9ea22e..0ab9478e 100644
--- a/application/views/pages/logout.php
+++ b/application/views/pages/logout.php
@@ -5,20 +5,22 @@
 <h3><?= lang('log_out') ?></h3>
 
 <p>
-    <?= lang('logout_success') ?>
+    <small>
+        <?= lang('logout_success') ?>
+    </small>
 </p>
 
-<br>
-
-<a href="<?= site_url() ?>" class="btn btn-success btn-large">
-    <i class="fas fa-calendar-alt me-2"></i>
-    <?= lang('book_appointment_title') ?>
-</a>
-
-<a href="<?= site_url('login') ?>" class="btn btn-outline-secondary btn-large">
-    <i class="fas fa-wrench me-2"></i>
-    <?= lang('backend_section') ?>
-</a>
+<div class="d-flex justify-content-between my-5">
+    <a href="<?= site_url('login') ?>" class="btn btn-outline-secondary btn-large">
+        <i class="fas fa-wrench me-2"></i>
+        <?= lang('backend_section') ?>
+    </a>
+    
+    <a href="<?= site_url() ?>" class="btn btn-primary btn-large">
+        <i class="fas fa-calendar-alt me-2"></i>
+        <?= lang('book_appointment_title') ?>
+    </a>
+</div>
 
 <?php section('content') ?>
 
diff --git a/application/views/pages/recovery.php b/application/views/pages/recovery.php
index 3d18f012..87cd32a8 100644
--- a/application/views/pages/recovery.php
+++ b/application/views/pages/recovery.php
@@ -4,32 +4,41 @@
 
 <h2><?= lang('forgot_your_password') ?></h2>
 
-<p><?= lang('type_username_and_email_for_new_password') ?></p>
+<p>
+    <small>
+        <?= lang('type_username_and_email_for_new_password') ?>
+    </small>
+</p>
 
 <hr>
 
 <div class="alert d-none"></div>
 
-<form>
-    <div class="mb-3">
-        <label for="username"><?= lang('username') ?></label>
+<form class="mb-5">
+    <div class="mb-3 mt-5">
+        <label for="username" class="form-label">
+            <?= lang('username') ?>
+        </label>
         <input type="text" id="username" placeholder="<?= lang('enter_username_here') ?>" class="form-control"/>
     </div>
-    <div class="mb-3">
-        <label for="email"><?= lang('email') ?></label>
+    
+    <div class="mb-5">
+        <label for="email" class="form-label">
+            <?= lang('email') ?>
+        </label>
         <input type="text" id="email" placeholder="<?= lang('enter_email_here') ?>" class="form-control"/>
     </div>
 
-    <br>
-
-    <button type="submit" id="get-new-password" class="btn btn-primary btn-large">
-        <i class="fas fa-unlock-alt me-2"></i>
-        <?= lang('regenerate_password') ?>
-    </button>
-
-    <a href="<?= site_url('user/login') ?>" class="user-login">
-        <?= lang('go_to_login') ?>
-    </a>
+    <div class="d-flex justify-content-between align-items-center mb-5">
+        <a href="<?= site_url('user/login') ?>" class="user-login">
+            <?= lang('go_to_login') ?>
+        </a>
+        
+        <button type="submit" id="get-new-password" class="btn btn-primary btn-large">
+            <i class="fas fa-unlock-alt me-2"></i>
+            <?= lang('regenerate_password') ?>
+        </button>
+    </div>
 </form>
 
 <?php section('content') ?>