Project restructure for better login

Restructure project into client / server to support a "pure javascript" gleam
project to work before the having enough info to launch the server components.

server/priv/static/layout.css

@@ -121,6 +121,12 @@ body {
     transition: all 0.2s;
 }
 
+.participant-login {
+    border: 2px dashed #005500;
+    padding: 1rem;
+    transition: all 0.2s;
+}
+
 .participant-hidden {
     border: 0px dashed #005500;
     padding: 1rem;
@@ -139,6 +145,12 @@ body {
     box-shadow: 0 0 20px rgba(0, 255, 0, 0.3);
 }
 
+.participant-login:hover {
+    border: 2px solid #00ff00;
+    background: rgba(0, 255, 0, 0.05);
+    box-shadow: 0 0 20px rgba(0, 255, 0, 0.3);
+}
+
 .participant-name {
     color: #00ff00;
     font-weight: bold;

server/priv/static/root.html

@@ -7,9 +7,26 @@
     <script src="/client.js" type="module"></script>
     <script id="model" type="application/json">
         [
-            "a",
-            "b",
-            "c"
+            {
+                "id": "abt",
+                "name": "Billettering",
+                "key": "T5X6"
+            },
+            {
+                "id": "slg",
+                "name": "Salg",
+                "key": "6B4T"
+            },
+            {
+                "id": "prs",
+                "name": "Personalisering",
+                "key": "P2Q5"
+            },
+            {
+                "id": "srp",
+                "name": "Support",
+                "key": "P2Q5"
+            }
         ]
     </script>
     <link href="/static/layout.css" rel="stylesheet" type="text/css">