From e2602b4806689720ce717c20c4cb1e67b6908410 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Tue, 31 Mar 2020 20:02:55 +0200
Subject: [PATCH] Counter: Redefine each column's height on browser resize as
 well

---
 src/atoms/Counter.svelte | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/atoms/Counter.svelte b/src/atoms/Counter.svelte
index 3edb8fe..4917769 100644
--- a/src/atoms/Counter.svelte
+++ b/src/atoms/Counter.svelte
@@ -16,18 +16,26 @@
     $: digits = index.split('')
 
 
-    /*
-    ** Run code when mounted
-    */
-    onMount(() => {
+    // Set columns height
+    const setColumnHeight = () => {
         // Set each digit column's height = its spans combined (in order to translate in tens of %)
         counter.querySelectorAll('div').forEach(column => {
             const spans = column.querySelectorAll('span')
             column.style.height = spans[0].offsetHeight * spans.length + 'px'
         })
+    }
+
+
+    /*
+    ** Run code when mounted
+    */
+    onMount(() => {
+        setColumnHeight()
     })
 </script>
 
+<svelte:window on:resize={setColumnHeight} />
+
 <div class="counter {className}" bind:this={counter}>
     {#each digits as digit}
     <div class="counter__column" style="transform: translateY(-{digit}0%);">