ui: style remaining pages

Mostly, this reduces to displaying the short content inside a more narrow block, fitting into the horizontal header and footer limits.

templating/templates/addFailure.html

@@ -1,7 +1,9 @@
-{{define "title"}}Fehler{{end}}
+{{define "title"}}Sprechstunde anlegen – Fehler{{end}}
 
 {{define "content"}}
-Irgendetwas ist schief gegangen. Bitte sende folgende Daten an <a href="mailto:sprechstundentool@mathebau.de">sprechstundentool@mathebau.de</a> mit einer Beschreibung, was du tun wolltest.
+<div class="col-md-8 offset-md-2">
-<br>
+  Irgendetwas ist schief gegangen. Bitte sende folgende Daten an <a href="mailto:sprechstundentool@mathebau.de">sprechstundentool@mathebau.de</a> mit einer Beschreibung, was du tun wolltest.
-{{.}}
+  <br>
+  {{.}}
+</div>
 {{end}}

templating/templates/addMask.html

@@ -137,7 +137,7 @@
       </div>
 
       <div class="text-center">
-        <button class="btn btn-primary" type="submit">Sprechstunde erstellen</button>
+        <button class="btn btn-outline-primary" type="submit">Sprechstunde erstellen</button>
       </div>
     </form>
   </div>

templating/templates/addSuccess.html

@@ -1,5 +1,7 @@
 {{define "title"}}Sprechstunde anlegen{{end}}
 
 {{define "content"}}
-Die Sprechstunde wurde angelegt. Du solltest eine Mail mit einem Aktivierungslink erhalten haben.
+<div class="col-md-8 offset-md-2">
+  Die Sprechstunde wurde angelegt. Du solltest eine Mail mit einem Aktivierungslink erhalten haben.
+</div>
 {{end}}

templating/templates/base.html

@@ -24,7 +24,7 @@
     </div>
 
     <div id="content">
-      <h1 class="h3 m-1 mb-3">{{template "title" .}}</h1>
+      <h1 class="h3 m-1 mb-3 text-center">{{template "title" .}}</h1>
       {{block "content" .}}Du solltest dies nicht sehen.{{end}}
     </div>
   </div>

templating/templates/deleteFailure.html

@@ -1,5 +1,7 @@
-{{define "title"}}Sprechstunde löschen{{end}}
+{{define "title"}}Sprechstunde löschen – Fehler{{end}}
 
 {{define "content"}}
-Das Löschen der Sprechstunde ist fehlgeschlagen: {{.Error}}
+<div class="col-md-8 offset-md-2">
+  Das Löschen der Sprechstunde ist fehlgeschlagen: {{.Error}}
+</div>
 {{end}}

templating/templates/deleteSuccess.html

@@ -1,6 +1,8 @@
 {{define "title"}}Sprechstunde löschen{{end}}
 
 {{define "content"}}
-Du solltest eine Mail mit einem Bestätigungslink erhalten haben. <br>
+<div class="col-md-8 offset-md-2">
-Sie wurde an die Adresse geschickt, mit der die Sprechstunde angelegt wurde.<br>
+  Du solltest eine Mail mit einem Bestätigungslink erhalten haben. <br>
+  Sie wurde an die Adresse geschickt, mit der die Sprechstunde angelegt wurde.<br>
+</div>
 {{end}}

templating/templates/executeFailure.html

@@ -1,7 +1,9 @@
 {{define "title"}}Anfrage ausführen fehlgeschlagen{{end}}
 
 {{define "content"}}
-Irgendetwas ist schief gegangen. Bitte sende folgende Daten an <a href="mailto:sprechstundentool@mathebau.de">sprechstundentool@mathebau.de</a> mit einer Beschreibung, was du tun wolltest.
+<div class="col-md-8 offset-md-2">
-<br>
+  Irgendetwas ist schief gegangen. Bitte sende folgende Daten an <a href="mailto:sprechstundentool@mathebau.de">sprechstundentool@mathebau.de</a> mit einer Beschreibung, was du tun wolltest.
-{{.}}
+  <br>
+  {{.}}
+</div>"
 {{end}}

templating/templates/executeSuccess.html

@@ -1,5 +1,7 @@
 {{define "title"}}Anfrage ausgeführt{{end}}
 
 {{define "content"}}
-Deine Anfrage wurde ausgeführt.
+<div class="col-md-8 offset-md-2">
+  Deine Anfrage wurde ausgeführt.
+</div>
 {{end}}

templating/templates/index.html

@@ -9,38 +9,40 @@ Sprechstunden
 {{end}}
 
 {{define "content"}}
-<form method="GET" action="/getByCourse">
+<div id="queryMask" class="col-md-8 offset-md-2">
-  <div class="input-group mb-3">
+  <form method="GET" action="/getByCourse">
-    <div class="form-floating col-lg-8">
+    <div class="input-group mb-3">
-      <select class="form-control form-select" name="veranstaltung" id="veranstaltung" size="1" onchange="document.forms[0].submit()">
+      <div class="form-floating col-lg-8">
-        <option value="">–– auswählen ––</option>
+        <select class="form-control form-select" name="veranstaltung" id="veranstaltung" size="1" onchange="document.forms[0].submit()">
-        {{range $course := .Courses}}
+          <option value="">–– auswählen ––</option>
-        <option value="{{$course.Id}}"{{if eq $course.Id $.SelectedCourse}} selected{{end}}>{{$course.Name}}</option>
+          {{range $course := .Courses}}
-        {{end}}
+          <option value="{{$course.Id}}"{{if eq $course.Id $.SelectedCourse}} selected{{end}}>{{$course.Name}}</option>
-      </select>
+          {{end}}
-      <label for="veranstaltung">Veranstaltung</label>
+        </select>
+        <label for="veranstaltung">Veranstaltung</label>
+      </div>
+      <noscript>
+        <button class="btn btn-sm btn-outline-secondary col-lg-4" type="submit">Los!</button>
+      </noscript>
     </div>
-    <noscript>
+  </form>
-      <button class="btn btn-sm btn-outline-secondary col-lg-4" type="submit">Los!</button>
+  <form method="GET" action="/getByRoom">
-    </noscript>
+    <div class="input-group mb-3">
-  </div>
+      <div class="form-floating">
-</form>
+        <select class="form-control form-select" name="raum" id="raum" size="1" onchange="document.forms[1].submit()">
-<form method="GET" action="/getByRoom">
+          <option value="">–– auswählen ––</option>
-  <div class="input-group mb-3">
+          {{range $room := .Rooms}}
-    <div class="form-floating">
+          <option value="{{$room.Id}}"{{if eq $room.Id $.SelectedRoom}} selected{{end}}>{{$room.Name}}</option>
-      <select class="form-control form-select" name="raum" id="raum" size="1" onchange="document.forms[1].submit()">
+          {{end}}
-        <option value="">–– auswählen ––</option>
+        </select>
-        {{range $room := .Rooms}}
+        <label for="raum">Raum</label>
-        <option value="{{$room.Id}}"{{if eq $room.Id $.SelectedRoom}} selected{{end}}>{{$room.Name}}</option>
+      </div>
-        {{end}}
+      <noscript>
-      </select>
+        <button class="btn btn-outline-secondary col-lg-4" type="submit">Los!</button>
-      <label for="raum">Raum</label>
+      </noscript>
     </div>
-    <noscript>
+  </form>
-      <button class="btn btn-outline-secondary col-lg-4" type="submit">Los!</button>
+</div>
-    </noscript>
-  </div>
-</form>
 <div id="timetable" style="overflow-x: scroll;">
   {{.Timetable}}
 </div>

templating/templates/requestNotFound.html

@@ -1,12 +1,19 @@
 {{define "title"}}Anfrage bestätigen fehlgeschlagen{{end}}
 
 {{define "content"}}
-<p>
+<div class="col-md-8 offset-md-2">
-  Dieser Bestätigungscode ist nicht verfügbar. <br>
+  <p>
-  Bitte gib deinen Bestätigungscode hier ein.
+    Dieser Bestätigungscode ist nicht verfügbar. <br>
-</p>
+    Bitte gib deinen Bestätigungscode hier ein.
-<form action="/confirmRequest">
+  </p>
-  <label for="code">Bestätigungscode</label>: <input type="text" name="code" id="code">
+  <form action="/confirmRequest">
-  <input type="submit">
+    <div class="input-group">
+      <div class="form-floating">
+        <input class="form-control required" type="text" name="code" id="code" required placeholder="Bestätigungscode" />
+        <label for="code">Bestätigungscode</label>
+      </div>
+      <button class="btn btn-outline-primary" type="submit">Bestätigen</button>
+    </div>
+</div>
 </form>
 {{end}}