Differences

This shows you the differences between two versions of the page.

--- handleiding_nieuw:spacematrix:h2 [2025/04/14 15:44] – support
+++ handleiding_nieuw:spacematrix:h2 [2025/04/14 16:13] (current) – support
@@ Line 43: / Line 43: @@
     display: none;
     margin-bottom: 3em;
+  }
+  .projectgrid {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 1em;
+    margin: 1em 0;
+  }
+  .projectgrid img {
+    max-width: 400px;
+    width: 100%;
+    border-radius: 6px;
+    border: 1px solid #aaa;
+  }
+  .kengetallen {
+    background-color: #f2f2f2;
+    padding: 1em;
+    border-radius: 6px;
+    border: 1px solid #ccc;
+  }
+  .kengetallen table {
+    width: 100%;
+    border-collapse: collapse;
+  }
+  .kengetallen td {
+    padding: 0.3em 0.6em;
+    border-bottom: 1px solid #ddd;
   }
 </style>
@@ Line 77: / Line 103: @@
 </div>
-<!-- BATTERSEA PROJECT -->
+<!-- BATTERSEA -->
 <div class="projectblok" data-fsi="3.0" data-gsi="0.61" data-osr="0.32" id="battersea">
-  <h2>Voorbeeld: Battersea Power Station, Londen</h2>
+  <h2>Battersea Power Station, Londen</h2>
-  <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:battersea_overzicht.jpg" alt="Battersea overzicht" width="100%">
+  <div class="projectgrid">
-  <p><strong>Kengetallen:</strong><br>
+    <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:battersea_overzicht.jpg" alt="Battersea overzicht" />
-    FSI: 3.0<br>
+    <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:battersea_straat1.jpg" alt="Straatbeeld Battersea 1" />
-    GSI: 0.61<br>
+    <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:battersea_straat2.jpg" alt="Straatbeeld Battersea 2" />
-    OSR: 0.32<br>
+    <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:battersea_straat3.jpg" alt="Straatbeeld Battersea 3" />
-    Bijzonderheden: Industrieel icoon getransformeerd tot hoogstedelijk woon-werkgebied met luxe voorzieningen.
+  </div>
-  </p>
+  <div class="kengetallen">
+    <table>
+      <tr><td>FSI</td><td>3,0</td></tr>
+      <tr><td>GSI</td><td>0,61</td></tr>
+      <tr><td>Gem. aantal lagen</td><td>8–10</td></tr>
+      <tr><td>OSR</td><td>0,32</td></tr>
+      <tr><td>Bijzonderheden</td><td>Industrieel icoon getransformeerd tot hoogstedelijk woon-werkgebied met luxe voorzieningen.</td></tr>
+    </table>
+  </div>
 </div>
-<!-- NINE ELMS PROJECT -->
+<!-- NINE ELMS -->
 <div class="projectblok" data-fsi="2.4" data-gsi="0.53" data-osr="0.45" id="nine-elms">
-  <h2>Voorbeeld: Nine Elms Park</h2>
+  <h2>Rive Gauche - Parijs</h2>
-  <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:nineelms_overzicht.jpg" alt="Nine Elms overzicht" width="100%">
+  <div class="projectgrid">
-  <p><strong>Kengetallen:</strong><br>
+    <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:nineelms_overzicht.jpg" alt="Nine Elms overzicht" />
-    FSI: 2.4<br>
+    <img src="https://www.sumsonite.nl/wiki/lib/exe/fetch.php?media=handleiding_nieuw:spacematrix:h2:nineelms_straat1.jpg" alt="Straatbeeld Nine Elms 1" />
-    GSI: 0.53<br>
+  </div>
-    OSR: 0.45<br>
+  <div class="kengetallen">
-    Bijzonderheden: Recent ontwikkeld gebied met hoogstedelijk wonen langs de Thames, gericht op menging van wonen en publieke ruimte.
+    <table>
-  </p>
+      <tr><td>FSI</td><td>2,4</td></tr>
+      <tr><td>GSI</td><td>0,53</td></tr>
+      <tr><td>Gem. aantal lagen</td><td>6–8</td></tr>
+      <tr><td>OSR</td><td>0,45</td></tr>
+      <tr><td>Bijzonderheden</td><td>Recent ontwikkeld gebied met hoogstedelijk wonen langs de Thames, gericht op menging van wonen en publieke ruimte.</td></tr>
+    </table>
+  </div>
 </div>