notxia/notxia.github.io
1
0
Fork 0
mirror of https://github.com/NotXia/notxia.github.io.git synced 2025-12-19 12:41:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

Update navbar

Browse Source
This commit is contained in:
Tian Cheng (Riccardo) Xia
2023-01-19 19:27:49 +01:00
parent 5eb3298e59
commit 8c442bc25b
2 changed files with 27 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/language-selector/LanguageSelector.vue
View File

@ -1,24 +1,26 @@
<template>
<button id="button-dropdown-locales" data-dropdown-toggle="dropdown-locales" type="button"
class="rounded-full p-1 hover:bg-slate-200 dark:hover:bg-slate-700">
<div class="w-5 h-5 flex items-center justify-center">
<img :src="globe_icon" alt="Language" class="h-full w-full dark:invert" />
<div>
<button id="button-dropdown-locales" data-dropdown-toggle="dropdown-locales" type="button"
class="rounded-full p-1 hover:bg-slate-200 dark:hover:bg-slate-700">
<div class="w-5 h-5 flex items-center justify-center">
<img :src="globe_icon" alt="Language" class="h-full w-full dark:invert" />
</div>
</button>
<div id="dropdown-locales" class="z-10 hidden bg-white divide-y divide-gray-100 rounded shadow dark:bg-gray-700 dark:divide-gray-600">
<ul class="p-3 space-y-1 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="button-dropdown-locales">
<li v-for="locale in $i18n.availableLocales" :key="`locale-${locale}`">
<input :id="`radio-locale-${locale}`" type="radio" :value="locale" name="locale" class="hidden" v-model="$i18n.locale" :onChange="changeLocale">
<label :for="`radio-locale-${locale}`" class="text-sm font-medium uppercase text-gray-900 rounded dark:text-gray-300 ">
<div class="flex items-center p-2 px-5 rounded hover:bg-gray-100 dark:hover:bg-gray-600">
{{ locale }}
</div>
</label>
</li>
</ul>
</div>
</button>
<div id="dropdown-locales" class="z-10 hidden bg-white divide-y divide-gray-100 rounded shadow dark:bg-gray-700 dark:divide-gray-600">
<ul class="p-3 space-y-1 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="button-dropdown-locales">
<li v-for="locale in $i18n.availableLocales" :key="`locale-${locale}`">
<input :id="`radio-locale-${locale}`" type="radio" :value="locale" name="locale" class="hidden" v-model="$i18n.locale" :onChange="changeLocale">
<label :for="`radio-locale-${locale}`" class="text-sm font-medium uppercase text-gray-900 rounded dark:text-gray-300 ">
<div class="flex items-center p-2 px-5 rounded hover:bg-gray-100 dark:hover:bg-gray-600">
{{ locale }}
</div>
</label>
</li>
</ul>
</div>
</template>