Add navigation bar and logout button
This commit is contained in:
parent
b24fe56c8a
commit
e58036b2b3
|
|
@ -15,22 +15,73 @@ body {
|
|||
/* --- Header --- */
|
||||
header {
|
||||
margin: 1em;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
/* --- Navigation bar --- */
|
||||
nav {
|
||||
}
|
||||
|
||||
nav ul {
|
||||
display: flex;
|
||||
padding: 0 1.5em;
|
||||
border: 0;
|
||||
border-bottom: 1px solid #000000;
|
||||
}
|
||||
|
||||
nav ul li {
|
||||
margin: 0 0 -1px -1px;
|
||||
list-style: none;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
nav a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0.5em 1em;
|
||||
border: 1px solid #999999;
|
||||
border-bottom-color: #000000;
|
||||
}
|
||||
|
||||
nav a:link, nav a:visited {
|
||||
background-color: #eeeeee;
|
||||
color: blue;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
nav a:hover, nav a:focus {
|
||||
background-color: #ffffff;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
nav li.nav_current_page {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
nav li.nav_current_page a {
|
||||
background-color: #ffffff;
|
||||
border-color: #000000;
|
||||
border-bottom-color: #ffffff;
|
||||
}
|
||||
|
||||
/* --- Main section --- */
|
||||
main {
|
||||
margin: 2em;
|
||||
}
|
||||
|
||||
/* --- Login page --- */
|
||||
main.login_page {
|
||||
margin: 2em;
|
||||
padding: 1em;
|
||||
border: 1px gray solid;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
main.login_page h2 {
|
||||
margin: 0 0 0.5em 0;
|
||||
border: 1px solid #666666;
|
||||
}
|
||||
|
||||
main.login_page table td {
|
||||
|
|
@ -38,6 +89,10 @@ main.login_page table td {
|
|||
}
|
||||
|
||||
/* --- Text and other styling --- */
|
||||
h2 {
|
||||
margin: 0 0 0.5em 0;
|
||||
}
|
||||
|
||||
.error {
|
||||
background: #ff4444;
|
||||
width: 30em;
|
||||
|
|
|
|||
|
|
@ -17,5 +17,9 @@ class BaseController
|
|||
{
|
||||
$this->view = $view;
|
||||
$this->userHelper = $userHelper;
|
||||
|
||||
// Register globals
|
||||
$twigEnv = $view->getEnvironment();
|
||||
$twigEnv->addGlobal('current_user_name', $userHelper->isLoggedIn() ? $userHelper->getCurrentUser()->getUsername() : null);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -59,14 +59,17 @@ class LoginController extends BaseController
|
|||
$user = null;
|
||||
}
|
||||
|
||||
if ($user !== null && password_verify($loginPassword, $user->getPasswordHash())) {
|
||||
$_SESSION['username'] = $user->getUsername();
|
||||
return $response
|
||||
->withHeader('Location', '/')
|
||||
->withStatus(303);
|
||||
} else {
|
||||
if ($user === null || !password_verify($loginPassword, $user->getPasswordHash())) {
|
||||
return $this->renderLoginPage($response, ['error' => 'Wrong username or password!']);
|
||||
} elseif (!$user->isActive()) {
|
||||
return $this->renderLoginPage($response, ['error' => 'User is inactive!']);
|
||||
}
|
||||
|
||||
// Set login session
|
||||
$_SESSION['username'] = $user->getUsername();
|
||||
return $response
|
||||
->withHeader('Location', '/')
|
||||
->withStatus(303);
|
||||
}
|
||||
|
||||
public function logoutUser(Request $request, Response $response): Response
|
||||
|
|
|
|||
|
|
@ -1,18 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta charset="utf-8"/>
|
||||
<title>{% block title %}Untitled page{% endblock %} - MailAccountAdmin</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="/static/style.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<link rel="stylesheet" href="/static/style.css"/>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<h1>MailAccountAdmin</h1>
|
||||
<div class="header_userstatus">
|
||||
Hello, <b>{{ current_user_name }}</b>. | <a href="/logout">Logout</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav>
|
||||
<ul>
|
||||
<li class="nav_current_page"><a href="/">Dashboard</a></li>
|
||||
<li><a href="/domains">Domains</a></li>
|
||||
<li><a href="/accounts">Accounts</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
{% block content %}
|
||||
Nothing to see here...
|
||||
|
|
|
|||
|
|
@ -6,15 +6,4 @@
|
|||
<h2>Dashboard</h2>
|
||||
|
||||
<p>Hello, {{ username }}!</p>
|
||||
|
||||
<pre>
|
||||
ID: {{ user.getId() }}
|
||||
username: {{ user.getUsername() }}
|
||||
password: {{ user.getPasswordHash() }}
|
||||
is_active: {{ user.isActive() }}
|
||||
created_at: {{ user.getCreatedAt() | date() }}
|
||||
modified_at: {{ user.getModifiedAt() | date() }}
|
||||
</pre>
|
||||
|
||||
<a href="/logout">Logout.</a>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta charset="utf-8"/>
|
||||
<title>Login - MailAccountAdmin</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="/static/style.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<link rel="stylesheet" href="/static/style.css"/>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
|
||||
<form action="/login" method="POST">
|
||||
{% if error is defined %}
|
||||
<div class="error">{{ error }}</div>
|
||||
<div class="error">{{ error }}</div>
|
||||
{% endif %}
|
||||
|
||||
<table>
|
||||
|
|
@ -32,7 +32,9 @@
|
|||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><button type="submit">Login</button></td>
|
||||
<td>
|
||||
<button type="submit">Login</button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
|
|
|
|||
Loading…
Reference in New Issue