From fd37b150b0fd6cc7b451e7fff2292bfbde0070cd Mon Sep 17 00:00:00 2001
From: mlamberts78 <mlamberts@outlook.com>
Date: Wed, 2 Oct 2024 11:17:08 +0200
Subject: [PATCH] Fix rendering issue

---
 dist/weather-chart-card.js | 6 ++++--
 src/main.js                | 6 ++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/dist/weather-chart-card.js b/dist/weather-chart-card.js
index 77a9135..1af382d 100644
--- a/dist/weather-chart-card.js
+++ b/dist/weather-chart-card.js
@@ -18785,9 +18785,11 @@ renderMain({ config, sun, weather, temperature, feels_like, description } = this
     roundedFeelsLike = Math.round(roundedFeelsLike * 10) / 10;
   }
 
+  const iconSize = config.icons_size ? `${config.icons_size}px` : '25px';  // Default to 25px if not set
+
   const iconHtml = config.animated_icons || config.icons
-    ? x`<img src="${this.getWeatherIcon(weather.state, sun.state)}" alt="">`
-    : x`<ha-icon icon="${this.getWeatherIcon(weather.state, sun.state)}"></ha-icon>`;
+    ? x`<img src="${this.getWeatherIcon(weather.state, sun.state)}" alt="weather icon" style="width: ${iconSize}; height: ${iconSize};">`
+    : x`<ha-icon icon="${this.getWeatherIcon(weather.state, sun.state)}" style="--mdc-icon-size: ${iconSize};"></ha-icon>`;
 
   const updateClock = () => {
     const currentDate = new Date();
diff --git a/src/main.js b/src/main.js
index 04890bc..96f306a 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1002,9 +1002,11 @@ renderMain({ config, sun, weather, temperature, feels_like, description } = this
     roundedFeelsLike = Math.round(roundedFeelsLike * 10) / 10;
   }
 
+  const iconSize = config.icons_size ? `${config.icons_size}px` : '25px';  // Default to 25px if not set
+
   const iconHtml = config.animated_icons || config.icons
-    ? html`<img src="${this.getWeatherIcon(weather.state, sun.state)}" alt="">`
-    : html`<ha-icon icon="${this.getWeatherIcon(weather.state, sun.state)}"></ha-icon>`;
+    ? html`<img src="${this.getWeatherIcon(weather.state, sun.state)}" alt="weather icon" style="width: ${iconSize}; height: ${iconSize};">`
+    : html`<ha-icon icon="${this.getWeatherIcon(weather.state, sun.state)}" style="--mdc-icon-size: ${iconSize};"></ha-icon>`;
 
   const updateClock = () => {
     const currentDate = new Date();