这块太丑了，再改一个样式

index.html

@@ -14,21 +14,35 @@
     <div class="min-h-screen flex flex-col">
         <!-- Header -->
         <header class="bg-indigo-600 text-white shadow-lg">
-            <div class="container mx-auto px-4 py-6">
+            <div class="container mx-auto px-4 py-4">
                 <div class="flex justify-between items-center">
-                    <div class="flex items-center space-x-3">
-                        <i data-feather="alert-triangle" class="w-8 h-8"></i>
-                        <h1 class="text-2xl font-bold">Faulty Whistle</h1>
+                    <div class="flex items-center space-x-4">
+                        <div class="p-2 bg-indigo-100 rounded-lg">
+                            <i data-feather="alert-triangle" class="w-8 h-8 text-indigo-600"></i>
+                        </div>
+                        <div>
+                            <h1 class="text-2xl font-bold text-white">Faulty Whistle</h1>
+                            <p class="text-indigo-100 text-sm">Industrial Sensor Monitoring</p>
+                        </div>
                     </div>
                     <div class="flex items-center space-x-4">
-                        <span class="bg-indigo-500 px-3 py-1 rounded-full text-sm">Live Monitoring</span>
-                        <button class="bg-white text-indigo-600 px-4 py-2 rounded-lg font-medium hover:bg-indigo-50 transition">
-                            <i data-feather="bell" class="inline mr-2"></i> Alerts
-                        </button>
+                        <div class="relative">
+                            <div class="absolute -top-1 -right-1 h-3 w-3 rounded-full bg-red-500 animate-pulse"></div>
+                            <button class="bg-white/90 text-indigo-600 px-4 py-2 rounded-lg font-medium hover:bg-white transition-all flex items-center shadow-sm hover:shadow-md">
+                                <i data-feather="bell" class="inline mr-2"></i> Alerts
+                                <span class="ml-2 bg-red-500 text-white text-xs px-2 py-0.5 rounded-full">3</span>
+                            </button>
+                        </div>
+                        <div class="bg-white/20 backdrop-blur-sm px-3 py-1 rounded-full text-sm text-white border border-white/10">
+                            <span class="flex items-center">
+                                <span class="h-2 w-2 rounded-full bg-green-400 mr-2 animate-pulse"></span>
+                                Live Monitoring
+                            </span>
+                        </div>
                     </div>
                 </div>
             </div>
-        </header>
+</header>
 
         <!-- Main Content -->
         <main class="flex-grow container mx-auto px-4 py-8">