Add icons, add validation, add phone and email types, add css fixes

Customizations/Layouts/Bookcases.ts

@@ -1,29 +1,20 @@
 import {Layout} from "../Layout";
 import * as Layer from "../Layers/Bookcases";
+import Translations from "../../UI/i18n/Translations";
+import Combine from "../../UI/Base/Combine";
 
-export class Bookcases extends Layout{
+export class Bookcases extends Layout {
     constructor() {
-        super(    "bookcases",
-            ["nl"],
-            "Open Bookcase Map",
+        super("bookcases",
+            ["nl", "en"],
+            Translations.t.bookcases.title,
             [new Layer.Bookcases()],
             14,
             51.2,
             3.2,
 
-
-            "        <h3>Open BoekenkastjesKaart</h3>\n" +
-            "\n" +
-            "<p>" +
-            "Help mee met het creëeren van een volledige kaart met alle boekenruilkastjes!" +
-            "Een boekenruilkastje is een vaste plaats in publieke ruimte waar iedereen een boek in kan zetten of uit kan meenemen." +
-            "Meestal een klein kastje of doosje dat op straat staat, maar ook een oude telefooncellen of een schap in een station valt hieronder."+
-            "</p>"
-            ,
-            "  <p>Begin met <a href=\"https://www.openstreetmap.org/user/new\" target=\"_blank\">het aanmaken van een account\n" +
-            "            </a> of door je " +
-            "            <span onclick=\"authOsm()\" class=\"activate-osm-authentication\">aan te melden</span>.</p>",
-            "Klik op een boekenruilkastje om vragen te beantwoorden");
-        this.locationContains= ["Bookcases.html", "Bookcase.html","bookcase"]
+            new Combine(["<h3>",Translations.t.bookcases.title,"</h3>", Translations.t.bookcases.description])
+        );
+        this.icon = "assets/bookcase.svg"
     }
 }

Customizations/Layouts/Cyclofix.ts

@@ -10,7 +10,7 @@ import Combine from "../../UI/Base/Combine";
 export default class Cyclofix extends Layout {
     constructor() {
         super(
-            "pomp",
+            "cyclofix",
             ["en", "nl", "fr"],
             Translations.t.cyclofix.title,
             [new BikeServices(), new BikeShops(), new DrinkingWater(), new BikeParkings()],
@@ -25,6 +25,8 @@ export default class Cyclofix extends Layout {
                 "</p>"
             ])
         );
-        this.icon = "./assets/bike/pump.svg"
+        this.icon = "./assets/bike/logo.svg"
+        this.description = "Easily search and contribute bicycle data nearby";
+        this.socialImage = "./assets/bike/cyclofix.jpeg"
     }
 }

Customizations/Layouts/Groen.ts

@@ -9,7 +9,7 @@ export class Groen extends Layout {
     constructor() {
         super("buurtnatuur",
             ["nl"],
-            "Buurtnatuur",
+            "Buurtnatuur.be",
             [new NatureReserves(), new Park(), new Bos(), new Viewpoint()],
             10,
             50.8435,
@@ -52,6 +52,9 @@ export class Groen extends Layout {
             "</small>"
         );
         
+        this.icon = "assets/groen.svg"
         this.locationContains = ["buurtnatuur.be"]
+        this.socialImage = "assets/BuurtnatuurFront.jpg"
+        this.description = "Met deze tool kan je natuur in je buurt in kaart brengen en meer informatie geven over je favoriete plekje"
     }
 }

Customizations/Layouts/MetaMap.ts

@@ -15,5 +15,6 @@ export class MetaMap extends Layout{
 
             "        <h3>Open Map Map</h3>\n" +
             "This map is a map of physical maps, as known by OpenStreetMap.");
+        this.icon = "assets/osm-logo-buggy-attr.svg"
     }
 }

Customizations/Layouts/Natuurpunt.ts

@@ -18,5 +18,6 @@ export class Natuurpunt extends Layout{
             "",
             ""
         );
+        this.icon = "./assets/nature/birdhide.svg"
     }
 }

Customizations/Layouts/Statues.ts

@@ -4,8 +4,8 @@ import {Artwork} from "../Layers/Artwork";
 export class Statues extends Layout{
     constructor() {
         super(    "statues",
-            "Open Artwork Map",
             ["en"],
+            "Open Artwork Map",
             [new Artwork()],
             10,
             50.8435,

Customizations/Layouts/StreetWidth.ts

@@ -84,9 +84,9 @@ export class StreetWidth extends Layout{
             "<li>Het aantal woonerven uitbreiden</li>" +
             "<li>Grotere auto's meer belasten - ze nemen immers meer parkeerruimte in.</li>" +
             "<li>Laat toeristen verplicht parkeren onder het zand; een (fiets)taxi kan hen naar hun hotel brengen</li>" +
-            "<li>Voorzie in elke straat enkele parkeerplaatsen voor kortparkeren. Zo kunnen leveringen, iemand afzetten,... gebeuren zonder dat er een fietspad of een straat geblokkeerd wordt</li>"+
-            "</ul>",
-            "",
-            "");
+            "<li>Voorzie in elke straat enkele parkeerplaatsen voor kortparkeren. Zo kunnen leveringen, iemand afzetten,... gebeuren zonder dat er een fietspad of een straat geblokkeerd wordt</li>" +
+            "</ul>");
+        this.icon = "assets/bug.svg";
+
     }
 }