FAQ

content/faq.md

@@ -0,0 +1,49 @@
+---
+title: Frequently Asked Questions
+date: '2020-03-02'
+---
+(und auch Fragen, die sich zu stellen noch niemand traute)
+
+## Wie läuft das mit Getränken?
+
+Gekühlte Biers sowie Wasser, Softdrinks und ein paar Überraschungen organisieren wir für euch. Vor Ort setzen wir dann auf eine **Kasse des Vertrauens**. Ihr schätzt selbst ein, was ihr getrunken habt und werft entsprechenden Betrag einfach in die Kasse. (**Selbstkostenpreise**)
+
+<br />
+
+## Was gibts zu essen?
+
+Nur Gutes, versprochen! Abhängig davon, was ihr bei der Anmeldung über eure Ernährung angegeben habt, wird für jeden und jede etwas dabei sein.
+
+Morgens bis Mittags gibt es ein ausgedehntes Frühstück, Abends eine ordentliche Mahlzeit. (Wie in der Anmeldung angegeben)
+
+<br />
+
+## Komme ich da auch mit öffentlichen Verkehrsmitteln hin?
+
+Nervig, aber geht!
+Ab **Limburg (Lahn)** ist man in ca. 45 Minuten im Dorf **65558 Langenscheid**.
+
+Von da aus ist man in ein paar Fußminuten beim Haus.
+
+Sprich dich am besten mit anderen ab und bildet eine Fahrgemeinschaft.
+
+<br />
+
+## Wie setzt sich die Basiskosten zusammen?
+
+Die Hütte nimmt uns pro Person einen Betrag von **26€** ab.
+Dazu kommt am Ende noch eine pauschale **Reinigungsgebühr** von 85€ sowie die Kosten für das Frühstück am Samstag und am Sonntag.
+
+Am Ende landen wir so bei 40€ / Person.
+
+<br />
+
+## Wie wird geschlafen?
+
+Wie ein Apfel, mit dem Stil nach oben!
+
+Ansonsten gibt es Mehrbettzimmer mit je 3 bis 8 Betten.
+
+<br />
+
+Wenn weitere Fragen auftreten, werden wir sie hier mit auflisten.

content/location.md

@@ -47,7 +47,7 @@ Daubachtal 1\
     <article class="card">
         <div class="card-header">
             <strong>Aufenthaltsraum</strong><br />
-            Von innen viel größer
+            Von innen viel größer. 80qm
         </div>
         <div class="card-body text-center">
             <a href="https://www.guelle-muehle.de/galerie.html" target="_blank">

layouts/partials/navigation.html

@@ -22,6 +22,11 @@
           <a href='{{ "merch/" | absURL }}'>
             <li {{$classString | safeHTMLAttr}}>Merchandise</li>
           </a>
+
+          {{ if (eq .Permalink (string ("faq/" | absURL))) }}{{ $classString = "class='active'" }}{{else}}{{$classString = ""}}{{ end }}
+          <a href='{{ "faq/" | absURL }}'>
+            <li {{$classString | safeHTMLAttr}}>FAQ</li>
+          </a>
         </ul>
       </div>
       <div class="nav-right">

layouts/partials/sidebar.html

@@ -16,5 +16,8 @@
         <a href='{{ "merch/" | absURL }}'>
             <li>Merchandise</li>
         </a>
+        <a href='{{ "faq/" | absURL }}'>
+            <li>FAQ</li>
+        </a>
     </ul>
 </div>

src/style/_form.scss

@@ -5,6 +5,12 @@
     max-width: 600px;
     flex-wrap: wrap;
     flex-direction: row;
+    padding: 5px;
+
+    &.success {
+        background-color: #DAFFDA;
+        border-radius: 10px;
+    }
 
     label {
         display: block;

src/style/combined.scss

@@ -70,12 +70,17 @@ body {
 
 h1,h2,h3,h4,h5,h6 {
   font-family: "SFMoviePoster", system-ui, sans-serif;
+  line-height: normal;
 }
 
 h1 {
   font-size: 4rem;
 }
 
+h2 {
+  font-size: 3rem;
+}
+
 h2,h3 {
   margin-top: 20px;
 }
@@ -155,6 +160,13 @@ input.btn, a.btn {
       color: #333 !important;
     }
   }
+
+  &:disabled, &:disabled:hover {
+    color: #CCC !important;
+    background-color: unset;
+    border-color: #ccc;
+    cursor: default;
+  }
 }
 
 body.hero {

src/typescript/script.ts

@@ -60,7 +60,13 @@ window.onload = function() {
         
             // Cleanup
             e.target.reset();
-            alert("Anmeldung abgeschickt");
+            e.target.classList.add("success");
+            const submitButton = e.target.querySelectorAll("input, select, textarea");
+            for (let i = 0; i < submitButton.length; i++) {
+                submitButton[i].setAttribute("disabled", "disabled");
+            }
+
+            alert("Erfolgreich abgeschickt!");
             e.preventDefault();
           });
     }

static/css/ndws.css

@@ -6127,6 +6127,11 @@ footer .footer-row img {
   max-width: 600px;
   flex-wrap: wrap;
   flex-direction: row;
+  padding: 5px;
+}
+.form.success {
+  background-color: #daffda;
+  border-radius: 10px;
 }
 .form label {
   display: block;
@@ -8093,12 +8098,17 @@ h4,
 h5,
 h6 {
   font-family: 'SFMoviePoster', system-ui, sans-serif;
+  line-height: normal;
 }
 
 h1 {
   font-size: 4rem;
 }
 
+h2 {
+  font-size: 3rem;
+}
+
 h2,
 h3 {
   margin-top: 20px;
@@ -8184,6 +8194,15 @@ input.btn.btn-light:hover,
 a.btn.btn-light:hover {
   color: #333 !important;
 }
+input.btn:disabled,
+input.btn:disabled:hover,
+a.btn:disabled,
+a.btn:disabled:hover {
+  color: #ccc !important;
+  background-color: unset;
+  border-color: #ccc;
+  cursor: default;
+}
 
 body.hero {
   background: linear-gradient(-45deg, #000, maroon, #000);

static/js/script.js

@@ -49,7 +49,12 @@ window.onload = function () {
             xmlHttp.send();
             // Cleanup
             e.target.reset();
-            alert("Anmeldung abgeschickt");
+            e.target.classList.add("success");
+            var submitButton = e.target.querySelectorAll("input, select, textarea");
+            for (var i = 0; i < submitButton.length; i++) {
+                submitButton[i].setAttribute("disabled", "disabled");
+            }
+            alert("Erfolgreich abgeschickt");
             e.preventDefault();
         });
     }