sdfbgh

public/css/hud.css

@@ -253,6 +253,24 @@
   display: block;
 }
 
+/* Eisen – Bild aus der Datenbank */
+.hud-res-icon-iron {
+  width: 20px;
+  height: 20px;
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.hud-res-icon-iron img {
+  width: 20px;
+  height: 20px;
+  object-fit: contain;
+  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.7));
+  display: block;
+}
+
 .hud-res-value {
   font-family: "Cinzel", serif;
   font-size: 11px;

public/js/hud.js

@@ -22,6 +22,7 @@ function applyHudData(data) {
   set("hud-gems", data.gems);
   set("hud-wood", data.wood);
   set("hud-stone", data.stone);
+  set("hud-iron", data.iron);
 }
 
 export async function loadHud() {

views/launcher.ejs

@@ -320,12 +320,16 @@
       <div id="hud-currency">
         <div class="hud-res-row">
           <div class="hud-res">
-            <span class="hud-res-icon">⚪</span>
+            <div class="hud-res-icon-silver">
+              <img src="/images/items/silber.png" alt="Silber" onerror="this.parentElement.innerHTML='⚪'">
+            </div>
             <span class="hud-res-value" id="hud-silver">0</span>
           </div>
           <div class="hud-sep"></div>
           <div class="hud-res">
-            <span class="hud-res-icon">💠</span>
+            <div class="hud-res-icon-gem">
+              <img src="/images/items/blauer cristal.png" alt="Kristall" onerror="this.parentElement.innerHTML='💠'">
+            </div>
             <span class="hud-res-value" id="hud-gems">0</span>
           </div>
           <div class="hud-sep"></div>
@@ -346,6 +350,13 @@
             <span class="hud-res-icon">🪨</span>
             <span class="hud-res-value" id="hud-stone">0</span>
           </div>
+          <div class="hud-sep"></div>
+          <div class="hud-res">
+            <div class="hud-res-icon-iron">
+              <img src="/images/items/eisen.png" alt="Eisen" onerror="this.parentElement.innerHTML='⚙️'">
+            </div>
+            <span class="hud-res-value" id="hud-iron">0</span>
+          </div>
         </div>
       </div>
     </div>