From 5ef2996b4019d9279a7066b758a9247720765010 Mon Sep 17 00:00:00 2001
From: TAKAHASHI Shuuji <shuuji3@gmail.com>
Date: Tue, 29 Aug 2023 00:24:34 +0900
Subject: [PATCH] feat: add keyboard shortcut helper link or button (#2365)

---
 components/nav/NavFooter.vue | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/components/nav/NavFooter.vue b/components/nav/NavFooter.vue
index 9331e333..10856c81 100644
--- a/components/nav/NavFooter.vue
+++ b/components/nav/NavFooter.vue
@@ -28,6 +28,9 @@ function toggleDark() {
           @click="togglePreferences('zenMode')"
         />
       </CommonTooltip>
+      <CommonTooltip :content="$t('magic_keys.dialog_header')">
+        <button flex i-ri:keyboard-box-line dark-i-ri:keyboard-box-line text-lg :aria-label="$t('magic_keys.dialog_header')" @click="toggleKeyboardShortcuts" />
+      </CommonTooltip>
       <CommonTooltip :content="$t('settings.about.sponsor_action')">
         <NuxtLink
           flex
@@ -92,5 +95,10 @@ function toggleDark() {
         GitHub
       </NuxtLink>
     </div>
+    <div>
+      <button hover:underline @click="toggleKeyboardShortcuts">
+        {{ $t('magic_keys.dialog_header') }}
+      </button>
+    </div>
   </footer>
 </template>