From 289f01970fdf25b5a9322a75955fa6a4ce91bcf7 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sat, 12 Feb 2022 09:16:17 -0800
Subject: [PATCH] =?UTF-8?q?fix:=20'Alt'=20should=20be=20displayed=20as=20'?=
 =?UTF-8?q?=E2=8C=A5'=20on=20Mac?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/scenes/KeyboardShortcuts.tsx | 8 ++++----
 app/utils/keyboard.ts            | 2 ++
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/app/scenes/KeyboardShortcuts.tsx b/app/scenes/KeyboardShortcuts.tsx
index 7fc60e42a..2e36b5233 100644
--- a/app/scenes/KeyboardShortcuts.tsx
+++ b/app/scenes/KeyboardShortcuts.tsx
@@ -4,7 +4,7 @@ import styled from "styled-components";
 import Flex from "~/components/Flex";
 import InputSearch from "~/components/InputSearch";
 import Key from "~/components/Key";
-import { metaDisplay } from "~/utils/keyboard";
+import { metaDisplay, altDisplay } from "~/utils/keyboard";
 
 function KeyboardShortcuts() {
   const { t } = useTranslation();
@@ -44,7 +44,7 @@ function KeyboardShortcuts() {
           {
             shortcut: (
               <>
-                <Key>Ctrl</Key> + <Key>Alt</Key> + <Key>h</Key>
+                <Key>Ctrl</Key> + <Key>{altDisplay}</Key> + <Key>h</Key>
               </>
             ),
             label: t("Table of contents"),
@@ -246,7 +246,7 @@ function KeyboardShortcuts() {
           {
             shortcut: (
               <>
-                <Key>Alt</Key> + <Key>↑</Key>
+                <Key>{altDisplay}</Key> + <Key>↑</Key>
               </>
             ),
             label: t("Move list item up"),
@@ -254,7 +254,7 @@ function KeyboardShortcuts() {
           {
             shortcut: (
               <>
-                <Key>Alt</Key> + <Key>↓</Key>
+                <Key>{altDisplay}</Key> + <Key>↓</Key>
               </>
             ),
             label: t("Move list item down"),
diff --git a/app/utils/keyboard.ts b/app/utils/keyboard.ts
index ee34f79a7..627ea1ba5 100644
--- a/app/utils/keyboard.ts
+++ b/app/utils/keyboard.ts
@@ -1,5 +1,7 @@
 import { isMac } from "~/utils/browser";
 
+export const altDisplay = isMac() ? "⌥" : "Alt";
+
 export const metaDisplay = isMac() ? "⌘" : "Ctrl";
 
 export const meta = isMac() ? "cmd" : "ctrl";