From 35bf9207b8cbe7190bd50e0923e38066daa2e722 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Peter=20Babi=C4=8D?= <peter@peterbabic.dev>
Date: Tue, 9 Mar 2021 22:02:25 +0100
Subject: [PATCH] convert to float

---
 src/Triangle.svelte | 75 +++++++++------------------------------------
 1 file changed, 14 insertions(+), 61 deletions(-)

diff --git a/src/Triangle.svelte b/src/Triangle.svelte
index 74d1c87..4eb3eb9 100644
--- a/src/Triangle.svelte
+++ b/src/Triangle.svelte
@@ -285,77 +285,26 @@
 
 <style>
   .triangle {
-    position: relative;
+    text-align: center;
+    @apply transform rotate-70;
   }
-
   .triangle div {
-    position: absolute;
+    display: inline-block;
   }
 
   .div0 {
-    left: 120px;
-    top: 0px;
-  }
-  .div1 {
-    left: 90px;
-    top: 50px;
+    flex-basis: 100%;
+    text-align: center;
   }
+  .div1,
   .div2 {
-    left: 150px;
-    top: 50px;
-  }
-  .div3 {
-    left: 60px;
-    top: 100px;
-  }
-  .div4 {
-    left: 120px;
-    top: 100px;
-  }
-  .div5 {
-    left: 180px;
-    top: 100px;
-  }
-  .div6 {
-    left: 30px;
-    top: 150px;
-  }
-  .div7 {
-    left: 90px;
-    top: 150px;
-  }
-  .div8 {
-    left: 150px;
-    top: 150px;
-  }
-  .div9 {
-    left: 210px;
-    top: 150px;
-  }
-  .div10 {
-    left: 0px;
-    top: 200px;
-  }
-  .div11 {
-    left: 60px;
-    top: 200px;
-  }
-  .div12 {
-    left: 120px;
-    top: 200px;
-  }
-  .div13 {
-    left: 180px;
-    top: 200px;
-  }
-  .div14 {
-    left: 240px;
-    top: 200px;
+    flex-basis: 50%;
   }
 
   .circle {
-    width: 40px;
-    height: 40px;
+    width: 60px;
+    height: 60px;
+    display: inline-block;
     @apply rounded-full;
   }
 
@@ -519,5 +468,9 @@
         <!-- {i} -->
       </div>
     {/if}
+
+    {#if i == 0 || i == 2}
+      <p class="clear-both" />
+    {/if}
   {/each}
 </div>