feat: Implement course discovery and catalog page with browsing, filtering, search, and detailed course views.

This commit is contained in:
supalerk-ar66 2026-01-26 16:36:40 +07:00
parent 92ff037150
commit b96f85e650
2 changed files with 73 additions and 36 deletions

View file

@ -1134,45 +1134,35 @@ ul {
border-width: 2px !important;
}
/* ===========================
Dropdown Menu Visibility Enhancement
=========================== */
/* Force white background for all dropdown menus */
.q-menu,
.q-menu .q-list {
/* ✅ FORCE WHITE DROPDOWN เฉพาะ Light mode (กันทับ Dark mode) */
html:not(.dark) .q-menu,
html:not(.dark) .q-menu .q-list {
background-color: #ffffff !important;
}
/* Dropdown menu items - simple dark text */
.q-menu .q-item {
color: #0f172a !important; /* slate-900 - dark text */
html:not(.dark) .q-menu .q-item {
color: #0f172a !important;
background-color: transparent !important;
}
.q-menu .q-item__label {
color: #0f172a !important; /* slate-900 - dark text */
font-weight: 400 !important; /* normal weight */
html:not(.dark) .q-menu .q-item__label {
color: #0f172a !important;
font-weight: 400 !important;
}
/* Subtle hover state */
.q-menu .q-item:hover {
background-color: #f8fafc !important; /* slate-50 - very light hover */
html:not(.dark) .q-menu .q-item:hover {
background-color: #f8fafc !important;
}
/* Selected/Active item - keep simple, just slightly darker text */
.q-menu .q-item--active {
background-color: transparent !important; /* no background color */
color: #0f172a !important; /* same dark text */
html:not(.dark) .q-menu .q-item--active,
html:not(.dark) .q-menu .q-item--active .q-item__label {
background-color: transparent !important;
color: #0f172a !important;
font-weight: 500 !important;
}
.q-menu .q-item--active .q-item__label {
color: #0f172a !important; /* same dark text */
font-weight: 500 !important; /* slightly bolder */
}
/* Force option text to be dark */
.q-item__label,
.q-select__dropdown .q-item {
html:not(.dark) .q-item__label,
html:not(.dark) .q-select__dropdown .q-item {
color: #0f172a !important;
}