add theme

2025-08-12 12:19:25 +08:00
parent 8c06923a46
commit ac0d1944ab
227 changed files with 18962 additions and 0 deletions
--- a/themes/butterfly/source/css/_layout/ai-summary.styl
+++ b/themes/butterfly/source/css/_layout/ai-summary.styl
@@ -0,0 +1,150 @@
+// ===================
+// 🌗 主题变量定义（仅使用项）
+// ===================
+
+:root
+  // ai_summary
+  --liushen-title-font-color: #0883b7
+  --liushen-maskbg: rgba(255, 255, 255, 0.85)
+  --liushen-ai-bg: conic-gradient(from 1.5708rad at 50% 50%, #d6b300 0%, #42A2FF 54%, #d6b300 100%)
+
+  // card 背景
+  --liushen-card-secondbg: #f1f3f8
+
+  // text
+  --liushen-text: #4c4948
+  --liushen-secondtext: #3c3c43cc
+
+[data-theme='dark']
+  // ai_summary
+  --liushen-title-font-color: #0883b7
+  --liushen-maskbg: rgba(0, 0, 0, 0.85)
+  --liushen-ai-bg: conic-gradient(from 1.5708rad at 50% 50%, rgba(214, 178, 0, 0.46) 0%, rgba(66, 161, 255, 0.53) 54%, rgba(214, 178, 0, 0.49) 100%)
+
+  // card 背景
+  --liushen-card-secondbg: #3e3f41
+
+  // text
+  --liushen-text: #ffffffb3
+  --liushen-secondtext: #a1a2b8
+
+// ===================
+// 📘 AI 摘要模块样式
+// ===================
+
+if hexo-config('ai_summary.enable')
+  .ai-summary
+    background-color var(--liushen-maskbg)
+    background var(--liushen-card-secondbg)
+    border-radius 12px
+    padding 8px 8px 12px 8px
+    line-height 1.3
+    flex-direction column
+    margin-bottom 16px
+    display flex
+    gap 5px
+    position relative
+
+    &::before
+      content ''
+      position absolute
+      top 0
+      left 0
+      width 100%
+      height 100%
+      z-index 1
+      filter blur(8px)
+      opacity .4
+      background-image var(--liushen-ai-bg)
+      transform scaleX(1) scaleY(.95) translateY(2px)
+    
+    &::after
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      z-index: 2;
+      border-radius: 12px;
+      background: var(--liushen-maskbg);
+
+    .ai-explanation
+      z-index 10
+      padding 8px 12px
+      font-size 15px
+      line-height 1.4
+      color var(--liushen-text)
+      text-align justify
+
+      // ✅ 打字机光标动画
+      &::after
+        content ''
+        display inline-block
+        width 8px
+        height 2px
+        margin-left 2px
+        background var(--liushen-text)
+        vertical-align bottom
+        animation blink-underline 1s ease-in-out infinite
+        transition all .3s
+        position relative
+        bottom 3px
+
+      // 平滑滚动动画
+      // .char
+      //   display inline-block
+      //   opacity 0
+      //   animation chat-float .5s ease forwards
+    
+    .ai-title
+      z-index 10
+      font-size 14px
+      display flex
+      border-radius 8px
+      align-items center
+      position relative
+      padding 0 12px
+      cursor default
+      user-select none
+
+      .ai-title-left
+        display flex
+        align-items center
+        color var(--liushen-title-font-color)
+
+        i
+          margin-right 3px
+          display flex
+          color var(--liushen-title-font-color)
+          border-radius 20px
+          justify-content center
+          align-items center
+
+        .ai-title-text
+          font-weight 500
+
+      .ai-tag
+        color var(--liushen-secondtext)
+        font-weight 300
+        margin-left auto
+        display flex
+        align-items center
+        justify-content center
+        transition .3s
+
+  // 平滑滚动动画
+  // @keyframes chat-float
+  //   0% 
+  //     opacity 0
+  //     transform translateY(20px)
+  //   100% 
+  //       opacity 1
+  //       transform translateY(0)
+  
+  // ✅ 打字机光标闪烁动画
+  @keyframes blink-underline
+    0%, 100%
+      opacity 1
+    50%
+      opacity 0