dykj-football/pages/login/index.vue

<template>
	<view class="color">
		<view class="text">
			<h1>
				<p>你好!<br />
					欢迎来打足球奖门人
				</p>
			</h1>
			<span style="font-size: 10px; color: #95918e;">致力于为体育迷创造一片欢乐</span>
		</view>
		<view class="loginBtn">
			<u-button size="large" shape="circle" color="linear-gradient(to bottom, #555555, rgba(0, 0, 0))">
				<span style="color: #e4b698; font-weight: 600;">微信登陆</span>
			</u-button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from 'vue';
	// 获取安全区域的边界
	const {
		safeAreaInsets
	} = uni.getSystemInfoSync();
	const ViewGuru = () => {
		uni.navigateTo({
			url: '/pages/index/compontents/bigMaster',
			animationDuration: '300'
		});
	};
	const masterHand = (item) => {
		uni.navigateTo({
			url: '/pages/index/compontents/masterHand',
			animationDuration: '300'
		});
	};
</script>

<style lang="scss" scoped>
	.color {
		background-image: linear-gradient(to bottom, #f5e7de, #fffbfa);
		height: 100vh;
		width: 100%;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		flex-direction: column;

		.text {
			margin-top: -20%;
			height: 20vh;
			display: flex;
			flex-direction: column;
			justify-content: space-evenly;
		}
	}
	.loginBtn{
		width: 80%;
	}
</style>