修改动画效果（失败T_T）

商品页动画。
2026-08-05 10:13:52 +08:00
parent ba62c9f930
commit 91a68fef0b
80 changed files with 399 additions and 124 deletions
@@ -1 +1,48 @@
-.custom-tab-bar{-ms-flex-pack:distribute;-ms-flex-align:center;-webkit-align-items:center;align-items:center;background:#fff;border-top:3rpx dashed #a0c4ff;bottom:0;display:-webkit-flex;display:-ms-flexbox;display:flex;height:120rpx;-webkit-justify-content:space-around;justify-content:space-around;left:0;padding-bottom:env(safe-area-inset-bottom);position:fixed;right:0;z-index:1000}.tab-item{-ms-flex-align:center;-ms-flex-pack:center;-webkit-align-items:center;align-items:center;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;padding:10rpx 20rpx;position:relative}.tab-icon-img{height:28rpx;margin-bottom:4rpx;opacity:.6;-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s;width:28rpx}.tab-item.active .tab-icon-img{opacity:1;-webkit-transform:scale(1.15);-ms-transform:scale(1.15);transform:scale(1.15)}.tab-label{color:#b08d8d;font-size:20rpx;-webkit-transition:color .2s;transition:color .2s}.tab-item.active .tab-label{color:#ff9a9e;font-weight:600}
+.custom-tab-bar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 120rpx;
+  box-sizing: border-box;
+  background: #ffffff;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  border-top: 3rpx dashed #a0c4ff;
+  padding-bottom: env(safe-area-inset-bottom);
+  z-index: 1000;
+}
+
+.tab-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 10rpx 20rpx;
+  position: relative;
+}
+
+.tab-icon-img {
+  width: 28rpx;
+  height: 28rpx;
+  margin-bottom: 4rpx;
+  transition: transform 0.2s;
+  opacity: 0.6;
+}
+
+.tab-item.active .tab-icon-img {
+  transform: scale(1.15);
+  opacity: 1;
+}
+
+.tab-label {
+  font-size: 20rpx;
+  color: #b08d8d;
+  transition: color 0.2s;
+}
+
+.tab-item.active .tab-label {
+  color: #ff9a9e;
+  font-weight: 600;
+}