[AI Generated]: refactor(Views): 首页卡片分离命名 weight-card/detail-card

2026-05-13 09:28:00 +08:00
parent ce49b77f17
commit 98a763d4f6
33 changed files with 908 additions and 24 deletions
@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "navigationStyle": "custom"
 }
@@ -1,6 +1,101 @@
-.container {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
+.header {
+	width: 100%;
+	height: 320rpx;
+	margin-bottom: 26rpx;
+	
+	.bg {
+		width: 100%;
+		height: 100%;
+	}
+
+	.user {
+		position: absolute;
+		top: 185rpx;
+		left: 40rpx;
+		right: 40rpx;
+		width: 100%;
+		display: flex;
+		box-sizing: border-box;
+
+		.user-avatar {
+			width: 120rpx;
+			height: 120rpx;
+			border-radius: 16rpx;
+			margin-right: 30rpx;
+			box-sizing: border-box;
+			border: 5rpx solid #ffffff;
+		}
+
+		.user-info {
+			flex: 1;
+			display: flex;
+			flex-flow: column;
+			justify-content: center;
+			overflow: hidden;
+		
+			.user-name {
+				color: #252536;
+				height: 40rpx;
+				font-weight: bold;
+				font-size: 40rpx;
+				line-height: 40rpx;
+				margin-bottom: 22rpx;
+			}
+		
+			.user-meta {
+				height: 28rpx;
+				display: flex;
+				align-items: center;
+		
+				.meta-text {
+					color: #77849E;
+					height: 28rpx;
+					font-size: 28rpx;
+					line-height: 28rpx;
+				}
+		
+				.meta-divider {
+					color: #B6B6B6;
+					height: 28rpx;
+					font-size: 28rpx;
+					line-height: 28rpx;
+					margin: 0 12rpx;
+				}
+			}
+		}
+	}
 }
+
+.list {
+	width: 100%;
+	padding: 0 30rpx;
+	box-sizing: border-box;
+
+	.list-item {
+		width: 100%;
+		height: 110rpx;
+		display: flex;
+		padding-left: 30rpx;
+		padding-right: 20rpx;
+		box-sizing: border-box;
+		align-items: center;
+		flex-wrap: nowrap;
+		border-radius: 16rpx;
+		background-color: #ffffff;
+
+		>view:nth-of-type(1) {
+			width: 38rpx;
+			height: 38rpx;
+			margin-right: 22rpx;
+		}
+
+		>view:nth-of-type(2) {
+			flex: 1;
+			height: 30rpx;
+			color: #394356;
+			font-weight: bold;
+			font-size: 30rpx;
+			line-height: 30rpx;
+		}
+	}
+}
@@ -1,3 +1,29 @@
-<view class="container">
-  <text>我的</text>
+<view class="header">
+	<view class="bg">
+		<image src="/images/my/header.png" mode=""/>
+	</view>
+
+	<view class="user">
+		<view class="user-avatar"></view>
+		<view class="user-info">
+			<view class="user-name">陈知夏</view>
+			<view class="user-meta">
+				<text class="meta-text">男</text>
+				<text class="meta-divider">·</text>
+				<text class="meta-text">56岁</text>
+				<text class="meta-divider">|</text>
+				<text class="meta-text">182cm</text>
+			</view>
+		</view>
+	</view>
 </view>
+
+<view class="list">
+	<view class="list-item">
+		<view>
+			<image src="/images/my/about.png" mode=""/>
+		</view>
+		<view>关于我们</view>
+		<view class="arrow"></view>
+	</view>
+</view>