improved styling and logout button

This commit is contained in:
Daniel Eder 2025-02-17 20:16:40 +01:00
parent 3d9c710985
commit 9fd841229b
12 changed files with 88 additions and 93 deletions

View file

@ -1,19 +1,12 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html> <h1>Add Trainer</h1>
{{template "head.html" .}} <!-- Include header template --> <form action="/trainers/add" method="POST">
<label for="name">Name:</label>
<body> <input type="text" id="name" name="name" required><br><br>
{{template "header.html" .}}
<h1>Add Trainer</h1> <label for="email">Email:</label>
<a href="/">Back to Home</a> <input type="email" id="email" name="email" required><br><br>
<form action="/trainers/add" method="POST">
<label for="name">Name:</label> <button type="submit">Add Trainer</button>
<input type="text" id="name" name="name" required><br><br> </form>
{{template "epilogue.html" }}
<label for="email">Email:</label>
<input type="email" id="email" name="email" required><br><br>
<button type="submit">Add Trainer</button>
</form>
</body>
</html>

View file

@ -1,18 +1,8 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h1>Add New Training Area</h1> <h1>Add New Training Area</h1>
<form action="/training-areas/add" method="post"> <form action="/training-areas/add" method="post">
<label for="name">Training Area Name:</label> <label for="name">Training Area Name:</label>
<input type="text" id="name" name="name" required> <input type="text" id="name" name="name" required>
<button type="submit">Add</button> <button type="submit">Add</button>
</form> </form>
<br> {{template "epilogue.html" }}
<a href="/training-areas">Back to Training Areas</a>
<br><br>
<a href="/">Back to Home</a>
</body>
</html>

View file

@ -12,19 +12,53 @@
header { header {
background-color: #06041f; background-color: #06041f;
color: #fff;
padding: 20px; padding: 20px;
text-align: center; text-align: center;
} }
header img { .header-content {
width: 150px; display: flex;
justify-content: space-between;
align-items: center;
max-width: 1200px;
margin: 0 auto;
}
.logo {
width: 50px;
height: auto; height: auto;
} }
header h1 { header h1 {
flex-grow: 1;
margin: 0;
font-size: 2em;
color: #47d7ac; color: #47d7ac;
} }
.nav-buttons a {
text-decoration: none;
margin: 0 10px;
padding: 10px 20px;
background-color: #47d7ac;
color: #fff;
border-radius: 5px;
font-weight: bold;
transition: background-color 0.3s ease;
display: inline-flex;
align-items: center;
justify-content: center;
}
.nav-buttons a:hover {
background-color: #35a895;
}
.nav-buttons i {
margin-right: 8px;
}
/* home */ /* home */
.tiles ul { .tiles ul {
list-style-type: none; list-style-type: none;
@ -88,7 +122,7 @@
button { button {
background-color: #47d7ac; background-color: #47d7ac;
color: #fff; color: #06041f;
padding: 8px 16px; padding: 8px 16px;
border: none; border: none;
cursor: pointer; cursor: pointer;
@ -98,4 +132,9 @@
button:hover { button:hover {
background-color: #35a895; background-color: #35a895;
} }
.main {
margin-left: 20px;
margin-right: 20px;
}
</style> </style>

3
templates/epilogue.html Normal file
View file

@ -0,0 +1,3 @@
</div>
</body>
</html>

View file

@ -1,4 +1,10 @@
<header> <header>
<img src="logo.png" alt="Training Management Logo"> <div class="header-content">
<h1>Nagarro Training Solutions</h1> <img src="logo.png" alt="Training Management Logo" class="logo">
<h1>Nagarro Training Solutions</h1>
<nav class="nav-buttons">
<a href="/" class="btn"><i class="fas fa-home"></i> Home</a>
<a href="/logout" class="btn"><i class="fas fa-sign-out-alt"></i> Logout</a>
</nav>
</div>
</header> </header>

View file

@ -1,9 +1,4 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h1>Welcome to the Training Management System</h1> <h1>Welcome to the Training Management System</h1>
<div class="tiles"> <div class="tiles">
<ul> <ul>
@ -29,5 +24,4 @@
</li> </li>
</ul> </ul>
</div> </div>
</body> {{template "epilogue.html" }}
</html>

View file

@ -1,9 +1,4 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h2>Please log in to continue</h2> <h2>Please log in to continue</h2>
<form action="/login" method="POST"> <form action="/login" method="POST">
<label for="username">Username:</label> <label for="username">Username:</label>
@ -14,5 +9,4 @@
<button type="submit">Login</button> <button type="submit">Login</button>
</form> </form>
</body> {{template "epilogue.html" }}
</html>

7
templates/preamble.html Normal file
View file

@ -0,0 +1,7 @@
<!DOCTYPE html>
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<div class="main">

View file

@ -1,9 +1,4 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h2>Setup Admin Account</h2> <h2>Setup Admin Account</h2>
<form method="post"> <form method="post">
<label>Name:</label> <label>Name:</label>
@ -16,5 +11,4 @@
<button type="submit">Create Admin</button> <button type="submit">Create Admin</button>
</form> </form>
</body> {{template "epilogue.html" }}
</html>

View file

@ -1,13 +1,6 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h1>Trainers</h1> <h1>Trainers</h1>
<a href="/">Back to Home</a> <a href="/trainers/add"><button>Add Trainer</button></a>
<a href="/trainers/add">Add Trainer</a>
<table border="1"> <table border="1">
<tr> <tr>
<th>Name</th> <th>Name</th>
@ -20,5 +13,4 @@
</tr> </tr>
{{ end }} {{ end }}
</table> </table>
</body> {{template "epilogue.html" }}
</html>

View file

@ -1,12 +1,6 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h1>Training Areas</h1> <h1>Training Areas</h1>
<a href="/training-areas/add">Add Training Area</a> <a href="/training-areas/add"><button>Add Training Area</button></a>
<table> <table>
<thead> <thead>
@ -34,8 +28,4 @@
{{end}} {{end}}
</tbody> </tbody>
</table> </table>
{{template "epilogue.html" }}
<a href="/">Back to Home</a>
</body>
</html>

View file

@ -1,11 +1,5 @@
<!DOCTYPE html> {{ template "preamble.html" }}
<html>
{{template "head.html" .}} <!-- Include header template -->
<body>
{{template "header.html" .}}
<h1>Trainings</h1> <h1>Trainings</h1>
<a href="/">Back to Home</a>
<table border="1"> <table border="1">
<tr> <tr>
<th>Title</th> <th>Title</th>
@ -26,5 +20,4 @@
</tr> </tr>
{{ end }} {{ end }}
</table> </table>
</body> {{template "epilogue.html" }}
</html>