From 90372e12e09dd76d25e677368345b29b343475e9 Mon Sep 17 00:00:00 2001
From: Daniel Kluge <daniel.kluge@mailbox.tu-dresden.de>
Date: Thu, 6 Jan 2022 18:50:54 +0100
Subject: [PATCH] Outsource weather icons

---
 .gitmodules                                   |  3 +++
 gatsby-config.js                              |  2 +-
 src/components/WeatherAndTime.tsx             | 22 ++++++++++++++++++-
 src/images/.gitkeep                           |  0
 src/images/weather-icons                      |  1 +
 .../containers/WeatherAndTime.module.css      |  1 +
 6 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 .gitmodules
 delete mode 100644 src/images/.gitkeep
 create mode 160000 src/images/weather-icons

diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 0000000..7a18919
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "src/images/weather-icons"]
+	path = src/images/weather-icons
+	url = git@github.com:erikflowers/weather-icons.git
diff --git a/gatsby-config.js b/gatsby-config.js
index bf0e446..4e7752e 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -9,7 +9,7 @@ module.exports = {
       resolve: "gatsby-plugin-react-svg",
       options: {
         rule: {
-          include: /weather/
+          include: /svg/
         }
       }
     }
diff --git a/src/components/WeatherAndTime.tsx b/src/components/WeatherAndTime.tsx
index 3b09cec..1baac6d 100644
--- a/src/components/WeatherAndTime.tsx
+++ b/src/components/WeatherAndTime.tsx
@@ -6,7 +6,27 @@ import * as styles from "../styles/containers/WeatherAndTime.module.css";
 const WEATHER_REFRESH_INTERVAL = 15 * 60 * 1000;
 
 function getWeatherIcon(icon: string) {
-    const ImportedIcon = require(`../images/weather/${icon}.svg`);
+    //const isNight = document.querySelector(':root[data-theme="night"]') !== null
+    let weatherIcon: string;
+    switch (icon) {
+        case "clear-day":
+            weatherIcon = "day-sunny"
+            break
+        case "clear-night":
+            weatherIcon = "night-clear"
+            break
+        case "wind":
+            weatherIcon = "windy"
+            break
+        case "partly-cloudy-day":
+            weatherIcon = "day-cloudy"
+            break
+        case "partly-cloudy-night":
+            weatherIcon = "night-cloudy"
+            break;
+        default: weatherIcon = icon
+    }
+    const ImportedIcon = require(`../images/weather-icons/svg/wi-${weatherIcon}.svg`);
     return <ImportedIcon />
 }
 
diff --git a/src/images/.gitkeep b/src/images/.gitkeep
deleted file mode 100644
index e69de29..0000000
diff --git a/src/images/weather-icons b/src/images/weather-icons
new file mode 160000
index 0000000..bb80982
--- /dev/null
+++ b/src/images/weather-icons
@@ -0,0 +1 @@
+Subproject commit bb80982bf1f43f2d57f9dd753e7413bf88beb9ed
diff --git a/src/styles/containers/WeatherAndTime.module.css b/src/styles/containers/WeatherAndTime.module.css
index b14b645..46b0810 100644
--- a/src/styles/containers/WeatherAndTime.module.css
+++ b/src/styles/containers/WeatherAndTime.module.css
@@ -55,6 +55,7 @@
 }
 
 #futureWeatherInfos th {
+    width: 25%;
     text-align: center;
     font-size: 3vh;
     font-weight: bold;