chamomind/elearning
7
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages 3 Wiki Activity Actions

Background Color

Browse source
This commit is contained in:
supalerk-ar66 2026-01-23 13:35:56 +07:00
parent 8fc11381ad
commit ae84e7e879
1 changed files with 18 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

34
Frontend-Learner/components/common/LanguageSwitcher.vue
View file

@ -49,8 +49,7 @@ const changeLocale = async (code: string) => {
<q-item-label <q-item-label
header header
class="text-xs font-black uppercase tracking-wider mb-1 px-4 pt-3" class="text-xs font-black uppercase tracking-wider mb-1 px-4 pt-3"
style="color: var(--text-secondary)" :class="['text-slate-900', 'dark:text-slate-200']"
:class="['text-slate-600', 'dark:text-slate-400']"
> >
{{ $t('language.label') }} {{ $t('language.label') }}
</q-item-label> </q-item-label>
@ -65,7 +64,7 @@ const changeLocale = async (code: string) => {
:class="[ :class="[
locale === loc.code locale === loc.code
? 'bg-blue-50 dark:bg-blue-900/20' ? '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;"> <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); 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 { :global(.dark) .language-btn {
background: #1e293b; background: #1e293b;
border-color: rgba(255, 255, 255, 0.15); border-color: rgba(255, 255, 255, 0.15);
@ -180,13 +172,23 @@ const changeLocale = async (code: string) => {
border-color: var(--primary); 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 { :global(.dark) .active-locale {
background: rgba(59, 130, 246, 0.2); background: rgba(59, 130, 246, 0.2);
} }
</style> </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>