From fb914e83f2ba40e73b4a266fddb55c9c5c209f29 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joaqu=C3=ADn=20S=C3=A1nchez=20Jim=C3=A9nez?=
 <joaquin.sanchez@fi2net.es>
Date: Thu, 14 Jul 2022 00:50:24 +0200
Subject: [PATCH] fix: search bar `CTRL K`

---
 .../theme-default/components/VPNavBarSearch.vue    | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/client/theme-default/components/VPNavBarSearch.vue b/src/client/theme-default/components/VPNavBarSearch.vue
index 58e2c81f..927c29d9 100644
--- a/src/client/theme-default/components/VPNavBarSearch.vue
+++ b/src/client/theme-default/components/VPNavBarSearch.vue
@@ -24,7 +24,7 @@ onMounted(() => {
   // meta key detect (same logic as in @docsearch/js)
   metaKey.value.textContent = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)
     ? '⌘'
-    : 'Ctrl'
+    : 'CTRL'
 
   const handleSearchHotKey = (e: KeyboardEvent) => {
     if (e.key === 'k' && (e.ctrlKey || e.metaKey)) {
@@ -54,7 +54,7 @@ function load() {
   <div v-if="theme.algolia" class="VPNavBarSearch">
     <VPAlgoliaSearchBox v-if="loaded" />
 
-    <div v-else id="docsearch" @click="load">
+    <div v-else id="docsearch-hack" @click="load">
       <button
         type="button"
         class="DocSearch DocSearch-Button"
@@ -79,7 +79,7 @@ function load() {
           <span class="DocSearch-Button-Placeholder">{{ theme.algolia?.buttonText || 'Search' }}</span>
         </span>
         <span class="DocSearch-Button-Keys">
-          <kbd class="DocSearch-Button-Key" ref="metaKey">Meta</kbd>
+          <kbd class="DocSearch-Button-Key DocSearch-Button-Key-Hack" ref="metaKey">Meta</kbd>
           <kbd class="DocSearch-Button-Key">K</kbd>
         </span>
       </button>
@@ -247,6 +247,14 @@ function load() {
   transition: color 0.5s, border-color 0.5s;
 }
 
+.DocSearch-Button .DocSearch-Button-Key.DocSearch-Button-Key-Hack {
+  line-height: 16px;
+  font-size: 9px;
+  padding-left: 4px;
+  margin-left: 2px;
+  font-weight: bolder;
+}
+
 .DocSearch-Button .DocSearch-Button-Key + .DocSearch-Button-Key {
   border-right: 1px solid var(--vp-c-divider);
   border-left: none;