refactor(panel): uniform title icon styles

panel/src/pages/Account.tsx

@@ -1,5 +1,5 @@
 import { useState, type FormEvent } from "react";
-import { CheckCircle2, Link2, LogOut, ShieldCheck } from "lucide-react";
+import { CheckCircle2, Link2, LogOut, ShieldCheck, UserRound } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
@@ -68,11 +68,14 @@ export function Account() {
 
   return (
     <>
-      <div>
+      <div className="flex items-center gap-3">
-        <h1 className="text-2xl font-semibold tracking-tight">{t("title")}</h1>
+        <UserRound className="h-6 w-6 text-primary" />
-        <p className="text-sm text-muted-foreground">
+        <div>
-          {t("subtitle")}
+          <h1 className="text-2xl font-semibold tracking-tight">{t("title")}</h1>
-        </p>
+          <p className="text-sm text-muted-foreground">
+            {t("subtitle")}
+          </p>
+        </div>
       </div>
 
       <Card>

panel/src/pages/Dashboard.tsx

@@ -12,6 +12,7 @@ import {
   Database,
   Box,
   Hand,
+  LayoutDashboard,
 } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
@@ -82,9 +83,12 @@ export function Dashboard() {
 
   return (
     <>
-      <div>
+      <div className="flex items-center gap-3">
-        <h1 className="text-2xl font-semibold tracking-tight">{t("title")}</h1>
+        <LayoutDashboard className="h-6 w-6 text-primary" />
-        <p className="text-sm text-muted-foreground">{t("subtitle")}</p>
+        <div>
+          <h1 className="text-2xl font-semibold tracking-tight">{t("title")}</h1>
+          <p className="text-sm text-muted-foreground">{t("subtitle")}</p>
+        </div>
       </div>
 
       {loading && !servers ? (

panel/src/pages/MyServers.tsx

@@ -1,3 +1,4 @@
+import { Server } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { Card, CardContent } from "@/components/ui/card";
 import { ServerCard } from "@/components/ServerCard";
@@ -16,11 +17,14 @@ export function MyServers() {
 
   return (
     <>
-      <div>
+      <div className="flex items-center gap-3">
-        <h1 className="text-2xl font-semibold tracking-tight">{t("my_servers_title")}</h1>
+        <Server className="h-6 w-6 text-primary" />
-        <p className="text-sm text-muted-foreground">
+        <div>
-          {t("my_servers_subtitle")}
+          <h1 className="text-2xl font-semibold tracking-tight">{t("my_servers_title")}</h1>
-        </p>
+          <p className="text-sm text-muted-foreground">
+            {t("my_servers_subtitle")}
+          </p>
+        </div>
       </div>
 
       {loading && !data ? (

panel/src/pages/ServerConsole.tsx

@@ -91,15 +91,18 @@ export function ServerConsole() {
       ) : data ? (
         <>
           <div className="flex flex-wrap items-center justify-between gap-3">
-            <div>
+            <div className="flex items-center gap-3">
-              <h1 className="text-2xl font-semibold tracking-tight">
+              <Terminal className="h-6 w-6 text-primary" />
-                {data.displayName || data.name}
+              <div>
-              </h1>
+                <h1 className="text-2xl font-semibold tracking-tight">
-              {cfg && (
+                  {data.displayName || data.name}
-                <p className="text-sm text-muted-foreground">
+                </h1>
-                  {hostFor(data.subdomain, cfg)}
+                {cfg && (
-                </p>
+                  <p className="text-sm text-muted-foreground">
-              )}
+                    {hostFor(data.subdomain, cfg)}
+                  </p>
+                )}
+              </div>
             </div>
             <div className="flex items-center gap-2">
               <PhaseBadge phase={data.phase} />

panel/src/pages/admin/ImageAdmin.tsx

@@ -18,11 +18,14 @@ export function ImageAdmin() {
 
   return (
     <>
-      <div>
+      <div className="flex items-center gap-3">
-        <h1 className="text-2xl font-semibold tracking-tight">{t("images_title")}</h1>
+        <Boxes className="h-6 w-6 text-primary" />
-        <p className="text-sm text-muted-foreground">
+        <div>
-          {t("images_subtitle")}
+          <h1 className="text-2xl font-semibold tracking-tight">{t("images_title")}</h1>
-        </p>
+          <p className="text-sm text-muted-foreground">
+            {t("images_subtitle")}
+          </p>
+        </div>
       </div>
 
       {loading && !data ? (

panel/src/pages/admin/ServerAdmin.tsx

@@ -1,3 +1,4 @@
+import { ServerCog } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { Card, CardContent } from "@/components/ui/card";
 import { ServerCard } from "@/components/ServerCard";
@@ -24,12 +25,15 @@ export function ServerAdmin() {
 
   return (
     <>
-      <div className="flex items-center justify-between gap-4">
+      <div className="flex flex-wrap items-center justify-between gap-4">
-        <div>
+        <div className="flex items-center gap-3">
-          <h1 className="text-2xl font-semibold tracking-tight">{t("servers")}</h1>
+          <ServerCog className="h-6 w-6 text-primary" />
-          <p className="text-sm text-muted-foreground">
+          <div>
-            {t("server_admin_subtitle")}
+            <h1 className="text-2xl font-semibold tracking-tight">{t("servers")}</h1>
-          </p>
+            <p className="text-sm text-muted-foreground">
+              {t("server_admin_subtitle")}
+            </p>
+          </div>
         </div>
         {cfg && <CreateServerDialog cfg={cfg} onCreated={reload} />}
       </div>