logout button

pass/public/styles/base.less

@@ -115,13 +115,19 @@ button {
   text-decoration: none;
   background-color: @color-secondary;
   width: max-content;
-
   &:hover {
     color: inherit;
     background-color: fade(@color-secondary, 70%);
     border-color: @color-main;
     color: fade(white, 90%);
   }
+  &.negative {
+    background-color: @color-negative;
+    &:hover {
+      background-color: fade(@color-negative, 70%);
+      color: white;
+    }
+  }
 }
 
 nav#primary-nav {

pass/public/styles/misc/vars.less

@@ -2,6 +2,7 @@
 @color-secondary: #3a3af9;
 @color-main-hover: lighten(@color-main, 5%);
 @color-main-font-color: white;
+@color-negative: rgba(255, 0, 0, 0.432);
 
 @font-color-on-white: #515151;
 

pass/routes/key.js

@@ -16,6 +16,13 @@ router.get("/create", function (req, res, next) {
   });
 });
 
+router.get("/remove", (req, res) => {
+  if (req.cookies.key) {
+    res.clearCookie("key");
+  }
+  res.redirect("/");
+})
+
 router.get("/enter", function (req, res, next) {
   if (req.cookies.key) {
     res.redirect("/key/" + encodeURIComponent(req.cookies.key));
@@ -106,6 +113,7 @@ router.use("/:key", param("key").isUUID(4), async (req, res, next) => {
       settings_url: metager_url,
       qr: qr_data_uri,
     },
+    cookies: req.cookies,
     page: "fill",
     links: {
       fill_url: `/key/${req.params.key}`,
@@ -116,7 +124,9 @@ router.use("/:key", param("key").isUUID(4), async (req, res, next) => {
   });
 
   if (!req.data.admin && (!req.cookies.key || req.cookies.key !== req.data.key.key)) {
-    res.cookie("key", req.data.key.key);
+    res.cookie("key", req.data.key.key, {
+      sameSite: "lax"
+    });
   }
 
   next("route");

pass/views/templates/page_header.ejs

@@ -42,7 +42,11 @@
       <li><a href="#">Hilfe</a></li>
       <li class="whitespace"></li>
       <li><a href="/key/enter">Schlüssel verwalten</a></li>
-      <li><a href="/key/create" class="button">Starten</a></li>
+      <%_ if((typeof cookies !== "undefined" && typeof cookies.key !== "undefined") || typeof key !== "undefined") { _%>
+      <li><a href="/key/remove" class="button negative" id="key-remove">Schlüssel entfernen</a></li>
+      <%_ } else { _%>
+        <li><a href="/key/create" class="button">Starten</a></li>
+      <%_ } _%>
     </ul>
   </nav>
   <main>
\ No newline at end of file