Sylphy
/
SEC_Warehouse
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(ui): Navbar 返回箭头改纯 CSS 线条拼接，消除字符字形差异

This commit is contained in:
ozh 2026-09-09 13:54:41 +08:00
parent 8ad9ca234d
commit dd92496088
2 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/navbar/index.module.scss
View File

@ -17,11 +17,14 @@
z-index: 1; z-index: 1;
} }
.backIcon { // 纯 CSS 线条箭头：border 拼接旋转 45°，粗细均匀无字体差异
font-size: 48px; .backArrow {
color: $color-text; width: 20px;
font-weight: 300; height: 20px;
line-height: 1; border-left: 3px solid $color-text;
border-bottom: 3px solid $color-text;
transform: rotate(45deg);
margin-left: 8px;
} }
// 绝对定位居中：与 back 按钮是否存在无关，免手动平衡宽度 // 绝对定位居中：与 back 按钮是否存在无关，免手动平衡宽度

2
src/components/navbar/index.tsx
View File

@ -39,7 +39,7 @@ export function Navbar({
> >
{autoBack && ( {autoBack && (
<View className={styles.back} onClick={handleBack}> <View className={styles.back} onClick={handleBack}>
<Text className={styles.backIcon}>‹</Text> <View className={styles.backArrow} />
</View> </View>
)} )}
<Text className={styles.title}>{title}</Text> <Text className={styles.title}>{title}</Text>