|
|
@@ -322,7 +322,6 @@ export default {
|
|
|
.flowers-grid {
|
|
|
display: grid;
|
|
|
grid-template-columns: repeat(auto-fit, minmax(116.81upx, 1fr));
|
|
|
- gap: 25upx;
|
|
|
padding: 25upx 31.25upx;
|
|
|
grid-auto-rows: max-content;
|
|
|
|
|
|
@@ -335,12 +334,7 @@ export default {
|
|
|
border-radius: 6.38upx;
|
|
|
transition: all 0.3s;
|
|
|
border: 1upx solid #e8e8e8;
|
|
|
-
|
|
|
- &:hover {
|
|
|
- background-color: #f5f7ff;
|
|
|
- border-color: #3385ff;
|
|
|
- box-shadow: 0 4upx 12upx rgba(51, 133, 255, 0.1);
|
|
|
- }
|
|
|
+ margin: 10upx;
|
|
|
|
|
|
// 图片容器
|
|
|
.flower-img-box {
|
|
|
@@ -394,7 +388,6 @@ export default {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- gap: 5.31upx;
|
|
|
background: linear-gradient(135deg, #f9f9f9 0%, #f0f0f0 100%);
|
|
|
border: 2upx solid #e8e8e8;
|
|
|
border-radius: 4.25upx;
|
|
|
@@ -402,6 +395,7 @@ export default {
|
|
|
width: 100%;
|
|
|
|
|
|
.qty-btn {
|
|
|
+ margin: 0 2.66upx;
|
|
|
width: 20.19upx;
|
|
|
height: 20.19upx;
|
|
|
display: flex;
|
|
|
@@ -461,32 +455,29 @@ export default {
|
|
|
|
|
|
// 底部按钮栏 - 再缩小 1/2 (总计 33.33%)
|
|
|
.popup-footer {
|
|
|
- height: 34upx;
|
|
|
+ height: 38upx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- gap: 16upx;
|
|
|
padding: 0 14upx;
|
|
|
border-top: 2upx solid #eeeeee;
|
|
|
background: linear-gradient(135deg, #fafafa 0%, #f5f5f5 100%);
|
|
|
|
|
|
.footer-btn {
|
|
|
+ margin: 0 10upx;
|
|
|
flex: 1;
|
|
|
- height: 27upx;
|
|
|
+ height: 32upx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
border-radius: 2.22upx;
|
|
|
cursor: pointer;
|
|
|
transition: all 0.3s;
|
|
|
- font-size: 13upx;
|
|
|
- font-weight: bold;
|
|
|
- min-width: 41.67upx;
|
|
|
- max-width: 69.44upx;
|
|
|
+ min-width: 42upx;
|
|
|
+ max-width: 69upx;
|
|
|
|
|
|
text {
|
|
|
- font-size: 13upx;
|
|
|
- font-weight: bold;
|
|
|
+ font-size: 15upx;
|
|
|
}
|
|
|
|
|
|
&.cancel-btn {
|
|
|
@@ -507,10 +498,10 @@ export default {
|
|
|
@media (min-width: 1800px) {
|
|
|
.flowers-grid {
|
|
|
grid-template-columns: repeat(auto-fit, minmax(127.5upx, 1fr));
|
|
|
- gap: 28.13upx;
|
|
|
padding: 28.13upx 34.37upx;
|
|
|
|
|
|
.flower-grid-item {
|
|
|
+ margin: 14.06upx;
|
|
|
.flower-name {
|
|
|
font-size: 7.97upx;
|
|
|
}
|
|
|
@@ -540,23 +531,23 @@ export default {
|
|
|
@media (max-width: 1200px) {
|
|
|
.flowers-grid {
|
|
|
grid-template-columns: repeat(auto-fit, minmax(95.63upx, 1fr));
|
|
|
- gap: 21.25upx;
|
|
|
padding: 18.75upx 21.88upx;
|
|
|
|
|
|
.flower-grid-item {
|
|
|
padding: 8.13upx;
|
|
|
+ margin: 10.62upx;
|
|
|
|
|
|
.flower-name {
|
|
|
font-size: 6.56upx;
|
|
|
}
|
|
|
|
|
|
.quantity-controller {
|
|
|
- gap: 3.75upx;
|
|
|
padding: 3.38upx;
|
|
|
|
|
|
.qty-btn {
|
|
|
width: 17.81upx;
|
|
|
height: 17.81upx;
|
|
|
+ margin: 0 1.88upx;
|
|
|
text {
|
|
|
font-size: 7.5upx;
|
|
|
}
|