浏览代码

feat:添加全局scss文件

wangsisi 2 天之前
父节点
当前提交
eeab8ce28a
共有 4 个文件被更改,包括 73 次插入12 次删除
  1. 2 1
      App.vue
  2. 3 3
      pages.json
  3. 62 8
      pages/tabBar/mine/mine.vue
  4. 6 0
      static/style/common.scss

+ 2 - 1
App.vue

@@ -12,6 +12,7 @@
 	}
 </script>
 
-<style>
+<style lang="scss">
 	/*每个页面公共css */
+	@import "@/static/style/common.scss"
 </style>

+ 3 - 3
pages.json

@@ -19,15 +19,15 @@
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
 		"navigationBarTitleText": "飞鸟有味",
-		"navigationBarBackgroundColor": "#F8F8F8",
+		"navigationBarBackgroundColor": "white",
 		"backgroundColor": "#F8F8F8"
 	},
 	"uniIdRouter": {},
 	"tabBar": {
 		"color": "#898989",
 		"selectedColor": "#000000",
-		"borderStyle": "#F7F7F7",
-		"backgroundColor": "#FFFFFF",
+		"borderStyle": "white",
+		"backgroundColor": "white",
 		"list": [{
 				"pagePath": "pages/tabBar/home/home",
 				"iconPath": "https://birdseye-img.sysuimars.com/youwei-uniapp/tabBar/home.png",

+ 62 - 8
pages/tabBar/mine/mine.vue

@@ -1,9 +1,63 @@
-<template>
-	<view>mine</view>
-</template>
-
-<script>
-</script>
-
-<style>
+<template>
+	<view class="base-container">
+		<view class="user-info">
+			<view class="user-left">
+				<image class="avatar" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></image>
+				<view class="info">
+					<text class="name">听妈妈的话</text>
+					<view class="text">这是您使用飞鸟有味的第15天</view>
+				</view>
+			</view>
+			<view class="user-right">收货地址</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+
+</script>
+
+<style lang="scss" scoped>
+	.base-container {
+		width: 100%;
+		min-height: 100vh;
+		background: #f7f7f7;
+		padding: 20rpx 24rpx;
+		box-sizing: border-box;
+
+		.user-info {
+			background: #fff;
+			border-radius: 16rpx;
+			padding: 24rpx;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			.user-left{
+				display: flex;
+				align-items: center;
+				.avatar{
+					width: 92rpx;
+					height: 92rpx;
+					margin-right: 28rpx;
+					border-radius: 50%;
+				}
+				.info{
+					.name{
+						font-family: 'PangMenZhengDao';
+					}
+					.text{
+						font-size: 24rpx;
+					}
+				}
+			}
+			.user-right{
+				font-size: 24rpx;
+				padding: 12rpx 32rpx;
+				border-radius: 50rpx;
+				color: #000;
+				background: #FFD95E;
+				font-weight: 500;
+			}
+		}
+	}
 </style>

+ 6 - 0
static/style/common.scss

@@ -0,0 +1,6 @@
+
+
+@font-face {
+  font-family: "PangMenZhengDao";
+  src: url("https://birdseye-img.sysuimars.com/youwei-uniapp/font/PangMenZhengDao.TTF");
+}