Commit 8a3e938

@@ -21,7 +21,7 @@ const firstHasPre = hasPre && (isFirstInstance('md-has-pre', Astro.url) || impor
 
 {
   firstHasPre && (
-    <template id="code-toolbar-template" class="relative m-2 overflow-hidden rounded-lg">
+    <template id="code-toolbar-template" class="relative my-4 overflow-hidden rounded-lg">
       <div class="theme-border theme-card-bg-hl-trans z-10 flex items-center justify-between">
         <Button class="toggle-btn !bg-transparent">
           <Icon

@@ -68,6 +68,14 @@ html {
     @apply bg-[var(--theme-color-light-trans-1d2)] dark:bg-[var(--theme-color-dark-trans-1d2)];
   }
 
+  .theme-card-bg-contrary {
+    @apply bg-[var(--theme-bg-color-dark)] dark:bg-[var(--theme-bg-color-light)];
+  }
+
+  .theme-card-bg-contrary-hl {
+    @apply bg-[var(--theme-color-dark)] dark:bg-[var(--theme-color-light)];
+  }
+
   .theme-text {
     @apply text-[var(--theme-text-color-light)] dark:text-[var(--theme-text-color-dark)];
   }
@@ -84,7 +92,15 @@ html {
     @apply text-[var(--theme-text-color-second-light)] dark:text-[var(--theme-text-color-second-dark)];
   }
 
+  .theme-text-contrary {
+    @apply text-[var(--theme-text-color-dark)] dark:text-[var(--theme-text-color-light)];
+  }
+
   .theme-border {
     @apply border-[var(--theme-border-color-light)] dark:border-[var(--theme-border-color-dark)];
   }
+
+  .theme-border-hl {
+    @apply border-[var(--theme-color-light)] dark:border-[var(--theme-color-dark)];
+  }
 }

@@ -1,3 +1,5 @@
+@use './globals.scss' as global;
+
 article {
   // 标题通用样式
   h1,
@@ -36,7 +38,7 @@ article {
   }
 
   a {
-    @apply text-[var(--theme-color-light-darken)] underline decoration-dashed dark:text-[var(--theme-color-dark-lighten)];
+    @apply theme-text-hl-contrast underline decoration-dashed;
 
     &[data-footnote-ref],
     &[data-footnote-backref] {
@@ -104,9 +106,7 @@ article {
         text-align: center;
         border-radius: 9999px;
 
-        @apply bg-[var(--theme-color-light-trans-1d2)];
-        @apply dark:bg-[var(--theme-color-dark-trans-1d2)];
-        @apply text-[var(--theme-color-light-darken)] dark:text-[var(--theme-color-dark-lighten)];
+        @apply theme-card-bg-hl-trans theme-text-hl-contrast;
       }
 
       p:first-child {
@@ -145,18 +145,32 @@ article {
   code:not(pre code) {
     padding: 0 0.25rem;
 
-    @apply bg-[var(--theme-color-light-trans-1d2)];
-    @apply dark:bg-[var(--theme-color-dark-trans-1d2)];
-    @apply rounded-md;
-    @apply text-[var(--theme-color-light-darken)] dark:text-[var(--theme-color-dark-lighten)];
+    @apply theme-text-hl-contrast rounded-md bg-[var(--theme-color-light-trans-1d8)] dark:bg-[var(--theme-color-dark-trans-1d8)];
   }
 
   // 引用块样式
   blockquote {
     padding: 0.25rem 0.25rem 0.25rem 0.75rem;
 
-    @apply border-[var(--theme-color-light)] dark:border-[var(--theme-color-dark)];
-    @apply bg-[var(--theme-color-light-trans-1d8)] dark:bg-[var(--theme-color-dark-trans-1d8)];
-    @apply rounded-sm border-l-4;
+    @apply theme-border-hl rounded-sm border-l-4 bg-[var(--theme-color-light-trans-1d8)] dark:bg-[var(--theme-color-dark-trans-1d8)];
+  }
+
+  // 折叠块样式
+  details {
+    @apply theme-border w-full overflow-hidden rounded-xl border-2 duration-300;
+
+    summary {
+      @apply hover:theme-card-bg-hl-trans w-full px-3 py-1 text-start text-2xl duration-300;
+
+      &::marker {
+        margin-right: 1.5rem;
+      }
+    }
+
+    &[open] {
+      summary {
+        @apply theme-card-bg-hl-trans;
+      }
+    }
   }
 }