[feat] user-related layout and styles

src/components/window/Header.tsx

@@ -1,11 +1,15 @@
+import { useSteamStore } from "@/store/steam"
+
 const Header = () => {
+  const steam = useSteamStore()
+
   return (
     <div className="pt-6 select-none pb-9" data-tauri-drag-region>
       <h1 className="text-xl font-medium tracking-wide w-fit">
-        Faze.Rop紫本人
+        {steam.currentUser().personaName || 'CS工具箱'}
       </h1>
       <p className="text-sm font-light tracking-wide text-zinc-400 w-fit">
-        本周使用CS工具箱 114 小时
+        {steam.currentUser().accountName || '本周使用CS工具箱 114 小时'}
       </p>
     </div>
   )

src/components/window/SideBar.tsx

@@ -50,16 +50,16 @@ const Avatar = () => {
   const path = usePathname()
 
   return (
-    <button
-      onClick={() => router.push("/users")}
+    <img
+      src="/logo_square.png"
+      alt="avatar"
+      draggable={false}
       className={cn(
-        "w-12 h-12 bg-gray-700 rounded-full shadow-2xl cursor-pointer transition active:scale-95 shadow-purple-800",
+        "w-12 h-12 bg-gray-700 rounded-full shadow-lg cursor-pointer transition active:scale-95 shadow-purple-900/50",
         path.startsWith("/users") && "shadow-sm"
       )}
-      type="button"
-    >
-      <img src="favicon.ico" alt="avatar" draggable={false} />
-    </button>
+      onClick={() => router.push("/users")}
+    />
   )
 }