3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-08-02 08:19:07 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix: adjust spacing for custom search properly (#7164)

Browse source
This commit is contained in:
Alexey Pyltsyn 2022-04-14 12:53:47 +03:00 • committed by GitHub
parent 03516dc3a7
commit fe064a87a6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 48 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

25
packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.tsx
View file

@ -17,7 +17,6 @@ import {DocSearchButton, useDocSearchKeyboardEvents} from '@docsearch/react';
import type {SearchClient} from 'algoliasearch/lite';
import {useAlgoliaContextualFacetFilters} from '@docusaurus/theme-search-algolia/client';
import Translate, {translate} from '@docusaurus/Translate';
import styles from './styles.module.css';
import type {
DocSearchModal as DocSearchModalType,
@ -233,19 +232,17 @@ function DocSearch({
/>
</Head>
<div className={styles.searchBox}>
<DocSearchButton
onTouchStart={importDocSearchModalIfNeeded}
onFocus={importDocSearchModalIfNeeded}
onMouseOver={importDocSearchModalIfNeeded}
onClick={onOpen}
ref={searchButtonRef}
translations={{
buttonText: translatedSearchLabel,
buttonAriaLabel: translatedSearchLabel,
}}
/>
</div>
<DocSearchButton
onTouchStart={importDocSearchModalIfNeeded}
onFocus={importDocSearchModalIfNeeded}
onMouseOver={importDocSearchModalIfNeeded}
onClick={onOpen}
ref={searchButtonRef}
translations={{
buttonText: translatedSearchLabel,
buttonAriaLabel: translatedSearchLabel,
}}
/>
{isOpen &&
DocSearchModal &&

20
packages/docusaurus-theme-search-algolia/src/theme/SearchBar/styles.module.css
View file

@ -1,20 +0,0 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (max-width: 996px) {
.searchBox {
position: absolute;
right: var(--ifm-navbar-padding-horizontal);
}
}
@media (min-width: 997px) {
.searchBox {
padding: var(--ifm-navbar-item-padding-vertical)
var(--ifm-navbar-item-padding-horizontal);
}
}