update theme

themes/butterfly/layout/includes/third-party/share/index.pug

@@ -6,4 +6,6 @@ if use
       when 'addtoany'
         !=partial('includes/third-party/share/addtoany', {}, {cache: true})
       when 'sharejs'
-        include ./share-js.pug
+        include ./share-js.pug
+      when 'web_share'
+        include ./web_share.pug

themes/butterfly/layout/includes/third-party/share/web_share.pug

@@ -0,0 +1,53 @@
+//- web_share.pug
+
+style.
+  #web-share-btn {
+    background: var(--btn-bg);
+    color: var(--btn-color);
+    border: none;
+    padding: 0.5rem 1rem;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all 0.3s;
+  }
+  #web-share-btn:hover {
+    background: var(--btn-hover-color);
+  }
+
+#web-share-component
+  button#web-share-btn(title='分享本文')
+    i.fas.fa-share-alt
+    span= ' ' + _p('分享')
+
+script.
+  (() => {
+    const setupWebShare = () => {
+      const btn = document.getElementById('web-share-btn')
+      if (!btn) return
+
+      // 点击事件处理
+      btn.addEventListener('click', async () => {
+        if (navigator.share) {
+          try {
+            await navigator.share({
+              title: '!{page.title || config.title}',
+              text: '!{truncate(strip_html(page.content), {length: 100})}',
+              url: window.location.href
+            })
+          } catch (err) {
+            console.log('分享取消或失败', err)
+          }
+        } else {
+          // 降级处理：比如弹出提示或复制链接
+          const shareData = window.location.href
+          navigator.clipboard.writeText(shareData).then(() => {
+            btf.snackbarShow('系统不支持分享，已将链接复制到剪贴板')
+          })
+        }
+      })
+    }
+
+    // 考虑到 Butterfly 的 Pjax 跳转，需要重新绑定
+    setupWebShare()
+    document.addEventListener('pjax:complete', setupWebShare)
+  })()

themes/butterfly/source/css/poem.css

@@ -1,14 +1,12 @@
 [data-theme=light] {
   --fontcolor: #363636;
   --text: rgba(60, 60, 67, 0.6);
-  --btn-bg: #edf0f7;
   --bg: #edf0f7;
 }
 
 [data-theme=dark] {
   --fontcolor: #F7F7FA;
   --text: #a1a2b8;
-  --btn-bg: #30343f;
   --bg: #30343f;
 }
 div#poem_sentence{
@@ -42,4 +40,28 @@ div#poem_dynasty{
   background: var(-btn-bg);
   color: var(--fontcolor);
   border-radius: 8px;
+}
+
+#card-poem{
+  display: flex;
+  flex-direction: column;
+  padding: 0.5rem!important;
+  min-height: 130px;
+    background: linear-gradient(-45deg, rgba(255, 255, 255, .7),
+            rgba(255, 255, 255, .8),
+            rgba(255, 255, 255, .8),
+            rgba(255, 255, 255, .7))!important;
+    backdrop-filter: blur(10px); 
+}
+
+[data-theme=dark] #card-poem{
+  display: flex;
+  flex-direction: column;
+  padding: 0.5rem!important;
+  min-height: 130px;
+    background: linear-gradient(-45deg, rgba(24, 40, 72, .7),
+            rgba(35, 37, 58, .8),
+            rgba(35, 37, 58, .8),
+            rgba(24, 40, 72, .7))!important;
+    backdrop-filter: blur(10px); 
 }