feat: Updates styles

Sources/ViewController/Views/MainPage.swift

@@ -31,7 +31,7 @@ struct MainPage<Inner: HTML>: SendableHTMLDocument where Inner: Sendable {
   }
 
   var body: some HTML {
-    main(.class("bg-white dark:bg-gray-800")) {
+    main(.class("bg-slate-100 dark:bg-gray-800")) {
       div(.class("min-h-screen")) {
         Header()
         PageContent(body: inner)
@@ -46,12 +46,13 @@ private struct Header: HTML {
     header(.class("\(bg: .blue) mb-8 flex flex-row gap-2 border \(border: .yellow)")) {
       a(
         .href(route: .index),
-        .class("flex flex-row gap-2 \(bg: .yellow) pe-2 rounded-e-lg \(text: .blue) hover:\(text: .darkBlue)")
+        .class("group flex flex-row gap-2 \(bg: .yellow) pe-2 rounded-e-lg \(text: .blue) hover:text-blue-600")
       ) {
         img(.src("/images/toolbox.svg"), .width(40), .height(40), .class("py-1"))
         div(.class("flex flex-row mt-2")) {
           h2(.class("text-2xl font-extrabold pe-3")) { "HVAC-Toolbox" }
           SVG(.wind, color: .blue)
+            .attributes(.class("group-hover:text-blue-600"))
         }
       }
       nav(.class("flex flex-row gap-2 p-2 mt-2")) {
@@ -78,7 +79,7 @@ private struct PageContent<Body: HTML>: HTML where Body: Sendable {
 
   var content: some HTML {
     div(.class("mx-5 lg:mx-20")) {
-      div(.class("rounded-xl shadow-lg \(bg: .slate) dark:\(bg: .darkSlate) p-8")) {
+      div(.class("rounded-xl shadow-lg bg-white dark:bg-slate-700 p-8")) {
         body()
       }
     }