Monorepo for Tangled
appview/pages: dynamic placeholder text in search bar
use UA to determine placeholder text
Signed-off-by: oppiliappan <me@oppi.li>
oppiliappan
(May 11, 2026, 3:16 PM +0100)
2954fa94
26aef503
+16
-1
+16
-1
appview/pages/templates/layouts/fragments/topbar.html
+16
-1
appview/pages/templates/layouts/fragments/topbar.html
···
61
61
hx-swap="innerHTML"
62
62
hx-indicator="#topbar-search-indicator"
63
63
/>
64
-
<kbd class="pointer-events-none flex items-center text-xs border border-gray-200 dark:border-gray-600 rounded border-b-2 px-1 font-sans leading-5 text-gray-400 dark:text-gray-500 peer-focus:hidden peer-[:not(:placeholder-shown)]:hidden">⌘K</kbd>
64
+
<kbd id="search-kbd" class="pointer-events-none flex items-center text-xs border border-gray-200 dark:border-gray-600 rounded border-b-2 px-1 font-sans leading-5 text-gray-400 dark:text-gray-500 peer-focus:hidden peer-[:not(:placeholder-shown)]:hidden"></kbd>
65
+
<script>
66
+
(function() {
67
+
var kbd = document.getElementById('search-kbd');
68
+
if (!kbd) return;
69
+
var ua = navigator.userAgent;
70
+
var isMobile = /Mobi|Android|iPhone|iPad|iPod/i.test(ua);
71
+
if (isMobile) {
72
+
kbd.style.display = 'none';
73
+
} else if (/Macintosh|Mac OS X/.test(ua)) {
74
+
kbd.textContent = '⌘K';
75
+
} else {
76
+
kbd.textContent = 'Ctrl+K';
77
+
}
78
+
})();
79
+
</script>
65
80
<span id="topbar-search-indicator" class="shrink-0">
66
81
{{ i "loader-circle" "size-4 text-gray-400 animate-spin" }}
67
82
</span>