feat: rotated table display

routes/templates/room.gohtml

@@ -35,7 +35,7 @@
         <script src="https://unpkg.com/htmx.org/dist/ext/sse.js"></script>
         <div
           id="roomTextContainer"
-          class="bg-blue-200 grid place-content-center"
+          class="grid place-content-center"
           hx-ext="sse"
           sse-connect="/rooms/subscribe?roomName={{ .Room.Name }}"
         >

routes/templates/tableTemplates.gohtml

@@ -67,7 +67,10 @@
 <h2>Now for a person</h2>
 {{ define "personBlocks"  }}
 
-<div>
+<div class="person-bricks "
+     id="person-{{.Index}}"
+     style="--i: {{ .Index }}"
+     >
   {{ range (bricksForPerson .) }}
   {{ template "brick"  .  }}
   {{ end }}
@@ -79,11 +82,14 @@
 
 <h2>And now i'll want to get all persons for a room</h2>
   {{ define "roomPeople"  }}
+  {{ with  (personsFromRoom .)}}
   <div
-    class="flex flex-row"
+    class="circle-container relative"
+    style="--tan: {{ .Tangens }};  --m: {{ .Total }};"
     >
-    {{ range (personsFromRoom .) }}
+    {{ range .Persons }}
     {{ template "personBlocks" . }}
     {{ end }}
   </div>
+  {{ end }}
   {{end}}