feat: Add global CSS design system with Tailwind integration, light/dark mode support, and a new discovery page.

This commit is contained in:
supalerk-ar66 2026-01-26 16:05:41 +07:00
parent f6cb4e4f81
commit 6d7e78fb33
2 changed files with 55 additions and 2 deletions

View file

@ -1133,3 +1133,48 @@ ul {
.checkbox-visible.q-checkbox--dense .q-checkbox__bg {
border-width: 2px !important;
}
/* ===========================
Dropdown Menu Visibility Enhancement
=========================== */
/* Force white background for all dropdown menus */
.q-menu,
.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 */
background-color: transparent !important;
}
.q-menu .q-item__label {
color: #0f172a !important; /* slate-900 - dark text */
font-weight: 400 !important; /* normal weight */
}
/* Subtle hover state */
.q-menu .q-item:hover {
background-color: #f8fafc !important; /* slate-50 - very light hover */
}
/* 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 */
}
.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 {
color: #0f172a !important;
}