Background Color

This commit is contained in:
supalerk-ar66 2026-01-23 13:35:56 +07:00
parent 8fc11381ad
commit ae84e7e879

View file

@ -49,8 +49,7 @@ const changeLocale = async (code: string) => {
<q-item-label
header
class="text-xs font-black uppercase tracking-wider mb-1 px-4 pt-3"
style="color: var(--text-secondary)"
:class="['text-slate-600', 'dark:text-slate-400']"
:class="['text-slate-900', 'dark:text-slate-200']"
>
{{ $t('language.label') }}
</q-item-label>
@ -65,7 +64,7 @@ const changeLocale = async (code: string) => {
:class="[
locale === loc.code
? 'bg-blue-50 dark:bg-blue-900/20'
: 'hover:bg-slate-50 dark:hover:bg-slate-800'
: 'hover:bg-slate-50 dark:hover:bg-slate-700/50'
]"
>
<q-item-section avatar style="min-width: 0; padding-right: 12px;">
@ -162,13 +161,6 @@ const changeLocale = async (code: string) => {
background: rgba(75, 130, 247, 0.1);
}
:deep(.language-menu) {
border-radius: 16px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
background: var(--bg-surface);
border: 1px solid var(--border-color);
}
:global(.dark) .language-btn {
background: #1e293b;
border-color: rgba(255, 255, 255, 0.15);
@ -180,13 +172,23 @@ const changeLocale = async (code: string) => {
border-color: var(--primary);
}
:global(.dark) :deep(.language-menu) {
background: #1e293b;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}
:global(.dark) .active-locale {
background: rgba(59, 130, 246, 0.2);
}
</style>
<style>
/* Global styles for teleported menu */
.language-menu {
border-radius: 16px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
background: #ffffff;
border: 1px solid #e2e8f0;
}
.dark .language-menu {
background: #1e293b;
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}
</style>