设置页面样式优化

pages/news/consult/storeEdit.vue

@@ -177,7 +177,7 @@ export default {
 
 		.btn {
 			width: 630rpx;
-			line-height: 96rpx;
+			line-height: 88rpx;
 			background: #F34A40;
 			border-radius: 72rpx;
 			text-align: center;

pages/news1/setting.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="setting">
 		<view class="box">
-			<view class="box-avter">
+			<view class="box-avter" style="padding-bottom: 24rpx;">
 				<view class="name-text">
 					头像
 				</view>
@@ -18,11 +18,11 @@
 				<view class="name-text">
 					性别
 				</view>
-				<picker style="width: 400rpx;text-align: right;" :value="genderIndex" :range="gender"
-					:range-key="'name'" @change="bindPickerChange">
+				<picker style="width: 400rpx;text-align: right;" :value="genderIndex" :range="gender" :range-key="'name'"
+					@change="bindPickerChange">
 					<view class="lx" :style="genderIndex == -1 ? 'color:#999' : 'color:#333'">
 						{{ genderIndex == -1 ? '请选择' : gender[genderIndex].name }}
-						<image class="more" src="/static/news/icon-arrow.png" mode=""></image>
+						<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
 					</view>
 				</picker>
 			</view>
@@ -30,7 +30,12 @@
 				<view class="name-text">
 					手机号
 				</view>
+				<input type="number" v-model="info.mobile" placeholder="请输入手机号">
+
+				<!-- <view>
 					<text>{{ info.mobile }}</text>
+					<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
+				</view>  -->
 			</view>
 		</view>
 		<view class="box">
@@ -38,36 +43,39 @@
 				<view class="name-text">
 					发票助手
 				</view>
-				<image class="more" src="/static/news/icon-arrow.png" mode=""></image>
+				<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
 			</view>
 			<view class="box-avter conten-height">
 				<view class="name-text">
 					清除缓存
 				</view>
-				<image class="more" src="/static/news/icon-arrow.png" mode=""></image>
+				<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
 			</view>
 			<view class="box-avter conten-height">
 				<view class="name-text">
 					隐私
 				</view>
-				<image class="more" src="/static/news/icon-arrow.png" mode=""></image>
+				<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
 			</view>
-			<view class="box-avter conten-height" style="border: none;">
+			<view class="box-avter conten-height">
 				<view class="name-text">
 					关于
 				</view>
-				<image class="more" src="/static/news/icon-arrow.png" mode=""></image>
+				<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
 			</view>
 		</view>
-		<view class="box" style="padding: 0	40rpx;" @click="onOut">
+		<view class="box" style="padding: 0	40rpx;margin-bottom: 140rpx;" @click="onOut">
 			<view class="box-avter conten-height" style="border: none;">
 				<view class="name-text">
 					注销账号
 				</view>
 			</view>
 		</view>
+		<view class="bottomBtn">
 			<button class="submitBtn" @click="sureSubmit">确认修改</button>
 		</view>
+		
+	</view>
 </template>
 
 <script>
@@ -202,7 +210,7 @@
 
 .box {
 	background: #FFF;
-		padding: 24rpx 40rpx;
+	padding: 24rpx 36rpx;
 	margin-top: 20rpx;
 }
 
@@ -212,7 +220,6 @@
 }
 
 .box-avter { 
-		height: 120rpx;
 	width: 100%;
 	display: flex;
 	justify-content: space-between;
@@ -239,29 +246,34 @@
 
 .name-text {
 	font-size: 28rpx;
-		color: #999;
+	color: #303030;
 }
 
 .image_logo {
-		width: 90rpx;
-		height: 90rpx;
+	width: 114rpx;
+	height: 114rpx;
 	border-radius: 50%;
 }
-
+.bottomBtn{
+	width: 100%;
+	position: fixed;
+	bottom: 0;
+	left: 0;
+	height: 140upx;
+	z-index: 88;
+	background: #fff;
+}
 .submitBtn { 
 	height: 88upx; 
-		margin: 64upx 0;
-		margin-bottom: 0;
 	line-height: 88upx;
 	background: #FFAAA4;
 	background: #FE483B;
-		border-radius: 36px 36px 36px 36px;
-		opacity: 1;
+	border-radius: 36px; 
 	font-size: 28upx;
 	font-family: PingFang SC, PingFang SC;
 	font-weight: 500;
 	color: #FFFFFF;
 	text-align: center;
-		margin: 50rpx 30rpx;
+	margin: 30rpx 58rpx;
 }
 </style>