From 9453bef1fc4a3121b28ffa6617f0fbfc81d9f634 Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期一, 19 五月 2025 17:35:11 +0800
Subject: [PATCH] fix: 修改首页ui
---
packages/components/src/styles/rechargeGrid.scss | 69 +++++++++++++++++++++++-----------
1 files changed, 46 insertions(+), 23 deletions(-)
diff --git a/packages/components/src/styles/rechargeGrid.scss b/packages/components/src/styles/rechargeGrid.scss
index ef1c3ad..e06c9b3 100644
--- a/packages/components/src/styles/rechargeGrid.scss
+++ b/packages/components/src/styles/rechargeGrid.scss
@@ -1,37 +1,53 @@
@use './common.scss' as *;
-.recharge-grid-wrapper {
- padding-left: 0 !important;
- margin-top: 40px;
+.recharge-list-wrapper {
+ margin-top: 28px;
- .recharge-grid-item {
+ .recharge-list-item {
position: relative;
- .nut-grid-item__text {
- font-size: 36rpx;
- color: boleGetCssVar('text-color', 'primary');
+ height: 160px;
+ background: #f3f8ff;
+ border-radius: 16px;
+ margin-bottom: 26px;
+ display: flex;
+ align-items: center;
+ padding: 0 32px;
+
+ &:last-child {
+ margin-bottom: 0;
}
- .recharge-grid-item-icon {
- width: 64px;
- height: 64px;
+ .recharge-list-item-icon {
+ width: 68px;
+ height: 68px;
+ margin-right: 24px;
+ }
+
+ .recharge-list-item-text {
+ font-weight: 400;
+ font-size: 34px;
+ color: boleGetCssVar('text-color', 'primary');
+ flex: 1;
+ min-width: 0;
+ }
+
+ .recharge-list-item-button {
+ font-size: 26px;
+ height: 48px;
+ padding: 18px;
}
.discountTag {
position: absolute;
- padding: 8px 16px;
- border-radius: 0px 0 20px 0;
- background: linear-gradient(
- 186deg,
- rgba(255, 129, 45, 0.08) 14.82%,
- rgba(238, 67, 67, 0.08) 91.5%
- );
- color: #fb5100;
- font-size: 24px;
- font-weight: 700;
- line-height: 28px;
+ padding: 0px 20px;
+ border-radius: 0px 16px 0 16px;
+ background: linear-gradient(133deg, #ff6d6e 0%, #ff4d4f 100%);
+ color: #fff;
+ font-size: 20px;
+ line-height: 32px;
position: absolute;
- top: -2px;
- left: -2px;
+ top: -16px;
+ left: 0;
}
}
}
@@ -137,6 +153,13 @@
}
.order-bill-recharge {
+ .nut-cell-group__wrap {
+ background-color: transparent;
+
+ .nut-cell {
+ background-color: transparent;
+ }
+ }
.recharge-button {
width: 100%;
margin: 40px 0;
--
Gitblit v1.9.1