Add favicon and logo — three stacked drive bays with green LEDs

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

static/img/favicon.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="6" fill="#0d1117"/>
+  <!-- Drive bay 1 -->
+  <rect x="5" y="6" width="22" height="5.5" rx="1.5" fill="#161b22" stroke="#238636" stroke-width="1"/>
+  <rect x="8" y="8" width="8" height="1.5" rx="0.75" fill="#30363d"/>
+  <circle cx="24" cy="8.75" r="1.5" fill="#3fb950"/>
+  <!-- Drive bay 2 -->
+  <rect x="5" y="13" width="22" height="5.5" rx="1.5" fill="#161b22" stroke="#238636" stroke-width="1"/>
+  <rect x="8" y="15" width="8" height="1.5" rx="0.75" fill="#30363d"/>
+  <circle cx="24" cy="15.75" r="1.5" fill="#3fb950"/>
+  <!-- Drive bay 3 -->
+  <rect x="5" y="20" width="22" height="5.5" rx="1.5" fill="#161b22" stroke="#238636" stroke-width="1"/>
+  <rect x="8" y="22" width="8" height="1.5" rx="0.75" fill="#30363d"/>
+  <circle cx="24" cy="22.75" r="1.5" fill="#3fb950"/>
+</svg>

templates/index.html

@@ -3,6 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <title>MicroNAS</title>
+    <link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='img/favicon.svg') }}">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css">
     <link rel="stylesheet" href="{{ url_for('static', filename='css/app.css') }}">
 </head>
@@ -105,7 +106,10 @@
 
 <!-- Header -->
 <div class="topbar d-flex justify-content-between align-items-center">
-    <span class="fw-semibold fs-5">MicroNAS</span>
+    <span class="d-flex align-items-center gap-2">
+        <img src="{{ url_for('static', filename='img/favicon.svg') }}" width="24" height="24" alt="">
+        <span class="fw-semibold fs-5">MicroNAS</span>
+    </span>
     <div class="d-flex align-items-center gap-3">
         <span id="lastRefresh" class="small" style="color:var(--muted)"></span>
         <button type="button" class="btn btn-sm" style="border:1px solid var(--border); color:var(--muted)"

templates/login.html

@@ -3,6 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <title>MicroNAS — Login</title>
+    <link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='img/favicon.svg') }}">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css">
     <link rel="stylesheet" href="{{ url_for('static', filename='css/app.css') }}">
     <style>

templates/setup.html

@@ -3,6 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <title>MicroNAS — Setup</title>
+    <link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='img/favicon.svg') }}">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5/dist/css/bootstrap.min.css">
     <link rel="stylesheet" href="{{ url_for('static', filename='css/app.css') }}">
     <style>