fnvtk/cunkebao_v3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor TransferMessage component to improve layout and styling. Adjust icon size and add status display for better user experience.

Browse Source
This commit is contained in:
乘风
2025-12-01 10:59:50 +08:00
parent b9bc0a71a9
commit 1ca5b30c15
2 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/TransferMessage/TransferMessage.module.scss
View File

@@ -38,20 +38,18 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 32px; width: 36px;
height: 32px; height: 36px;
background: #ffffff;
border-radius: 50%; border-radius: 50%;
flex-shrink: 0; flex-shrink: 0;
font-size: 18px; font-size: 18px;
color: #ff9500; color: #ffffff;
border: 2px solid #ffffff;
} }
.transferAmount { .transferAmount {
font-size: 20px; font-size: 16px;
font-weight: 600;
color: #ffffff; color: #ffffff;
line-height: 1.2;
flex: 1; flex: 1;
} }

9
Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/TransferMessage/index.tsx
View File

@@ -50,11 +50,14 @@ const TransferMessage: React.FC<TransferMessageProps> = ({ content }) => {
<div className={styles.transferCard}> <div className={styles.transferCard}>
<div className={styles.transferHeader}> <div className={styles.transferHeader}>
<div className={styles.transferIcon}> <div className={styles.transferIcon}>
<SwapOutlined /> <SwapOutlined style={{ fontSize: 20 }} />
</div>
<div className="destion">
<div className={styles.transferAmount}>{amount}</div>
<div className={styles.transferStatus}>{statusText}</div>
</div> </div>
<div className={styles.transferAmount}>{amount}</div>
</div> </div>
<div className={styles.transferStatus}>{statusText}</div>
<div className={styles.transferDivider}></div> <div className={styles.transferDivider}></div>
<div className={styles.transferFooter}> <div className={styles.transferFooter}>
<span className={styles.transferLabel}>微信转账</span> <span className={styles.transferLabel}>微信转账</span>