From 0be54adf20895cf5a94a9571a21549a12e396762 Mon Sep 17 00:00:00 2001
From: Azalea <22280294+hykilpikonna@users.noreply.github.com>
Date: Tue, 25 Nov 2025 10:29:29 +0800
Subject: [PATCH] [+] About page link

---
 bun.lock                        | 3 +++
 package.json                    | 1 +
 src/lib/ui/IconButton.svelte    | 4 ++--
 src/lib/ui/appbar/AppBar.svelte | 3 ++-
 src/routes/+page.svelte         | 6 ++++--
 5 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/bun.lock b/bun.lock
index ae450a3..db37efb 100644
--- a/bun.lock
+++ b/bun.lock
@@ -23,6 +23,7 @@
         "@fontsource/roboto": "^5.2.8",
         "@iconify-json/material-symbols": "^1.2.46",
         "@iconify-json/mdi": "^1.2.3",
+        "@iconify-json/solar": "^1.2.5",
         "@iconify-json/svg-spinners": "^1.2.4",
         "@sveltejs/adapter-auto": "^7.0.0",
         "@sveltejs/kit": "^2.47.1",
@@ -169,6 +170,8 @@
 
     "@iconify-json/mdi": ["@iconify-json/mdi@1.2.3", "", { "dependencies": { "@iconify/types": "*" } }, "sha512-O3cLwbDOK7NNDf2ihaQOH5F9JglnulNDFV7WprU2dSoZu3h3cWH//h74uQAB87brHmvFVxIOkuBX2sZSzYhScg=="],
 
+    "@iconify-json/solar": ["@iconify-json/solar@1.2.5", "", { "dependencies": { "@iconify/types": "*" } }, "sha512-WMAiNwchU8zhfrySww6KQBRIBbsQ6SvgIu2yA+CHGyMima/0KQwT5MXogrZPJGoQF+1Ye3Qj6K+1CiyNn3YkoA=="],
+
     "@iconify-json/svg-spinners": ["@iconify-json/svg-spinners@1.2.4", "", { "dependencies": { "@iconify/types": "*" } }, "sha512-ayn0pogFPwJA1WFZpDnoq9/hjDxN+keeCMyThaX4d3gSJ3y0mdKUxIA/b1YXWGtY9wVtZmxwcvOIeEieG4+JNg=="],
 
     "@iconify/types": ["@iconify/types@2.0.0", "", {}, "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg=="],
diff --git a/package.json b/package.json
index 88d2a6d..810139c 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "@fontsource/roboto": "^5.2.8",
     "@iconify-json/material-symbols": "^1.2.46",
     "@iconify-json/mdi": "^1.2.3",
+    "@iconify-json/solar": "^1.2.5",
     "@iconify-json/svg-spinners": "^1.2.4",
     "@sveltejs/adapter-auto": "^7.0.0",
     "@sveltejs/kit": "^2.47.1",
diff --git a/src/lib/ui/IconButton.svelte b/src/lib/ui/IconButton.svelte
index d24d213..a5d1477 100644
--- a/src/lib/ui/IconButton.svelte
+++ b/src/lib/ui/IconButton.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
     import { Layer } from "m3-svelte";
 
-    let { icon, ...rest } = $props();
+    let { icon, size = 24, ...rest } = $props();
 </script>
 
 <button class="cbox size-48px relative rounded-8px" {...rest}>
   <!-- <Layer/> -->
-  <span class="size-24px {icon}"></span>
+  <span class="{icon}" style="width: {size}px; height: {size}px"></span>
 </button>
\ No newline at end of file
diff --git a/src/lib/ui/appbar/AppBar.svelte b/src/lib/ui/appbar/AppBar.svelte
index be491a0..aff9939 100644
--- a/src/lib/ui/appbar/AppBar.svelte
+++ b/src/lib/ui/appbar/AppBar.svelte
@@ -5,6 +5,7 @@
 
   interface Icon {
     icon: string
+    size?: number
     onclick: () => void
   }
 
@@ -35,7 +36,7 @@
   </div>
 
   {#each right as item}
-    <IconButton icon={item.icon} onclick={item.onclick} />
+    <IconButton icon={item.icon} onclick={item.onclick} size={item.size} />
   {/each}
 
   {#if children}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 88ee9ec..0cfa214 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -7,7 +7,7 @@
   import { Layer } from "m3-svelte"
   import { goto } from "$app/navigation"
   import { getI18n, setLanguage } from "$lib/i18n"
-    import MenuItem from "$lib/ui/material3/MenuItem.svelte";
+  import MenuItem from "$lib/ui/material3/MenuItem.svelte"
 
   let { data }: PageProps = $props()
 
@@ -18,7 +18,9 @@
 </script>
 
 
-<AppBar account={() => goto('/user')} moreIcon="i-material-symbols:translate-rounded">
+<AppBar account={() => goto('/user')} moreIcon="i-material-symbols:translate-rounded" right={[
+  { icon: 'i-solar:cat-broken', size: 26, onclick: () => goto('/about') },
+]}>
   <MenuItem onclick={() => setLanguage('en')}>English</MenuItem>
   <MenuItem onclick={() => setLanguage('zh')}>中文</MenuItem>
   <MenuItem onclick={() => setLanguage('ja')}>日本語</MenuItem>