feat: polish admin UI, phone login, and product details

Switch admin auth to mobile, restyle shell/login with Vuesax icons, and add product detail fields plus public product pages.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
S. Esmaeili
2026-10-22 17:18:17 +03:30
co-authored by Cursor
parent 789d224ea0
commit 49f30a96b1
54 changed files with 3632 additions and 574 deletions
+55 -7
View File
@@ -3,16 +3,64 @@ defineProps<{ title: string; subtitle?: string; back?: string }>();
</script>
<template>
<div class="mb-6 flex flex-wrap items-center justify-between gap-4">
<div class="flex items-center gap-3">
<RouterLink v-if="back" :to="back" class="text-gray-400 hover:text-gray-700" title="بازگشت">→</RouterLink>
<div>
<h1 class="text-xl font-bold text-gray-800">{{ title }}</h1>
<p v-if="subtitle" class="mt-1 text-sm text-gray-500">{{ subtitle }}</p>
<div class="page-header">
<div class="page-header__main">
<RouterLink v-if="back" :to="back" class="page-header__back" title="بازگشت">→</RouterLink>
<div class="min-w-0">
<h1 class="page-header__title">{{ title }}</h1>
<p v-if="subtitle" class="page-header__subtitle">{{ subtitle }}</p>
</div>
</div>
<div class="flex flex-wrap items-center gap-2">
<div v-if="$slots.default" class="page-header__actions">
<slot />
</div>
</div>
</template>
<style scoped>
.page-header {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.page-header__main {
display: flex;
align-items: center;
gap: 10px;
min-width: 0;
}
.page-header__back {
color: #94a3b8;
text-decoration: none;
transition: color 0.15s ease;
}
.page-header__back:hover {
color: #334155;
}
.page-header__title {
margin: 0;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
color: #0f172a;
}
.page-header__subtitle {
margin: 2px 0 0;
font-size: 13px;
color: #94a3b8;
}
.page-header__actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
</style>