xuwei
/
cdwUniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

refactor(样式): 统一使用变量管理字体大小并优化布局 

- 将多处硬编码的字体大小替换为SCSS变量($text-base, $text-lg等)
- 调整导航栏z-index值从999999改为999
- 更新搜索图标类名从icon-search改为icon-search1
- 优化H5环境下的顶部间距处理
- 移除部分注释掉的代码
master
wei 1 week ago
parent
2218dfd5ce
commit
329079a4a7
4 changed files with 42 additions and 25 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      components/custom-tab-bar/my-tab-bar.vue
  2. 4
      components/navigation/navigation.vue
  3. 2
      libs/utils/index.js
  4. 58
      pages/home/home.vue

3
components/custom-tab-bar/my-tab-bar.vue
View File

@ -151,7 +151,8 @@ function onChangeTab(index) {
}
.name {
font-weight: 400;
font-size: 26rpx;
font-size: $text-base;
// font-size: 26rpx;
color: #979996;
line-height: 1;
margin-top: 6rpx;

4
components/navigation/navigation.vue
View File

@ -68,7 +68,7 @@ function gotoBack() {
<template>
<view>
<!-- #ifdef H5 -->
<view :style="{ width: '100vw', height: '15px' }" />
<!-- <view :style="{ width: '100vw', height: '15px' }" /> -->
<!-- #endif -->
<view
id="container"
@ -104,7 +104,7 @@ function gotoBack() {
left: 0;
top: 0;
width: 100%;
z-index: 999999;
z-index: 999;
.left {
display: flex;
align-items: center;

2
libs/utils/index.js
View File

@ -34,7 +34,7 @@ let _promiseThrottleMap = {};
export function useHeight() {
const safeHeight = {};
safeHeight.status = uni.getSystemInfoSync().statusBarHeight || 45;
safeHeight.status = uni.getSystemInfoSync().statusBarHeight || 0;
// #ifdef APP
uni.hideTabBar();
// #endif

58
pages/home/home.vue
View File

@ -450,6 +450,9 @@ onShow(() => {
paddingTop: `${statusBarHeight}px`,
}"
>
<!-- #ifdef APP-PLUS|H5 -->
<view :style="{ width: '100vw', height: '30rpx' }" />
<!-- #endif -->
<view
class="location-box"
:style="{ height: locationBarHeight ? `${locationBarHeight}px` : 'auto' }"
@ -475,7 +478,8 @@ onShow(() => {
<!-- 搜索框 -->
<view class="search-input">
<text class="iconfont icon-search" />
<text class="iconfont icon-search1 " />
<!-- <uv-icon name="search" size="38rpx" color="white" /> -->
<input
v-model="keyValue"
class="input"
@ -733,7 +737,7 @@ onShow(() => {
display: flex;
align-items: center;
.address {
font-size: 28rpx;
font-size: $text-base;
color: #fefefe;
}
}
@ -791,7 +795,8 @@ onShow(() => {
height: 97rpx;
}
.name {
font-size: 25rpx;
font-size: $text-base;
// font-size: 25rpx;
font-weight: 400;
color: #333333;
margin-top: 12rpx;
@ -826,7 +831,7 @@ onShow(() => {
align-items: center;
padding-right: 15rpx;
.text {
font-size: 26rpx;
font-size: $text-base;
font-weight: bold;
color: #B4561B;
white-space: nowrap;
@ -856,13 +861,14 @@ onShow(() => {
flex-direction: column;
.first {
font-weight: 400;
font-size: 29rpx;
font-size: $text-lg;
color: #FFFFFF;
text-shadow: 1px 2px 3px rgba(46, 77, 30, 0.15);
}
.second {
font-weight: 400;
font-size: 24rpx;
font-size: $text-xs;
// font-size: 60rpx;
color: #FFFFFF;
}
.line {
@ -894,13 +900,14 @@ onShow(() => {
flex-direction: column;
.first {
font-weight: 400;
font-size: 29rpx;
font-size: $text-lg;
// font-size: 999rpx;
color: #FFFFFF;
text-shadow: 1px 2px 3px rgba(77, 41, 18, 0.15);
}
.second {
font-weight: 400;
font-size: 24rpx;
font-size: $text-xs;
color: #FFFFFF;
}
.line {
@ -928,7 +935,7 @@ onShow(() => {
top: 16rpx;
left: 30rpx;
.first {
font-size: 29rpx;
font-size: $text-lg;
color: #FFFFFF;
text-shadow: 1px 2px 3px rgba(77, 55, 25, 0.15);
}
@ -954,7 +961,7 @@ onShow(() => {
top: 16rpx;
left: 30rpx;
.first {
font-size: 29rpx;
font-size: $text-lg;
color: #FFFFFF;
text-shadow: 1px 2px 3px rgba(77, 55, 25, 0.15);
}
@ -1055,13 +1062,15 @@ onShow(() => {
margin-left: 28rpx;
flex: 1;
.name {
font-size: 29rpx;
font-size: $text-lg;
// font-size: 29rpx;
font-weight: bold;
color: #333333;
margin-top: 26rpx;
}
.inventory {
font-size: 22rpx;
// font-size: 22rpx;
font-size: $text-sm;
color: #999999;
margin-top: 20rpx;
}
@ -1078,7 +1087,8 @@ onShow(() => {
flex-wrap: wrap;
.price {
font-weight: bold;
font-size: 36rpx;
// font-size: 36rpx;
font-size: $text-2xl;
color: #FF261F;
line-height: 1;
text {
@ -1087,14 +1097,16 @@ onShow(() => {
}
.original {
text-decoration-line: line-through;
font-size: 22rpx;
// font-size: 22rpx;
font-size: $text-sm;
color: #959595;
margin-left: 20rpx;
display: flex;
align-items: center;
}
.no-original {
font-size: 22rpx;
// font-size: 22rpx;
font-size: $text-sm;
color: #959595;
margin-left: 20rpx;
display: flex;
@ -1165,7 +1177,7 @@ onShow(() => {
height: 58rpx !important;
line-height: 58rpx;
text-align: center;
font-size: 29rpx;
font-size: $text-base;
color: #333333;
margin: 0 10rpx;
// border: none;
@ -1191,19 +1203,22 @@ onShow(() => {
flex-wrap: wrap;
.price {
font-weight: bold;
font-size: 36rpx;
// font-size: 36rpx;
font-size: $text-2xl;
color: #FF261F;
line-height: 1;
}
.original {
font-size: 22rpx;
// font-size: 22rpx;
font-size: $text-sm;
color: #959595;
margin-left: 20rpx;
display: flex;
align-items: center;
}
.no-original {
font-size: 22rpx;
font-size: $text-sm;
// font-size: 22rpx;
color: #959595;
margin-left: 20rpx;
display: flex;
@ -1250,7 +1265,8 @@ onShow(() => {
height: 58rpx;
line-height: 58rpx;
text-align: center;
font-size: 29rpx;
// font-size: 29rpx;
font-size: $text-base;
color: #333333;
margin: 0 10rpx;
}
@ -1274,7 +1290,7 @@ onShow(() => {
}
.icon-search {
.icon-search1 {
font-size: 34rpx;
color: white;
}

Write Preview
Loading…
Cancel
Save