34 lines
1.4 KiB
Vue
34 lines
1.4 KiB
Vue
<template>
|
|
<div class="min-h-screen bg-gray-100 p-6">
|
|
<h1 class="text-3xl font-bold text-gray-800 mb-6">Welcome to Your Dashboard</h1>
|
|
|
|
<div class="flex flex-wrap gap-6">
|
|
<!-- Card 1 -->
|
|
<div class="flex-1 min-w-[250px] bg-white p-6 rounded-2xl shadow hover:shadow-md transition">
|
|
<h2 class="text-xl font-semibold text-gray-700 mb-2">Profile</h2>
|
|
<p class="text-gray-500">View and edit your profile info.</p>
|
|
</div>
|
|
|
|
<!-- Card 2 -->
|
|
<div class="flex-1 min-w-[250px] bg-white p-6 rounded-2xl shadow hover:shadow-md transition">
|
|
<h2 class="text-xl font-semibold text-gray-700 mb-2">Notifications</h2>
|
|
<p class="text-gray-500">Check latest alerts and messages.</p>
|
|
</div>
|
|
|
|
<!-- Card 3 -->
|
|
<div class="flex-1 min-w-[250px] bg-white p-6 rounded-2xl shadow hover:shadow-md transition">
|
|
<h2 class="text-xl font-semibold text-gray-700 mb-2">Settings</h2>
|
|
<p class="text-gray-500">Manage account preferences.</p>
|
|
</div>
|
|
|
|
<!-- Card 4 -->
|
|
<div class="flex-1 min-w-[250px] bg-white p-6 rounded-2xl shadow hover:shadow-md transition">
|
|
<h2 class="text-xl font-semibold text-gray-700 mb-2">Analytics</h2>
|
|
<p class="text-gray-500">Track your app usage stats.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
|
|
|