Updated windGust display in forecast. Fixes GH-240

changelog.md

@@ -761,3 +761,4 @@ See https://github.com/Daveiano/weewx-wdc/compare/v3.3.0...580071ca175a03fe4924b
 - Added finnish translation GH-230
 - Added "Precipitation detail" on forecast display (show rain/snow separately) GH-231
 - Allow to add custom content to front page via custom templates GH-217
+- Updated windGust display in forecast table GH-240

install.py

@@ -133,6 +133,7 @@ def __init__(self):
                         "skins/weewx-wdc/includes/icons/wind-direction.svg",
                         "skins/weewx-wdc/includes/icons/wind-direction.inc",
                         "skins/weewx-wdc/includes/icons/wind-gust.svg",
+                        "skins/weewx-wdc/includes/icons/wind-gust-2.svg",
                         "skins/weewx-wdc/includes/icons/wind-speed.svg",
                         "skins/weewx-wdc/includes/icons/sunrise.svg",
                         "skins/weewx-wdc/includes/icons/sunset.svg",

skins/weewx-wdc/includes/forecast-table.inc

@@ -325,7 +325,10 @@
           #else
             $summary.windSpeedMin.nolabel('%.0f','') - $summary.windSpeedMax.nolabel('%.0f',' ')
           #end if
-          <span class="windgust">$summary.windGust.nolabel('%.0f',' ')</span>
+          <div class="windgust">
+            #include "includes/icons/wind-gust-2.svg"
+            $summary.windGust.nolabel('%.0f',' ')
+          </div>
           $summary.windChar
         </bx-structured-list-cell>
         <!--prettier-ignore-->

skins/weewx-wdc/src/scss/index.scss

@@ -749,6 +749,15 @@ div[id^="panel"] .tile-radar-forecast {
         margin-right: 5px;
       }
     }
+    .windgust {
+      display: flex;
+      align-items: center;
+      margin-top: 0.75em;
+      svg {
+        max-width: 24px;
+        margin-right: 5px;
+      }
+    }
     // bx-structured-list-row,
     // bx-structured-list-header-row {
     //   @include carbon--breakpoint-down(md) {