From eebba6608cbb79363c92cc56da693431ea48e1ee Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Tue, 28 Feb 2023 20:53:56 +0800
Subject: [PATCH] Update copy for floating button

---
 src/components/shortcuts-settings.css | 6 ++++++
 src/components/shortcuts-settings.jsx | 8 ++------
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/components/shortcuts-settings.css b/src/components/shortcuts-settings.css
index 756fa406..5d795cfb 100644
--- a/src/components/shortcuts-settings.css
+++ b/src/components/shortcuts-settings.css
@@ -30,6 +30,12 @@
   flex-shrink: 0;
 }
 
+#shortcuts-settings-container .shortcuts-view-mode {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
 #shortcuts-settings-container summary {
   cursor: pointer;
 }
diff --git a/src/components/shortcuts-settings.jsx b/src/components/shortcuts-settings.jsx
index 1681eced..0c20725e 100644
--- a/src/components/shortcuts-settings.jsx
+++ b/src/components/shortcuts-settings.jsx
@@ -206,12 +206,8 @@ function ShortcutsSettings() {
       </header>
       <main>
         <p>
-          Specify a list of shortcuts that'll appear in the floating Shortcuts
-          button.
-        </p>
-        <p>
-          <label>
-            View mode{' '}
+          <label class="shortcuts-view-mode">
+            Specify a list of shortcuts that'll appear&nbsp;as:
             <select
               value={snapStates.settings.shortcutsViewMode || 'float-button'}
               onChange={(e) => {