zio
/
elk
2
0
Fork 0
Code Packages Releases 2 Activity

feat: bring zen mode to mobile footer nav (#969)

zio/stable
Ayo Ayco 2023-01-11 15:00:41 +01:00 committed by GitHub
parent af85a5ea8d
commit c92fd7939e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 14 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/nav/NavBottomMoreMenu.vue
View File

@ -82,6 +82,20 @@ onBeforeUnmount(() => {
<span class="i-ri:sun-line dark:i-ri:moon-line flex-shrink-0 text-xl me-4 !align-middle" /> <span class="i-ri:sun-line dark:i-ri:moon-line flex-shrink-0 text-xl me-4 !align-middle" />
{{ colorMode.value === 'light' ? $t('menu.toggle_theme.dark') : $t('menu.toggle_theme.light') }} {{ colorMode.value === 'light' ? $t('menu.toggle_theme.dark') : $t('menu.toggle_theme.light') }}
</button> </button>
<!-- Zen Mode -->
<button
flex flex-row items-center
block px-5 py-2 focus-blue w-full
text-sm text-base capitalize text-left whitespace-nowrap
transition-colors duration-200 transform
hover="bg-gray-100 dark:(bg-gray-700 text-white)"
:aria-label="$t('nav.zen_mode')"
@click="userSettings.zenMode = !userSettings.zenMode"
>
<span :class="userSettings.zenMode ? 'i-ri:layout-right-2-line' : 'i-ri:layout-right-line'" class="flex-shrink-0 text-xl me-4 !align-middle" />
{{ $t('nav.zen_mode') }}
</button>
</div> </div>
</div> </div>
</div> </div>