peermaute · borstl · May 30, 2022 · May 30, 2022 · Jun 16, 2022 · Jun 16, 2022
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,5 @@
+.idea/
+.cache/
+dist/
+node_modules/
+package-lock.json
diff --git a/404.html b/404.html
@@ -0,0 +1,62 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <title>Page Not Found</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <style>
+    * {
+      line-height: 1.2;
+      margin: 0;
+    }
+
+    html {
+      color: #888;
+      display: table;
+      font-family: sans-serif;
+      height: 100%;
+      text-align: center;
+      width: 100%;
+    }
+
+    body {
+      display: table-cell;
+      vertical-align: middle;
+      margin: 2em auto;
+    }
+
+    h1 {
+      color: #555;
+      font-size: 2em;
+      font-weight: 400;
+    }
+
+    p {
+      margin: 0 auto;
+      width: 280px;
+    }
+
+    @media only screen and (max-width: 280px) {
+
+      body,
+      p {
+        width: 95%;
+      }
+
+      h1 {
+        font-size: 1.5em;
+        margin: 0 0 0.3em;
+      }
+
+    }
+  </style>
+</head>
+
+<body>
+  <h1>Page Not Found</h1>
+  <p>Sorry, but the page you were trying to view does not exist.</p>
+</body>
+
+</html>
+<!-- IE needs 512+ bytes: https://docs.microsoft.com/archive/blogs/ieinternals/friendly-http-error-pages -->
diff --git a/LICENSE.txt b/LICENSE.txt
@@ -0,0 +1,19 @@
+Copyright (c) HTML5 Boilerplate
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to do
+so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
diff --git a/Todos.md b/Todos.md
diff --git a/browserconfig.xml b/browserconfig.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Please read: https://msdn.microsoft.com/en-us/library/ie/dn455106.aspx -->
+<browserconfig>
+  <msapplication>
+    <tile>
+      <square70x70logo src="tile.png"/>
+      <square150x150logo src="tile.png"/>
+      <wide310x150logo src="tile-wide.png"/>
+      <square310x310logo src="tile.png"/>
+    </tile>
+  </msapplication>
+</browserconfig>
diff --git a/css/accordion.css b/css/accordion.css
@@ -0,0 +1,95 @@
+.wrapper {
+  max-width: 35em;
+  padding: 2em 0;
+  margin: 0 auto;
+}
+
+.wrap {
+  display: block;
+  line-height: 1.4em;
+  position: relative;
+  width: 100%;
+  margin: .5em 0;
+}
+
+.reasons input {
+  display: none;
+}
+
+.accordion-box {
+  position: relative;
+  display: flex;
+  align-items: center;
+  background-color: #1A3967;
+  color: #FFFFFF;
+  user-select: none;
+  box-shadow: 0 .5em 1em rgba(0, 0, 0, .16);
+  line-height: 2.9em;
+  font-size: 1.2em;
+  z-index: 1;
+}
+
+.accordion-label {
+  display: block;
+  position: absolute;
+  cursor: pointer;
+  z-index: 2;
+  opacity: 0;
+  height: 100%;
+  width: 100%;
+}
+
+.accordion-headline {
+  display: flex;
+  cursor: pointer;
+  padding-left: .8em;
+  width: 100%;
+}
+
+.cross {
+  padding: 0 .8em;
+}
+
+.cross:before, .cross:after {
+  content: '';
+  border-top: 2px solid #FFFFFF;
+  width: 15px;
+  display: block;
+  transition: 0.3s;
+}
+
+.cross:after {
+  transform: rotate(90deg);
+  margin-top: -2px;
+}
+
+.content {
+  box-sizing: border-box;
+  font-size: .9em;
+  margin: 0 .5em;
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height, .2s;
+}
+
+.content:after {
+  box-sizing: border-box;
+  font-size: 0.9em;
+  margin: .5em;
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height, all .25s ease-in-out;
+}
+
+.reasons input:checked ~ .content {
+  max-height: 125em;
+  transition: max-height, .2s;
+}
+
+.reasons input:checked ~ .accordion-box .cross:before {
+  transform: rotate(180deg);
+}
+
+.reasons input:checked ~ .accordion-box .cross:after {
+  transform: rotate(0deg);
+}
diff --git a/css/burgerMenu.css b/css/burgerMenu.css
@@ -0,0 +1,144 @@
+[role=navigation] {
+  display: block;
+  position: relative;
+  padding: 1.5em;
+}
+
+#menu-toggle {
+  height: 1.5em;
+  display: block;
+  position: relative;
+  z-index: 1;
+
+  -webkit-user-select: none;
+  user-select: none;
+}
+
+#burger {
+  user-select: none;
+}
+
+#menu button {
+  display: none;
+}
+
+#menu label {
+  display: flex;
+  justify-content: flex-start;
+  cursor: pointer;
+  padding: 1em;
+  text-decoration: none;
+  transition: color 0.3s ease;
+  width: 80%;
+  border-bottom: 0.1em solid #eff2f6;
+  font-size: 1.375em;
+  color: #1A3967;
+}
+
+#menu #first-reset {
+  border-top: 0.1em solid #eff2f6;
+}
+
+#menu label:hover {
+  color: #ed7f22;
+}
+
+#menu-toggle #burger {
+  display: block;
+  width: 2em;
+  height: 100%;
+  margin-bottom: 5px;
+  position: absolute;
+  top: auto;
+  left: auto;
+
+  cursor: pointer;
+
+  opacity: 0; /* hide this */
+  z-index: 2; /* and place it over the hamburger */
+
+  -webkit-touch-callout: none;
+}
+
+/*
+ * Just a quick hamburger
+ */
+#menu-toggle span {
+  display: block;
+  width: 2em;
+  height: 0.25em;
+  margin-bottom: 0.3125em;
+  position: relative;
+
+  background: #1A3967;
+  border-radius: 0.1875em;
+
+  z-index: 1;
+
+  transform-origin: 0.25em 0;
+
+  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
+  background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0),
+  opacity 0.55s ease;
+}
+
+#menu-toggle span:first-child {
+  transform-origin: 0 0;
+}
+
+#menu-toggle span:nth-last-child(2) {
+  transform-origin: 0 100%;
+}
+
+/*
+ * Transform all the slices of hamburger
+ * into a cross-mark.
+ */
+#menu-toggle input:checked ~ span {
+  opacity: 1;
+  transform: rotate(45deg) translate(-2px, -1px);
+  background: #1A3967;
+}
+
+/*
+ * But let's hide the middle one.
+ */
+#menu-toggle input:checked ~ span:nth-last-child(3) {
+  opacity: 0;
+  transform: rotate(0deg) scale(0.2, 0.2);
+}
+
+/*
+ * Oh-yeah and the last one should go the other direction
+ */
+#menu-toggle input:checked ~ span:nth-last-child(2) {
+  transform: rotate(-45deg) translate(0, -1px);
+}
+
+/*
+ * Make this absolute positioned
+ * at the top left of the screen
+ */
+#menu {
+  position: absolute;
+  width: 100vw;
+  height: 100vh;
+  right: -100%;
+
+  background: #ffffff;
+
+  list-style-type: none;
+  -webkit-font-smoothing: antialiased;
+  /* to stop flickering of text in safari */
+
+  transform-origin: 0 0;
+  transform: translate(100%, 0);
+
+  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
+}
+
+
+#menu-toggle #burger:checked ~ ul {
+  transform: none;
+}
+