wx-fensisiyu/pages/mine/mine.vue

<template>
	<view class="page">
		<u-navbar :border-bottom='false' :is-back='false'>
			<text style="margin-left: 24rpx;">我的</text>
		</u-navbar>
		<view class="top u-flex u-row-between">
			<view class="left">
				<image style="width: 116rpx;height: 116rpx;border-radius: 50%;" src="" mode=""></image>
				<view class="" style="margin-left: 22rpx;padding: 20rpx 0 0 0 ;">
					<text class="login">登录/注册</text>
					<view class="look">登录后可使用全部功能</view>
				</view>
			</view>
			<view class="qiandao">
				已签到
			</view>
		</view>
		<view class="back">
			<view class="top1">
				<text style="font-size: 36rpx;">L</text>
				<text>v.0</text>
			</view>
			<view class="bottom">当前成长值：0</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style lang="scss">
	.page {
		min-height: 100vh;
		padding: 0 24rpx;
	}

	.back {
		// background-color: #A1A4B5;
		width: 690rpx;
		height: 128rpx;
		background: linear-gradient(95deg, #898EA3 0%, #A1A4B5 40%, #BDC0D1 100%);
		opacity: 1;
		border-radius: 22rpx;
		padding: 22rpx 0 24rpx 58rpx;

		.top1 {
			font-size: 28rpx;
			font-family: DOUYU;
			font-weight: normal;
			line-height: 38rpx;
			color: #FFF7F7;
			// letter-spacing: 100px;
		}

		.bottom {
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: 400;
			line-height: 32rpx;
			color: #FFF7F7;
			margin-top: 14rpx;
		}
	}

	.top {
		margin: 44rpx 0 38rpx 0;
		overflow: hidden;

		.left {
			display: flex;
			overflow: hidden;

			.login {
				font-size: 36rpx;
				font-family: PingFang SC;
				font-weight: 500;
				line-height: 50rpx;
				color: #323337;
				margin-bottom: 10rpx;
			}

			.look {
				font-size: 24rpx;
				font-family: PingFangSC-Regular;
				line-height: 34rpx;
				color: #959595;
			}
		}

		.qiandao {
			width: 168rpx;
			height: 54rpx;
			background: #B1E3FA;
			box-shadow: 0rpx 6rpx 12rpx #B1E3FA;
			opacity: 1;
			border-radius: 28rpx;
			line-height: 54rpx;
			text-align: center;
			font-size: 26rpx;
			font-family: PingFangSC-Regular;
			color: #FFF7F7;
		}
	}
</style>