From 5e30cc80f9c0504c122d871b318e4b29b4e36268 Mon Sep 17 00:00:00 2001
From: utkuufuk <utkuufuk@gmail.com>
Date: Mon, 16 Jun 2025 15:15:36 +0300
Subject: [PATCH] ignore case while highlighting search results

---
 .changeset/slimy-cows-press.md                               | 5 +++++
 .../src/components/Search/SearchSectionResultItem.tsx        | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/slimy-cows-press.md

diff --git a/.changeset/slimy-cows-press.md b/.changeset/slimy-cows-press.md
new file mode 100644
index 0000000000..17ec44ca8a
--- /dev/null
+++ b/.changeset/slimy-cows-press.md
@@ -0,0 +1,5 @@
+---
+"gitbook": patch
+---
+
+Ignore case while highlighting search results.
diff --git a/packages/gitbook/src/components/Search/SearchSectionResultItem.tsx b/packages/gitbook/src/components/Search/SearchSectionResultItem.tsx
index a0f467f80f..8ccda684d2 100644
--- a/packages/gitbook/src/components/Search/SearchSectionResultItem.tsx
+++ b/packages/gitbook/src/components/Search/SearchSectionResultItem.tsx
@@ -88,12 +88,12 @@ export const SearchSectionResultItem = React.forwardRef(function SearchSectionRe
 });
 
 function highlightQueryInBody(body: string, query: string) {
-    const idx = body.indexOf(query);
+    const idx = body.toLocaleLowerCase().indexOf(query.toLocaleLowerCase());
 
     // Ensure the query to be highlighted is visible in the body.
     return (
         <p className={tcls('text-sm', 'line-clamp-3', 'relative')}>
-            <HighlightQuery query={query} text={idx < 20 ? body : `...${body.slice(idx - 15)}`} />
+            <HighlightQuery query={query} text={idx < 20 ? body : `...${body.slice(idx - 10)}`} />
         </p>
     );
 }