Temporary login solution

login.php

@@ -1,4 +1,18 @@
 <?php
+// Login logic
+if ((isset($_POST['username'])) && (isset($_POST['password']))) {
+    if (($_POST['username'] === 'VG3') && ($_POST['password'] === '3ELDEA')) {
+        session_start();
+        $_SESSION['logged_in'] = true;
+        $_SESSION['username'] = $_POST['username'];
+        header("Location: index.php");
+        exit;
+    } else {
+        $loginFormError = "Feil påloggingsinformasjon.";
+        $loginFormError = "Oi da! Noe gikk visst galt, prøv igjen senere.";
+    }
+}
+
 // Parameters that will be used in the template file
 $templateParameters["title"] = "Logg inn"; // Sets the page title
 
@@ -6,7 +20,26 @@ $templateParameters["title"] = "Logg inn"; // Sets the page title
 include_once("template/_header.php");
 ?>
 <h1>Logg inn</h1>
-<p>Her kan du logge inn</p>
+<?= 
+    !empty($loginFormError) 
+    ? '<p style="color: #db0000; font-weight: bold;">'.$loginFormError.'</p>'
+    : '<p>Fyll ut legitimasjonen din for å logge inn.</p>';
+?>
+
+<form method="post">
+    <!-- Hvorfor bry seg om CSRF?  -->
+    <label for="username">Brukernavn:</label>
+    <br>
+    <input type="text" id="username" name="username">
+    <br>
+    <label for="password">Passord:</label>
+    <br>
+    <input type="password" id="password" name="password">
+    <br>
+    <br>
+    <input type="submit" value="Bekreft">
+</form>
+
 <?php
 // Include the rest of the page
 include_once("template/_footer.php");

logout.php

@@ -0,0 +1,14 @@
+<?php
+// Initialize the session
+session_start();
+ 
+// Unset all of the session variables
+$_SESSION = [];
+ 
+// Destroy the session.
+session_destroy();
+ 
+// Redirect to login page
+header("location: login.php");
+exit;
+?>

style/main.css

@@ -31,9 +31,31 @@ h1, h2, h3, h4 {
     text-decoration: none;
 }
 
+.login-statusbar {
+    border-top: 2px solid #fff;
+    background: rgb(0,149,46);
+    background: linear-gradient(0deg, rgba(0,149,46,1) 0%, rgba(0,162,67,1) 50%, rgba(0,186,89,1) 100%);
+}
+
+.login-statusbar-inner {
+    max-width: 900px;
+    margin: 0 auto;
+    color: #fff;
+    font-weight: bold;
+    font-size: 12px;
+    padding-left: 12px;
+    padding-right: 12px;
+    padding-top: 4px;
+    padding-bottom: 4px;
+}
+
+.login-statusbar-inner > a {
+    color: #fff;
+}
+
 .grid-container {
     display: grid;
-    grid-template-columns: minmax(150px, auto) auto;
+    grid-template-columns: max-content auto;
     grid-gap: 12px;
 
     max-width: 900px;
@@ -54,7 +76,7 @@ nav {
 }
 
 nav > ul {
-    padding-right: 12px;
+    padding-right: 28px;
 }
 
 a {

template/_header.php

@@ -1,4 +1,5 @@
 <?php
+session_start();
 
 // When including this template from other directories, using relative url paths is not sufficient. Therefore we use a prefix to ensure that the correct url path is given.
 // Typically we put this before any local urls, such as navigation, icons etc to ensure that they use the correct path.
@@ -36,6 +37,15 @@ if ($templateParameters["render"] === false) {
         </div>
     </div>
 
+    <?php if ($_SESSION['logged_in'] === true) : ?>
+    <div class="login-statusbar">
+        <div class="login-statusbar-inner">
+            <a href="<?=$templateUrlPrefix;?>logout.php" style="float: right;">Logg ut</a>
+            <div>Inlogget som: <?=htmlspecialchars($_SESSION['username'])?></div>
+        </div>
+    </div>
+    <?php endif; ?>
+
     <div class="grid-container">
 
         <div>