feat: 字母描红页样式开发基本完成

miniprogram/components3.0/preview-footer-actions/preview-footer-actions.less

@@ -6,7 +6,8 @@
     bottom: 0;
     width: 100%;
     padding: 0 24rpx;
-    padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
+    // padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
+    padding-bottom: env(safe-area-inset-bottom);
     box-sizing: border-box;
     z-index: 60;
 
@@ -22,23 +23,27 @@
         gap: 16rpx;
     }
 
+    /* flex 子项：占宽比例；min-width:0 避免子项溢出时把 flex 算崩 */
     &__secondary {
-        flex: 4;
+        flex: 3.92;
+        min-width: 0;
     }
 
     &__primary {
-        flex: 6;
+        flex: 6.18;
+        min-width: 0;
     }
 
-    &__secondary .toy-btn,
-    &__primary .toy-btn {
-        width: 100%;
-        height: 88rpx;
+    /*
+     * 以下类通过 toy-button 的 custom-class 作用在内部原生 button 上。
+     * 不能写 &__primary .toy-btn：小程序样式无法穿透进子自定义组件。
+     */
+    .preview-footer-actions__toy-btn {
         border-radius: 28rpx;
         font-size: 30rpx;
     }
 
-    &__primary .toy-btn--primary {
+    .preview-footer-actions__toy-btn--primary {
         box-shadow: 0 4rpx 12rpx rgba(255, 215, 0, 0.3);
     }
 }