fixed 修改打赏卡片

hugo.toml

@@ -211,8 +211,9 @@ hasCJKLanguage = true
   # ----------------------------------------------------------------------------
   [params.reward]
     enable = true
-    wechat = "/image/reward/wechat.jpg"
+    wechat = "/image/reward/new.png"
-    alipay = "/image/reward/alipay.jpg"
+   # alipay = "/image/reward/alipay.jpg"
+   # qq = "/image/reward/reward.png"
 
   # ----------------------------------------------------------------------------
   # 样式定制 (Style Customization)

themes/Ying/assets/css/main.css

@@ -4796,7 +4796,8 @@ html[data-theme="light"] .atk-loading-spinner svg circle {
     border-radius: 24px;
     position: relative;
     max-width: 90%;
-    width: 480px;
+    width: fit-content;
+    min-width: 320px;
     transform: scale(0.95) translateY(10px);
     transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
     box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
@@ -4882,7 +4883,7 @@ html[data-theme="light"] .atk-loading-spinner svg circle {
     border-radius: 16px;
     overflow: hidden;
     padding: 10px;
-    border: 1px solid rgba(0,0,0,0.05);
+    /* border: 1px solid rgba(0,0,0,0.05); */
     transition: transform 0.3s ease;
 }
 

themes/Ying/layouts/_default/single.html

@@ -37,23 +37,42 @@
                 <div class="reward-close" id="reward-close">
                     <i class="ri-close-line"></i>
                 </div>
-                <h3 class="reward-title">感谢支持小站</h3>
+                <h3 class="reward-title">请作者喝杯咖啡，鼓励一下吧！</h3>
                 <div class="reward-qr-group">
-                    {{ with .Site.Params.reward.wechat }}
+                    {{ if .Site.Params.reward.items }}
-                    <div class="reward-qr-item">
+                        {{ range .Site.Params.reward.items }}
-                        <div class="reward-qr-img-wrapper">
+                        <div class="reward-qr-item">
-                            <img src="{{ . }}" alt="微信打赏">
+                            <div class="reward-qr-img-wrapper">
+                                <img src="{{ .image }}" alt="{{ .name }}打赏">
+                            </div>
+                            <span>{{ .name }}</span>
                         </div>
-                        <span>微信</span>
+                        {{ end }}
-                    </div>
+                    {{ else }}
-                    {{ end }}
+                        {{ with .Site.Params.reward.wechat }}
-                    {{ with .Site.Params.reward.alipay }}
+                        <div class="reward-qr-item">
-                    <div class="reward-qr-item">
+                            <div class="reward-qr-img-wrapper">
-                        <div class="reward-qr-img-wrapper">
+                                <img src="{{ . }}" alt="微信打赏">
-                            <img src="{{ . }}" alt="支付宝打赏">
+                            </div>
+                            <span>微信</span>
                         </div>
-                        <span>支付宝</span>
+                        {{ end }}
-                    </div>
+                        {{ with .Site.Params.reward.alipay }}
+                        <div class="reward-qr-item">
+                            <div class="reward-qr-img-wrapper">
+                                <img src="{{ . }}" alt="支付宝打赏">
+                            </div>
+                            <span>支付宝</span>
+                        </div>
+                        {{ end }}
+                        {{ with .Site.Params.reward.qq }}
+                        <div class="reward-qr-item">
+                            <div class="reward-qr-img-wrapper">
+                                <img src="{{ . }}" alt="QQ打赏">
+                            </div>
+                            <span>QQ</span>
+                        </div>
+                        {{ end }}
                     {{ end }}
                 </div>
             </div>