From 9560f80f2afda06d4c0db9e4ea771a44fc80faa2 Mon Sep 17 00:00:00 2001
From: tglide <26071571+TGlide@users.noreply.github.com>
Date: Mon, 20 Mar 2023 19:29:03 +0000
Subject: [PATCH] refactor: sidebar shortcut option key

---
 src/lib/helpers/platform.ts      |  3 +++
 src/lib/layout/navigation.svelte | 10 ++++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 src/lib/helpers/platform.ts

diff --git a/src/lib/helpers/platform.ts b/src/lib/helpers/platform.ts
new file mode 100644
index 000000000..98920c7c6
--- /dev/null
+++ b/src/lib/helpers/platform.ts
@@ -0,0 +1,3 @@
+export function isMac(): boolean {
+    return window.navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+}
diff --git a/src/lib/layout/navigation.svelte b/src/lib/layout/navigation.svelte
index 4a4eeb202..bd2a9fbae 100644
--- a/src/lib/layout/navigation.svelte
+++ b/src/lib/layout/navigation.svelte
@@ -3,6 +3,7 @@
     import { page } from '$app/stores';
     import { trackEvent } from '$lib/actions/analytics';
     import { tooltip } from '$lib/actions/tooltip';
+    import { isMac } from '$lib/helpers/platform';
     import { slide } from '$lib/helpers/transition';
 
     $: project = $page.params.project;
@@ -132,7 +133,12 @@
                         href={`${projectPath}/settings`}
                         on:click={() => trackEvent('click_menu_settings')}
                         class:is-selected={$page.url.pathname.startsWith(`${projectPath}/settings`)}
-                        title="Settings">
+                        title="Settings"
+                        use:tooltip={{
+                            content: 'Settings',
+                            placement: 'right',
+                            disabled: !narrow
+                        }}>
                         <span class="icon-cog" aria-hidden="true" />
                         <span class="text">Settings</span>
                     </a>
@@ -146,7 +152,7 @@
                 aria-label="resize menu"
                 on:click={() => (narrow = !narrow)}
                 use:tooltip={{
-                    content: 'Alt + S'
+                    content: isMac() ? '⌥ + S' : 'Alt + S'
                 }}>
                 <span
                     class:icon-cheveron-right={narrow}