Add rain bar

mmz-srf · Oct 2, 2023 · 5680f47 · 5680f47
1 parent f518f6d
commit 5680f47
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/client/src/lib/SingleDay.svelte b/client/src/lib/SingleDay.svelte
@@ -8,15 +8,24 @@
   export let rainInMM;
   export let size;
 
+  rainInMM = 8;
+
   const isNow = currentTime === "Jetzt";
   const fontWeight = isNow ? "font-bold" : "font-light";
 </script>
 
 <div class="flex flex-col items-center">
   <div class={fontWeight}>{currentTime}</div>
   <WeatherIcons {symbol} {dimensions} />
-  <div>{dailyTemp}°</div>
+  <div class="mb-4">{dailyTemp}°</div>
   {#if size === "L"}
-    <div>{rainInMM}</div>
+    <div class="h-8 w-full flex flex-col-reverse items-center">
+      <div
+        class="bg-sky-500 w-1/2 max-h-8 relative flex flex-col items-center"
+        style={`height: ${rainInMM * 2.5}px;`}
+      >
+        <span class="absolute font-light">{rainInMM}</span>
+      </div>
+    </div>
   {/if}
 </div>
diff --git a/client/src/lib/WeatherOverview.svelte b/client/src/lib/WeatherOverview.svelte
@@ -40,7 +40,7 @@
   </div>
   {#if ["L", "M"].includes(size.toUpperCase())}
     <div
-      class="flex flex-row h-20 ml-6 space-x-6 overflow-scroll text-xs font-bold scrollbar-hide"
+      class="flex flex-row ml-6 space-x-6 overflow-scroll text-xs font-bold scrollbar-hide"
     >
       {#each weatherData.hours as hours, index}
         {#if index >= currentIndex}