add new sass stylesheet and refactor layout with semantic classes

1 files changed, 60 insertions, 64 deletions

diff --git a/source/entdecken/raeume.html.erb b/source/entdecken/raeume.html.erb
index 34e008d..b205ba0 100644
--- a/source/entdecken/raeume.html.erb
+++ b/source/entdecken/raeume.html.erb
@@ -1,67 +1,63 @@
 ---
 section: "entdecken"
 ---
-<div>
-
-  <h2>
-    [ Räume ]
-  </h2>
-  <p>
-    Das sublab besteht aus mehreren Räumen mit insgesamt ca. 200qm Grundfläche.<br>
-    Hier findest du eine kurze Auflistung der Räume mit ihrem Zweck, ihrem Zweck und Zustand<br>
-  </p>
-
-  <h3>Lounge</h3>
-  <%= image_with_thumb("lounge.jpg", caption: "Die Bar") %>
-  <p>
-    Der mit Abstand größte Raum des sublabs ist die Lounge. neben einer Bühne (ca. 5m x 3m) ist hier auch die Bar sowie
-    mehrere Sitzecken und der Kickertisch zu finden.
-  </p>
-
-  <h3>Werkstatt</h3>
-  <%= image_with_thumb("werkstatttisch.jpg", caption: "Die Werkstatt") %>
-  <p>
-    Wenn es etwas zu basteln, schrauben, messen oder löten gibt, dann ist die Werkstatt genau der richtige Ort zur Lösung
-    des Problems.<br> Hier finden sich nicht nur Werkzeuge sondern auch Verbrauchsmaterialien wie Schrumpfschläuche,
-    Widerstände, Platinen, ... <br>
-    Aber Achtung: nicht alles was rumliegt ist Public Domain! Im Zweifelsfall bitte nachfragen.
-  </p>
-
-  <h3>Hacklab</h3>
-  <%= image_with_thumb("hacklab.jpg", caption: "Das Hacklab") %>
-  <p>
-    Der Seminarraum im sublab aka. Hacklab ist nüchtern eingerichtet. Hierhin zieht man sich zurück, wenn man in Ruhe an
-    einem Projekt arbeiten will.<br>
-    Hier hängt ein riesiges Whiteboard (ca. 1,5m x 3m) an der Wand.
-  </p>
-
-  <h3>Uhrenraum</h3>
-  <%= image_with_thumb("uhrenraum.jpg", caption: "Der Uhrenraum") %>
-  <p>
-    Der Uhrenraum beherbergt neben der Ansteuerung für die Außenuhr auch eine gemütliche Sitzecke.<br>
-    Es ist der einzige Raum im sublab, in dem das Rauchen gestattet ist.
-  </p>
-
-  <h3>Büro</h3>
-  <%= image_with_thumb("buero.jpg", caption: "Das Büro") %>
-  <p>
-    Hier werden die wegweisenden Entscheidungen des Vorstandes des Trägervereins sublab e.V. gefällt. Wer diesen Raum
-    betritt, spürt die ganz besondere Atmosphäre sofort im gesamten Körper. (Spoiler: Es ist Jucken am ganzen Körper, weil
-    hier mal Steinwolle gelagert wurde)
-  </p>
-
-  <h3>Lager</h3>
-  <%= image_with_thumb("werkstattregal.jpg", caption: "Eines der Lagerregale (Werkstatt)") %>
-  <p>
-    Es gibt im sublab eine Menge an Lagerflächen und -regalen.
-    Im Lagerraum liegt nur ein Bruchteil der Teile, die man hier so haben will.
-  </p>
-
-  <h3>Getränkelager</h3>
-  <p>
-    Ist eigentlich kein richtiger Raum, dennoch aufgrund der enormen Wichtigkeit (Versorung der sublab-Mitglieder und
-    Besucher mit Getränken) durchaus erwähnenswert.<br>
-    Das Getränkelager befindet sich an einem geheimen Ort, der nur einem erlesenen Personenkreis bekannt ist.
-  </p>
-
-</div>
+<h2>
+  [ Räume ]
+</h2>
+<p>
+  Das sublab besteht aus mehreren Räumen mit insgesamt ca. 200qm Grundfläche.<br>
+  Hier findest du eine kurze Auflistung der Räume mit ihrem Zweck, ihrem Zweck und Zustand<br>
+</p>
+
+<h3>Lounge</h3>
+<%= image_with_thumb("lounge.jpg", caption: "Die Bar") %>
+<p>
+  Der mit Abstand größte Raum des sublabs ist die Lounge. neben einer Bühne (ca. 5m x 3m) ist hier auch die Bar sowie
+  mehrere Sitzecken und der Kickertisch zu finden.
+</p>
+
+<h3>Werkstatt</h3>
+<%= image_with_thumb("werkstatttisch.jpg", caption: "Die Werkstatt") %>
+<p>
+  Wenn es etwas zu basteln, schrauben, messen oder löten gibt, dann ist die Werkstatt genau der richtige Ort zur Lösung
+  des Problems.<br> Hier finden sich nicht nur Werkzeuge sondern auch Verbrauchsmaterialien wie Schrumpfschläuche,
+  Widerstände, Platinen, ... <br>
+  Aber Achtung: nicht alles was rumliegt ist Public Domain! Im Zweifelsfall bitte nachfragen.
+</p>
+
+<h3>Hacklab</h3>
+<%= image_with_thumb("hacklab.jpg", caption: "Das Hacklab") %>
+<p>
+  Der Seminarraum im sublab aka. Hacklab ist nüchtern eingerichtet. Hierhin zieht man sich zurück, wenn man in Ruhe an
+  einem Projekt arbeiten will.<br>
+  Hier hängt ein riesiges Whiteboard (ca. 1,5m x 3m) an der Wand.
+</p>
+
+<h3>Uhrenraum</h3>
+<%= image_with_thumb("uhrenraum.jpg", caption: "Der Uhrenraum") %>
+<p>
+  Der Uhrenraum beherbergt neben der Ansteuerung für die Außenuhr auch eine gemütliche Sitzecke.<br>
+  Es ist der einzige Raum im sublab, in dem das Rauchen gestattet ist.
+</p>
+
+<h3>Büro</h3>
+<%= image_with_thumb("buero.jpg", caption: "Das Büro") %>
+<p>
+  Hier werden die wegweisenden Entscheidungen des Vorstandes des Trägervereins sublab e.V. gefällt. Wer diesen Raum
+  betritt, spürt die ganz besondere Atmosphäre sofort im gesamten Körper. (Spoiler: Es ist Jucken am ganzen Körper, weil
+  hier mal Steinwolle gelagert wurde)
+</p>
+
+<h3>Lager</h3>
+<%= image_with_thumb("werkstattregal.jpg", caption: "Eines der Lagerregale (Werkstatt)") %>
+<p>
+  Es gibt im sublab eine Menge an Lagerflächen und -regalen.
+  Im Lagerraum liegt nur ein Bruchteil der Teile, die man hier so haben will.
+</p>
+
+<h3>Getränkelager</h3>
+<p>
+  Ist eigentlich kein richtiger Raum, dennoch aufgrund der enormen Wichtigkeit (Versorung der sublab-Mitglieder und
+  Besucher mit Getränken) durchaus erwähnenswert.<br>
+  Das Getränkelager befindet sich an einem geheimen Ort, der nur einem erlesenen Personenkreis bekannt ist.
+</p>