From bfb8a825e3c4c544ffae37e1d81645d96b8d3f4f Mon Sep 17 00:00:00 2001
From: Adam Shiervani <adam.shiervani@gmail.com>
Date: Tue, 2 Sep 2025 14:31:18 +0200
Subject: [PATCH] refactor(ui): Hide keyboard layout settings on mobile and fix
 minor styling

---
 ui/src/components/VirtualKeyboard.tsx | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/ui/src/components/VirtualKeyboard.tsx b/ui/src/components/VirtualKeyboard.tsx
index 77927a63..60bfa7b1 100644
--- a/ui/src/components/VirtualKeyboard.tsx
+++ b/ui/src/components/VirtualKeyboard.tsx
@@ -254,14 +254,17 @@ function KeyboardWrapper() {
                     Virtual Keyboard
                   </h2>
                   <div className="absolute right-2 flex items-center gap-x-2">
-                    <LinkButton
-                      size="XS"
-                      to="settings/keyboard"
-                      theme="light"
-                      text={selectedKeyboard.name}
-                      TrailingIcon={LuKeyboard}
-                    />
-                    <div className="h-[16px] w-px bg-slate-800/20 dark:bg-slate-200/20" />
+                    <div className="hidden md:flex gap-x-2 items-center">
+                      <LinkButton
+                        size="XS"
+                        to="settings/keyboard"
+                        theme="light"
+                        text={selectedKeyboard.name}
+                        LeadingIcon={LuKeyboard}
+                      />
+                      <div className="h-[20px] w-px bg-slate-800/20 dark:bg-slate-200/20" />
+                    </div>
+
                     <Button
                       size="XS"
                       theme="light"