Commit ed19bbe

@@ -17,6 +17,6 @@ const { class: className, ...rest } = Astro.props;
     margin-right: 0.5rem;
     display: flex;
     justify-content: center;
-    color: var(--color-primary);
+    color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
   }
 </style>

@@ -47,7 +47,7 @@ else {
   <div>
     {
       current > 1 && (
-        <Button id="prev-page-btn" class="btn-primary mr-auto" href={getPageUrl(current - 1)}>
+        <Button id="prev-page-btn" class="mr-auto" href={getPageUrl(current - 1)}>
           <Icon name="material-symbols:keyboard-double-arrow-left-rounded" class="my-1" />
         </Button>
       )
@@ -60,7 +60,7 @@ else {
           return (
             <Button
               class:list={[
-                'join-item btn-primary btn-soft',
+                'join-item btn-soft',
                 current === p.page && 'btn-active',
                 p.page === -1 && 'btn-disabled',
               ]}
@@ -88,7 +88,7 @@ else {
             class="pr-2 pl-4 duration-300"
             inert
           />
-          <Button id="page-jumper-button" class="btn-primary relative right-0 m-0 duration-300">
+          <Button id="page-jumper-button" class="relative right-0 m-0 duration-300">
             <Icon name="material-symbols:keyboard-double-arrow-right-rounded" class="my-1" />
           </Button>
         </label>
@@ -98,7 +98,7 @@ else {
   <div>
     {
       current < total && (
-        <Button id="next-page-btn" class="btn-primary ml-auto" href={getPageUrl(current + 1)}>
+        <Button id="next-page-btn" class="ml-auto" href={getPageUrl(current + 1)}>
           <Icon name="material-symbols:keyboard-double-arrow-right-rounded" class="my-1" />
         </Button>
       )

@@ -17,6 +17,6 @@ const { href, title, ...rest } = Astro.props;
   <Icon
     name="material-symbols:chevron-right-rounded"
     {...rest}
-    class="bg-primary/40 text-primary h-full min-h-48 w-12"
+    class="bg-secondary/30 text-secondary/80 h-full min-h-48 w-12"
   />
 </a>

@@ -22,7 +22,7 @@ if (!title) title = 'Astral Halo';
       class="navbar bg-base-200/50 fixed z-20 flex h-16 w-full items-center backdrop-blur-md"
     >
       <div class="navbar-start">
-        <Button id="site-name" href="/" class="group btn-ghost btn-primary">
+        <Button id="site-name" href="/" class="group btn-ghost btn-accent">
           <span class="text-xl font-bold duration-300 group-hover:opacity-0">{title}</span>
           <Icon
             name="material-symbols:home-rounded"
@@ -106,7 +106,7 @@ if (!title) title = 'Astral Halo';
           }
         </div>
         <div class="md:hidden">
-          <label for="sidebar-drawer" class="btn btn-circle btn-ghost">
+          <label for="sidebar-drawer" class="btn btn-circle btn-ghost btn-primary">
             <Icon name="material-symbols:menu-rounded" class="text-2xl" />
           </label>
         </div>

@@ -10,7 +10,7 @@ import DarkModeButton from './widgets/DarkModeButton.astro';
     id="stb-show"
     class="peer order-2 grid translate-x-full grid-cols-1 gap-2 pr-4 duration-500 ease-in-out"
   >
-    <Button id="stb-show-more" class="btn-circle btn-primary btn-sm">
+    <Button id="stb-show-more" class="btn-circle btn-secondary btn-sm">
       <input
         type="checkbox"
         class="absolute z-10 h-8 w-8 cursor-pointer appearance-none border-0"
@@ -21,7 +21,7 @@ import DarkModeButton from './widgets/DarkModeButton.astro';
     {
       articleConfig.toc && (
         <Fragment>
-          <Button id="stb-toc" class="btn-circle btn-primary btn-sm hidden xl:hidden!">
+          <Button id="stb-toc" class="btn-circle btn-secondary btn-sm hidden xl:hidden!">
             <Icon name="material-symbols:toc-rounded" />
           </Button>
           <div
@@ -31,7 +31,7 @@ import DarkModeButton from './widgets/DarkModeButton.astro';
         </Fragment>
       )
     }
-    <Button id="stb-back-to-top" class="group btn-circle btn-primary btn-sm">
+    <Button id="stb-back-to-top" class="group btn-circle btn-secondary btn-sm">
       <span
         id="stb-read-percentage"
         class="absolute text-sm opacity-0 duration-300 group-hover:opacity-0"></span>
@@ -46,7 +46,7 @@ import DarkModeButton from './widgets/DarkModeButton.astro';
     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"
   >
-    <DarkModeButton id="stb-dark-mode" class="btn-circle btn-primary btn-sm" />
+    <DarkModeButton id="stb-dark-mode" class="btn-circle btn-secondary btn-sm" />
   </div>
 </div>