diff options
| -rw-r--r-- | views/profile/index.php | 5 | ||||
| -rw-r--r-- | views/register/index.php | 26 | ||||
| -rw-r--r-- | views/styles.css | 36 |
3 files changed, 54 insertions, 13 deletions
diff --git a/views/profile/index.php b/views/profile/index.php index 2334c1b..471b257 100644 --- a/views/profile/index.php +++ b/views/profile/index.php @@ -8,8 +8,9 @@ <?php if ($user !== null): ?> <section> - <?= $user->Username ?> - <?= $user->Role ?> + <!-- https://tabler.io/icons --> + <svg class="user-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" ><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M12 2a5 5 0 1 1 -5 5l.005 -.217a5 5 0 0 1 4.995 -4.783z" /><path d="M14 14a5 5 0 0 1 5 5v1a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-1a5 5 0 0 1 5 -5h4z" /></svg> + <h1 class="username"><?= $user->Username ?></h1> </section> <?php else: ?> <h2>User "<?= $username ?>" doesn't exist!</h2> diff --git a/views/register/index.php b/views/register/index.php index 86f4aa7..4bec861 100644 --- a/views/register/index.php +++ b/views/register/index.php @@ -1,16 +1,20 @@ -<?php if (isset($user_status)): ?> - <?php if ($user_status !== ""): ?> - <p> - Fail: <?= $user_status ?> - </p> - <?php else: ?> - <p> - Success! - </p> +<h1>Register</h1> + +<hr class="new-section"/> + +<form action="#" method="POST" class="font-115 flex-col-centered max-width-20 center-margin"> + <?php if (isset($user_status)): ?> + <?php if ($user_status !== ""): ?> + <p class="item error"><span> + <strong>Error:</strong> <?= $user_status ?> + </span></p> + <?php else: ?> + <p class="item success"> + Success! + </p> + <?php endif; ?> <?php endif; ?> -<?php endif; ?> -<form action="#" method="POST"> <input type="text" name="username" placeholder="Username" minlength="1" pattern="[A-Za-z][A-Za-z_0-9]*"> <input type="password" name="password" placeholder="Password" minlength="4"> <input type="submit" value="Register"> diff --git a/views/styles.css b/views/styles.css index 5058854..8d815ad 100644 --- a/views/styles.css +++ b/views/styles.css @@ -88,6 +88,10 @@ input[type=submit]:hover { width: 100%; } +.font-115 { + font-size: 1.15em; +} + .font-125 { font-size: 1.25em; } @@ -96,6 +100,10 @@ input[type=submit]:hover { font-size: 1.5em; } +.max-width-20 { + max-width: 20em; +} + .center-margin { margin-left: auto; margin-right: auto; @@ -112,6 +120,12 @@ input[type=submit]:hover { gap: 0.75em; } +.flex-col-centered { + display: flex; + flex-direction: column; + gap: 1em; +} + .flex-expand { flex: 1; } @@ -296,3 +310,25 @@ hr.new-section { color: gray; margin: 0.25em; } + +.item.error { + border-color: var(--cherry); +} + +.item.success { + border-color: var(--dark-green); +} + +/* User */ +.user-icon { + height: 7em; + color: inherit; + display: inline-block; + vertical-align: middle; +} + +.username { + display: inline-block; + font-size: 2.5em; + vertical-align: middle; +} |