error page

templates/errors/internal-server-error.html

@@ -0,0 +1,12 @@
+<. include!("../components/headers.html"); .>
+<main>
+  <div class="inner-container">
+    <div class="error-box">
+      <h1 class="error-title"><.= title .></h1>
+      <p class="error-message"><.= message .></p>
+    </div>
+  </div>
+  <!-- end of container -->
+</main>
+
+<. include!("../components/footers.html"); .>

templates/errors/main.scss

@@ -0,0 +1,45 @@
+/*
+ * Copyright (C) 2021  Aravinth Manivannan <realaravinth@batsense.net>
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+@import '../reset';
+@import '../vars';
+
+.error-box {
+  display: flex;
+  flex-direction: column;
+  width: 90%;
+  justify-content: center;
+  align-items: center;
+  box-sizing: content-box;
+  background-color: $white;
+  margin: auto;
+  padding-bottom: 30px;
+}
+
+.error-title {
+  padding-left: 10px;
+  font-size: 1rem;
+  padding: 0.75rem 1.25rem;
+  box-sizing: border-box;
+  text-align: left;
+  width: 100%;
+  border-bottom: 0.1px solid $light-grey;
+}
+
+.error-message {
+  text-align: center;
+}