Add custom login page

header.php

@@ -341,14 +341,8 @@
     //
     // If auth is required and not set, i.e. no successfully logged in,
     // we show the reduced version of the summary (index) page
-    if(!$auth && (!isset($indexpage) || isset($_GET['login']))){ ?>
-<div class="page-header">
-    <h1>Login required!</h1>
-</div>
-<form action="" method="POST">
-  Password: <input type="password" name="pw">&nbsp;<input type="submit" value="Login">
-</form>
-<?php
+    if(!$auth && (!isset($indexpage) || isset($_GET['login']))){
+        require "php/loginpage.php";
         require "footer.php";
         exit();
     }

php/loginpage.php

@@ -0,0 +1,19 @@
+<div class="row">
+  <div class="col-sm-8 col-sm-offset-2">
+  <center>
+    <img src="img/lock.svg" width="60%">
+    <div class="page-header">Protected page</div>
+    <form action="" method="POST">
+        <div class="form-group <?php if($wrongpassword){ ?>has-error<?php } ?> input-lg">
+        <?php if($wrongpassword){ ?><label class="control-label" for="inputError"><i class="fa fa-times-circle-o"></i> Wrong password!</label><?php } ?>
+        <div class="input-group">
+            <input type="password" class="form-control " name="pw" placeholder="Enter password to continue">
+            <span class="input-group-btn">
+              <button type="submit" class="btn btn-info btn-flat <?php if($wrongpassword){ ?>btn-danger<?php } ?>">Submit</button>
+          </span>
+          </div>
+      </div>
+  </form>
+</center>
+</div>
+</div>

php/password.php

@@ -20,6 +20,8 @@
         session_unset();
     }
 
+    $wrongpassword = false;
+
     // Test if password is set
     if(strlen($pwhash) > 0)
     {
@@ -32,6 +34,10 @@
                 $_SESSION["hash"] = $pwhash;
                 $auth = true;
             }
+            else
+            {
+                $wrongpassword = true;
+            }
         }
         // Compare auth hash with saved hash
         else if (isset($_SESSION["hash"]))