Commit 8127b0be39 for handsontable.com
commit 8127b0be392266db55ca9e59a8bbc234fae37a5c
Author: Artur Mędrygał <artur.medrygal@handsontable.com>
Date: Tue May 19 09:58:15 2026 +0200
DEV-1681: Fix: Correct DocSearch styling for keyboard shortcuts and search bar (#12614)
diff --git a/docs/src/styles/base/typography.css b/docs/src/styles/base/typography.css
index f16841e363..f9491f8da3 100644
--- a/docs/src/styles/base/typography.css
+++ b/docs/src/styles/base/typography.css
@@ -42,7 +42,7 @@
letter-spacing: -0.005em;
}
-kbd:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview kbd) {
+kbd:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview kbd, .DocSearch-Container kbd) {
display: inline-block;
margin: 0.25rem 0.375rem;
padding: 0.075rem 0.375rem;
@@ -61,11 +61,11 @@ kbd:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview
-webkit-box-decoration-break: clone;
}
-kbd:first-child:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview kbd) {
+kbd:first-child:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview kbd, .DocSearch-Container kbd) {
margin-left: 0;
}
-kbd:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview kbd) kbd {
+kbd:not(.handsontable kbd, .example-controls-container kbd, .hot-example-preview kbd, .DocSearch-Container kbd) kbd {
padding: 0;
background: none;
border: none;
diff --git a/docs/src/styles/layout/page.css b/docs/src/styles/layout/page.css
index 6bd84d7d62..23e4188941 100644
--- a/docs/src/styles/layout/page.css
+++ b/docs/src/styles/layout/page.css
@@ -75,6 +75,29 @@ header.header {
z-index: 10200 !important;
}
+/* Search bar: starlight-docsearch adds a ::before icon on .DocSearch-Button-Keys and
+ @docsearch/js injects a "/" .DocSearch-Button-Key — together they read as a broken
+ shortcut hint (DEV-1681). */
+@media (min-width: 50rem) {
+ sl-doc-search .DocSearch-Button-Keys::before {
+ display: none;
+ }
+
+ sl-doc-search .DocSearch-Button-Key {
+ display: none;
+ }
+}
+
+/* Modal footer: global kbd styles add margin and box-shadow that throw off centering. */
+.DocSearch-Button-Key,
+.DocSearch-Commands-Key {
+ align-items: center;
+ justify-content: center;
+ top: 0;
+ line-height: 1;
+ padding-bottom: 0;
+}
+
header.header > .header {
max-width: 1500px;
margin-inline: auto;