feat: Implement initial core features including course browsing, authentication, user dashboard, and internationalization.
This commit is contained in:
parent
031ca5c984
commit
797e3db644
19 changed files with 401 additions and 399 deletions
|
|
@ -159,7 +159,6 @@ onMounted(() => {
|
|||
<!-- New Enhanced Search Section (Image 1 Style) -->
|
||||
<div class="bg-blue-50/50 dark:bg-blue-900/10 rounded-[2.5rem] p-8 md:p-10 mb-8 border border-blue-100/50 dark:border-blue-500/10 transition-colors duration-300">
|
||||
<div class="flex items-center gap-4 mb-2">
|
||||
<span class="w-2 h-8 bg-blue-600 rounded-full shadow-lg shadow-blue-500/30"></span>
|
||||
<h1 class="text-2xl md:text-3xl font-black text-slate-900 dark:text-white">
|
||||
{{ $t("discovery.title") }}
|
||||
</h1>
|
||||
|
|
@ -178,7 +177,7 @@ onMounted(() => {
|
|||
v-model="searchQuery"
|
||||
type="text"
|
||||
:placeholder="$t('discovery.searchPlaceholder') || 'ค้นหาคอร์สที่น่าสนใจที่นี่...'"
|
||||
class="w-full pl-14 pr-6 py-3.5 bg-white dark:bg-slate-800 border-2 border-transparent rounded-2xl text-slate-900 dark:text-white placeholder-slate-400 focus:outline-none focus:border-blue-500/20 focus:ring-4 focus:ring-blue-500/5 transition-all text-base font-medium shadow-sm"
|
||||
class="w-full pl-14 pr-6 py-3.5 bg-white dark:!bg-slate-900/80 border-2 border-transparent dark:border-white/5 rounded-2xl text-slate-900 dark:text-white placeholder-slate-400 focus:outline-none focus:border-blue-500/20 focus:ring-4 focus:ring-blue-500/5 transition-all text-base font-medium shadow-sm"
|
||||
@keyup.enter="loadCourses(1)"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -193,13 +192,13 @@ onMounted(() => {
|
|||
>
|
||||
<div class="flex items-center gap-2">
|
||||
<q-icon name="search" size="20px" />
|
||||
<span class="text-base">ค้นหา</span>
|
||||
<span class="text-base">{{ $t("discovery.searchBtn") }}</span>
|
||||
</div>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-between mb-4 px-2">
|
||||
<div class="flex items-center justify-between mb-8 px-2">
|
||||
<div class="text-slate-500 dark:text-slate-400 text-sm font-bold uppercase tracking-wider">
|
||||
{{ $t("discovery.foundTotal") }} <span class="text-blue-600">{{ filteredCourses.length }}</span> {{ $t("discovery.items") }}
|
||||
</div>
|
||||
|
|
@ -207,7 +206,7 @@ onMounted(() => {
|
|||
|
||||
<!-- Unified Filter Section: Categories -->
|
||||
<div
|
||||
class="bg-white dark:bg-slate-900/50 p-2 rounded-2xl border border-slate-100 dark:border-white/5 inline-flex flex-wrap items-center gap-1.5 shadow-sm"
|
||||
class="bg-white dark:!bg-slate-900/50 p-2 rounded-2xl border border-slate-100 dark:border-white/5 inline-flex flex-wrap items-center gap-1.5 shadow-sm mb-12"
|
||||
>
|
||||
<q-btn
|
||||
flat
|
||||
|
|
@ -217,7 +216,7 @@ onMounted(() => {
|
|||
:class="
|
||||
selectedCategoryIds.length === 0
|
||||
? 'bg-blue-600 text-white shadow-md shadow-blue-600/20'
|
||||
: 'text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800'
|
||||
: 'text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:!hover:bg-slate-800/50'
|
||||
"
|
||||
@click="selectedCategoryIds = []"
|
||||
:label="$t('discovery.showAll')"
|
||||
|
|
@ -232,7 +231,7 @@ onMounted(() => {
|
|||
:class="
|
||||
selectedCategoryIds.includes(cat.id)
|
||||
? 'bg-blue-600 text-white shadow-md shadow-blue-600/20'
|
||||
: 'text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:hover:bg-slate-800'
|
||||
: 'text-slate-600 dark:text-slate-400 hover:bg-slate-50 dark:!hover:bg-slate-800/50'
|
||||
"
|
||||
@click="toggleCategory(cat.id)"
|
||||
:label="getLocalizedText(cat.name)"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue