<template>
	<view class="nav-card">
		<u-grid :col="4">
			<u-grid-item>
				<u-icon name="photo" :size="30"></u-icon>
				<view class="grid-text">图片</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="lock" :size="30"></u-icon>
				<view class="grid-text">锁头</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="hourglass" :size="30"></u-icon>
				<view class="grid-text">沙漏</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="hourglass" :size="30"></u-icon>
				<view class="grid-text">沙漏</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="photo" :size="30"></u-icon>
				<view class="grid-text">图片</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="lock" :size="30"></u-icon>
				<view class="grid-text">锁头</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="hourglass" :size="30"></u-icon>
				<view class="grid-text">沙漏</view>
			</u-grid-item>
			<u-grid-item>
				<u-icon name="hourglass" :size="30"></u-icon>
				<view class="grid-text">沙漏</view>
			</u-grid-item>
		</u-grid>
	</view>
</template>

<script>
	export default {
		name:"HomeNavCard",
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
.nav-card {
	margin: 15px 0px;
	padding: 10px 0;
	background-color: $uni-bg-color;
	
	border-radius: $uni-border-radius-lg;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.10);
	.grid-text {
		font-size: 14px;
	}
}
</style>