ED:Font color

This commit is contained in:
supalerk-ar66 2026-01-14 10:20:06 +07:00
parent d8d3dff2e7
commit 563564ee58
14 changed files with 162 additions and 83 deletions

View file

@ -69,7 +69,10 @@ const emit = defineEmits<{
{{ level }}
</span>
</div>
<div v-if="price" class="absolute top-4 right-4 glass px-3 py-1 rounded-full text-xs font-black text-white shadow-sm">
<div v-if="price"
class="absolute top-4 right-4 px-3 py-1 rounded-full text-xs font-black shadow-sm backdrop-blur-md transition-colors"
:class="(price === 'Free' || price === 'ฟรี') ? 'bg-emerald-500 text-white shadow-emerald-500/30' : 'glass text-white'"
>
{{ price }}
</div>
</div>
@ -107,7 +110,7 @@ const emit = defineEmits<{
</div>
<!-- Actions -->
<button v-if="showViewDetails" class="btn-premium-secondary w-full mt-auto" @click="emit('viewDetails')">
<button v-if="showViewDetails" class="btn-premium-primary w-full mt-auto dark:!text-white" @click="emit('viewDetails')">
รายละเอยด
</button>
@ -116,7 +119,7 @@ const emit = defineEmits<{
</NuxtLink>
<div v-if="completed && (showCertificate || showStudyAgain)" class="flex flex-col gap-2 mt-auto">
<NuxtLink v-if="showStudyAgain" to="/classroom/learning" class="btn-premium-secondary w-full">
<NuxtLink v-if="showStudyAgain" to="/classroom/learning" class="btn-premium-primary w-full dark:!text-white">
ทบทวนบทเรยน
</NuxtLink>
<button v-if="showCertificate" class="btn-premium-success w-full shadow-lg shadow-emerald-600/20" @click="emit('viewCertificate')">
@ -172,6 +175,7 @@ const emit = defineEmits<{
font-size: 0.875rem;
border: 1px solid var(--border-color);
transition: all 0.3s ease;
text-align: center;
}
.btn-premium-secondary:hover {
background: var(--bg-body);
@ -180,14 +184,15 @@ const emit = defineEmits<{
}
:global(.dark) .btn-premium-secondary {
background: rgba(255, 255, 255, 0.05);
color: #e2e8f0;
border-color: rgba(255, 255, 255, 0.1);
background: rgba(34, 211, 238, 0.1);
color: #22d3ee !important;
border-color: rgba(34, 211, 238, 0.3) !important;
}
:global(.dark) .btn-premium-secondary:hover {
background: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
background: rgba(34, 211, 238, 0.2);
border-color: #22d3ee !important;
color: #67e8f9 !important;
}
.btn-premium-success {