diff --git a/src/theme/SearchBar/styles.css b/src/theme/SearchBar/styles.css index 347c05c06c..b408a04292 100644 --- a/src/theme/SearchBar/styles.css +++ b/src/theme/SearchBar/styles.css @@ -40,13 +40,11 @@ .DocSearch-Form { --docsearch-spacing: 1rem; - --docsearch-highlight-color: var(--cv-theme-tertiary); border-radius: 0; border-bottom: 1px solid #ebedee; } .DocSearch-Hit a { - --docsearch-highlight-color: var(--cv-theme-tertiary); box-shadow: none; padding-left: 0; } @@ -130,6 +128,11 @@ top: 1px; } +.DocSearch-Hits mark { + background: rgb(243 116 64 / 20%); + color: var(--docsearch-hit-color); +} + .DocSearch-Button { --docsearch-searchbox-shadow: none; --docsearch-searchbox-background: transparent; diff --git a/src/theme/SearchPage/index.tsx b/src/theme/SearchPage/index.tsx index 98ce40fe86..8fe0430422 100644 --- a/src/theme/SearchPage/index.tsx +++ b/src/theme/SearchPage/index.tsx @@ -228,31 +228,28 @@ function SearchPageContent(): JSX.Element { /algolia-docsearch-suggestion--highlight/g, 'search-result-match' ); - - const items = hits.map( - ({ - url, - _highlightResult: { hierarchy }, - _snippetResult: snippet = {}, - }: { - url: string; - _highlightResult: { hierarchy: { [key: string]: { value: string } } }; - _snippetResult: { content?: { value: string } }; - }) => { + + const items = hits.reduce((filteredItems, { url, _highlightResult: { hierarchy }, _snippetResult: snippet = {}, anchor }) => { + if (anchor === "site-header" || !anchor) { + return filteredItems; + } + + if (snippet.content) { const titles = Object.keys(hierarchy).map((key) => sanitizeValue(hierarchy[key]!.value) ); - return { + + filteredItems.push({ title: titles.pop()!, url: processSearchResultUrl(url), - summary: snippet.content - ? `${sanitizeValue(snippet.content.value)}...` - : '', + summary: `${sanitizeValue(snippet.content.value)}...`, breadcrumbs: titles, - }; + }); } - ); - + return filteredItems; + }, []); + + searchResultStateDispatcher({ type: 'update', value: { @@ -473,7 +470,26 @@ function SearchPageContent(): JSX.Element { className={styles.searchResultItemHeading} dangerouslySetInnerHTML={{ __html: title }} > - + {breadcrumbs.length > 0 && ( + + )} {summary && (