From 7d8aa8e552a7ae8a1c5c60d1daae233da3ca0275 Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期三, 21 五月 2025 13:27:22 +0800
Subject: [PATCH] fix: 修改ui
---
packages/components/src/styles/components.scss | 303 +++++++++++++++++++++++++++++++++++++++----------
1 files changed, 238 insertions(+), 65 deletions(-)
diff --git a/packages/components/src/styles/components.scss b/packages/components/src/styles/components.scss
index 14cffc3..cb15a85 100644
--- a/packages/components/src/styles/components.scss
+++ b/packages/components/src/styles/components.scss
@@ -1,100 +1,163 @@
-/*postcss-pxtransform disable*/
@use './common.scss' as *;
.recharge-tips-view {
- padding: 16px;
- border-radius: 12px;
- background: linear-gradient(0deg, rgba(10, 90, 255, 0.04), rgba(10, 90, 255, 0.04)), #fff;
+ // padding: 32px;
+ // border-radius: 24px;
+ // background: linear-gradient(0deg, rgba(10, 90, 255, 0.04), rgba(10, 90, 255, 0.04)), #fff;
.recharge-tips-title {
color: #1f2229;
- font-size: 14px;
+ font-size: 24px;
font-weight: 700;
- line-height: 18px;
- padding: 4px 0 12px 0;
+ line-height: 36px;
+ padding: 8px 0 24px 0;
border-bottom: 1px solid boleGetCssVar('color', 'primary');
}
.recharge-tips-content {
color: boleGetCssVar('text-color', 'regular');
- font-size: 13px;
+ font-size: 26px;
font-weight: 400;
- line-height: 21px;
- padding-top: 16px;
+ line-height: 42px;
+ padding-top: 32px;
.recharge-tips-top {
color: #e03e2d;
- font-size: 18px;
+ font-size: 36px;
}
}
}
-.confirm-dialog-content {
- .confirm-dialog-content-tips {
- margin-bottom: 16px;
+.confirm-dialog-wrapper {
+ padding: 40px 72px !important;
+ width: 686px !important;
+
+ .nut-dialog__header {
+ font-weight: bold;
+ font-size: 32rpx;
+ color: #222222;
+ height: 44rpx;
+ line-height: 44rpx;
}
- .confirm-dialog-content-info {
- padding: 12px;
- border-radius: 8px;
- background: #f0f3fa;
- margin-bottom: 8px;
+ .nut-dialog__content {
+ margin-top: 12px;
+ margin-bottom: 32px;
+ max-height: auto;
+ overflow: visible;
+ }
- .confirm-dialog-content-info-item {
- display: flex;
- margin-bottom: 10px;
+ .confirm-dialog-content {
+ .confirm-dialog-content-tips {
+ margin-bottom: 32px;
+ font-size: 22px;
+ color: boleGetCssVar('text-color', 'secondary');
+ line-height: 30px;
+ }
- &:last-child {
- margin-bottom: 0;
+ .confirm-dialog-content-info-wrapper {
+ padding: 0 20px;
+ position: relative;
+ margin-bottom: 32px;
+
+ .confirm-dialog-content-info-cic {
+ position: absolute;
+ left: 0;
+ top: -8px;
+ width: 100%;
+ height: 27px;
+ box-shadow: 0px 3px 8px 0px rgba(2, 140, 255, 0.27);
+ border-radius: 28px 28px 28px 28px;
+ border: 6px solid #45aaff;
+ z-index: -1;
+ box-sizing: border-box;
}
+ }
- .confirm-dialog-content-info-item-label {
- color: boleGetCssVar('text-color', 'regular');
- margin-right: 6px;
- }
+ .confirm-dialog-content-info {
+ padding: 36px 24px 40px;
+ border-radius: 16px;
- .confirm-dialog-content-info-item-content {
- flex: 1;
- min-width: 0;
- @include ellipsis;
- color: boleGetCssVar('text-color', 'primary');
- text-align: left;
- }
+ box-shadow: 0px 3px 6px 0px rgba(2, 140, 255, 0.1),
+ inset 0px 6px 5px 0px rgba(126, 196, 255, 0.1);
+ background-color: #fff;
- &.danger {
+ .confirm-dialog-content-info-item {
+ display: flex;
+ padding: 22px 0;
+ font-size: 28px;
+ border-bottom: 1px dashed #cccccc;
+
+ &:first-child {
+ padding-top: 0;
+ }
+
+ &:last-child {
+ padding-bottom: 0;
+ border-bottom: none;
+ }
+
+ .confirm-dialog-content-info-item-label {
+ color: boleGetCssVar('text-color', 'primary');
+ margin-right: 12px;
+ text-align: left;
+ }
+
.confirm-dialog-content-info-item-content {
- color: boleGetCssVar('color', 'danger');
+ flex: 1;
+ min-width: 0;
+ @include ellipsis;
+ color: boleGetCssVar('text-color', 'primary');
+ text-align: right;
+ }
+
+ &.danger {
+ .confirm-dialog-content-info-item-content {
+ color: boleGetCssVar('color', 'danger');
+ }
}
}
}
- }
- .confirm-dialog-content-warning {
- color: boleGetCssVar('color', 'danger');
- text-align: left;
- font-size: 16px;
- line-height: 20px;
+ .confirm-dialog-content-warning {
+ color: boleGetCssVar('color', 'danger');
+ text-align: left;
+ font-size: 22px;
+ line-height: 30px;
+ position: relative;
+
+ &::before {
+ content: '*';
+ position: absolute;
+ left: -20px;
+ top: 10px;
+ background-color: boleGetCssVar('color', 'danger');
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ }
+ }
}
}
.select-pay-type-view {
.select-pay-type-view-item-icon {
- width: 32px;
- height: 32px;
- margin-right: 12px;
+ width: 64px;
+ height: 64px;
+ margin-right: 24px;
}
.select-pay-type-view-item {
- padding-left: 20px;
+ padding-left: 40px;
display: flex;
align-items: center;
- height: 80px;
+ height: 160px;
border: 1px solid #e2e5eb;
- border-radius: 8px;
+ border-radius: 16px;
background-color: #fff;
- margin-bottom: 16px;
+ margin-bottom: 32px;
cursor: pointer;
- font-size: 16px;
+ font-size: 32px;
color: boleGetCssVar('text-color', 'primary');
}
}
@@ -103,26 +166,49 @@
// padding:;
.recharge-result-view-title {
- font-size: 18px;
+ font-size: 36px;
color: boleGetCssVar('text-color', 'primary');
font-weight: 600;
- margin-bottom: 12px;
+ margin-bottom: 24px;
text-align: center;
- line-height: 24px;
+ line-height: 48px;
+ }
+
+ .recharge-result-view-subtitle {
+ font-size: 28px;
+ color: boleGetCssVar('text-color', 'primary');
+ margin-bottom: 24px;
+ text-align: center;
+ line-height: 32px;
}
.recharge-result-view-tips {
- margin-bottom: 12px;
- font-size: 16px;
+ margin-bottom: 24px;
+ font-size: 32px;
color: boleGetCssVar('color', 'danger');
- line-height: 20px;
+ line-height: 40px;
}
.recharge-result-view-warning {
- margin-bottom: 20px;
- font-size: 12px;
+ margin-bottom: 24px;
+ font-size: 24px;
color: boleGetCssVar('color', 'warning');
- line-height: 16px;
+ line-height: 32px;
+ }
+
+ .recharge-result-view-customerService {
+ margin-bottom: 40px;
+ font-size: 24px;
+ color: boleGetCssVar('text-color', 'primary');
+ line-height: 32px;
+ }
+
+ .recharge-result-view-remark {
+ margin-bottom: 40px;
+ font-size: 24px;
+ color: boleGetCssVar('text-color', 'primary');
+ line-height: 32px;
+ text-align: center;
}
.recharge-result-view-btn-wrapper {
@@ -130,14 +216,13 @@
justify-content: center;
.recharge-result-view-btn {
- padding: 0 20px;
- font-size: 16px;
+ padding: 0 40px;
+ font-size: 32px;
color: boleGetCssVar('color', 'primary');
- line-height: 16px;
+ line-height: 32px;
}
}
}
-
.loading-more-tips {
color: boleGetCssVar('text-color', 'primary');
@@ -203,4 +288,92 @@
// height: 23px;
margin-left: 18px;
color: boleGetCssVar('text-color', 'primary');
-}
\ No newline at end of file
+}
+
+.select-pay-type-view {
+ .select-pay-type-form-item-title {
+ padding: 32px 0;
+ font-size: 28px;
+ color: #777777;
+ text-align: center;
+ border-bottom: 1px solid #f1f1f1;
+ }
+ .select-pay-type-view-form-item-radio-group {
+ width: 100%;
+ padding: 0 26px;
+ box-sizing: border-box;
+ }
+
+ .select-pay-type-view-form-item-radio {
+ border-bottom: 1px solid #dcdcdc;
+ margin-bottom: 0;
+ padding: 48px 0;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ .nut-radio__button--active {
+ // &::after {
+ // background-color: transparent;
+ // }
+ }
+
+ .select-pay-type-view-form-item {
+ display: flex;
+ align-items: center;
+ color: boleGetCssVar('text-color', 'primary') !important;
+ font-size: 28px;
+ .select-pay-type-view-form-item-icon {
+ width: 48px;
+ height: 48px;
+ margin-right: 28px;
+ }
+ }
+ }
+}
+
+.preview-image-wrapper {
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+}
+
+.auto-width-image-wrapper {
+ width: auto !important;
+ height: auto !important;
+}
+
+.rich-edit-content {
+ .rich-content-item {
+ margin-bottom: 10px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ .rich-content-image-item {
+ display: block;
+ }
+
+ .rich-content-text-item {
+ word-break: break-all;
+ white-space: pre-line;
+ font-size: 30px;
+ line-height: 50px;
+ color: boleGetCssVar('text-color', 'primary');
+ }
+
+ .rich-content-video-item {
+ width: 100%;
+ height: 300px;
+ }
+
+ &.small {
+ .rich-content-text-item {
+ font-size: 24px;
+ line-height: 36px;
+ }
+ }
+}
--
Gitblit v1.9.1