From 36baac06b81f53ac182e0909b0a8e7c2bc2f0215 Mon Sep 17 00:00:00 2001
From: Shantur Rathore <i@shantur.com>
Date: Fri, 13 Feb 2026 10:02:15 +0000
Subject: [PATCH] fix(ui): hide kbd hints on non-desktop

---
 .../components/instance/shell/SessionSidebar.tsx    | 13 +++++--------
 packages/ui/src/components/kbd.tsx                  |  4 ++++
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/ui/src/components/instance/shell/SessionSidebar.tsx b/packages/ui/src/components/instance/shell/SessionSidebar.tsx
index 7c846b40..7916766d 100644
--- a/packages/ui/src/components/instance/shell/SessionSidebar.tsx
+++ b/packages/ui/src/components/instance/shell/SessionSidebar.tsx
@@ -118,14 +118,11 @@ const SessionSidebar: Component<SessionSidebarProps> = (props) => (
           </Show>
         </div>
       </div>
-      <Show when={props.keyboardShortcuts().length}>
-        <KeyboardHint
-          class="session-sidebar-shortcuts"
-          shortcuts={props.keyboardShortcuts()}
-          separator=" "
-          showDescription={false}
-        />
-      </Show>
+      <div class="session-sidebar-shortcuts">
+        <Show when={props.keyboardShortcuts().length}>
+          <KeyboardHint shortcuts={props.keyboardShortcuts()} separator=" " showDescription={false} />
+        </Show>
+      </div>
     </div>
 
     <div class="session-sidebar flex flex-col flex-1 min-h-0">
diff --git a/packages/ui/src/components/kbd.tsx b/packages/ui/src/components/kbd.tsx
index d5b9c977..b9869111 100644
--- a/packages/ui/src/components/kbd.tsx
+++ b/packages/ui/src/components/kbd.tsx
@@ -1,4 +1,5 @@
 import { Component, JSX, For } from "solid-js"
+import useMediaQuery from "@suid/material/useMediaQuery"
 import { isMac } from "../lib/keyboard-utils"
 
 interface KbdProps {
@@ -27,6 +28,9 @@ const SPECIAL_KEY_LABELS: Record<string, string> = {
 }
 
 const Kbd: Component<KbdProps> = (props) => {
+  const desktopQuery = useMediaQuery("(min-width: 1280px)")
+  if (!desktopQuery()) return null
+
   const parts = () => {
     if (props.children) return [{ text: props.children, isModifier: false }]
     if (!props.shortcut) return []