Commit `6106286`

HPCesia <me@hpcesia.com>

2025-04-01 11:27:48

fix: The config of the side toolbar is not effective

Previously, although there were configurations for the side toolbar in `src/config.ts`, these settings were not actually applied. This commit fixes this problem.

master

1 parent e4f1dff

Changed files (2)

src

components

SideToolBar.astro

layouts

GlobalLayout.astro

@@ -1,5 +1,5 @@
 ---
-import { articleConfig } from '@/config';
+import { articleConfig, toolBarConfig } from '@/config';
 import { Icon } from 'astro-icon/components';
 import Button from './widgets/Button.astro';
 import DarkModeButton from './widgets/DarkModeButton.astro';
@@ -41,13 +41,45 @@ import TocButton from './widgets/SideToolBar/TocButton.vue';
     id="stb-hide"
     class="order-1 grid grid-cols-1 gap-2 pr-4 duration-500 ease-in-out peer-[:first-child:has(:checked)]:translate-x-full"
   >
+    {
+      toolBarConfig.items.map((item) => {
+        const { icon, text } = item;
+        if ('href' in item)
+          return (
+            <Button href={item.href} title={text}>
+              <Icon name={icon} slot="icon" />
+            </Button>
+          );
+        if ('onclick' in item) {
+          if (typeof item.onclick === 'string')
+            return (
+              <Button onclick={item.onclick}>
+                <Icon name={icon} slot="icon" />
+              </Button>
+            );
+          return (
+            <Button id={`stb-${item.onclick!.id}`} title={text}>
+              <Icon name={icon} slot="icon" />
+            </Button>
+          );
+        }
+        return (
+          <Button title={text}>
+            <Icon name={icon} slot="icon" />
+          </Button>
+        );
+      })
+    }
     <DarkModeButton id="stb-dark-mode" class="btn-circle btn-secondary btn-sm" />
   </div>
 </div>
 
 <script>
+  import { toolBarConfig } from '@/config';
   import { getReadingProgress } from '@scripts/utils';
 
+  const stbItems = toolBarConfig.items;
+
   function setup() {
     const stbShow = document.getElementById('stb-show');
     const stbShowMore = document.getElementById('stb-show-more');
@@ -88,6 +120,13 @@ import TocButton from './widgets/SideToolBar/TocButton.vue';
         stbBackToTopIcon?.classList.add('opacity-0');
       }
     });
+
+    stbItems.forEach((item) => {
+      if ('onclick' in item && item.onclick && typeof item.onclick !== 'string') {
+        const stbEl = document.getElementById('stb-' + item.onclick.id);
+        if (stbEl) stbEl.addEventListener('click', item.onclick.function);
+      }
+    });
   }
 
   document.addEventListener('astro:page-load', setup);

@@ -1,5 +1,5 @@
 ---
-import { profileConfig, searchConfig, siteConfig } from '@/config';
+import { profileConfig, searchConfig, siteConfig, toolBarConfig } from '@/config';
 import '@/styles/global.css';
 import '@/styles/transition.css';
 import type { Favicon } from '@/types/config';
@@ -82,7 +82,7 @@ const favicons: Favicon[] =
     <slot name="head" />
   </head>
   <body class="bg-base-100 text-base-content flex min-h-screen flex-col">
-    <SideToolBar />
+    {toolBarConfig.enable && <SideToolBar />}
     <Navbar title={siteConfig.title}>
       <slot name="header" />
       {siteConfig.banner !== false && <Banner src={banner?.src} basePath={banner?.basePath} />}

Commit 6106286

Commit `6106286`