further mobile styling

This commit is contained in:
Paul Wackerow 2022-11-29 18:39:02 -08:00
parent 5d9df5bfd4
commit b95934f292
No known key found for this signature in database
GPG Key ID: BB63E296FE9CAB8D
2 changed files with 18 additions and 1 deletions

@ -41,6 +41,7 @@ export const MobileMenu: React.FC = () => {
border={BORDER_WIDTH}
overflow='hidden'
direction='column'
display={{ md: 'none' }}
>
<Flex borderBottom={BORDER_WIDTH} justify='flex-end'>
{/* CLOSE ICON */}

@ -42,6 +42,10 @@
}
/* Algolia search modal styling */
.DocSearch-Container {
z-index: 1400;
}
.DocSearch-Modal {
border-radius: 0;
background: var(--chakra-colors-bg);
@ -127,8 +131,8 @@ svg[aria-label="Algolia"] * {
font-size: var(--chakra-fontSizes-md)
}
/* Search field in mobile menu */
@media (max-width: 768px) {
/* Search field in mobile menu */
.DocSearch-Button {
padding: 2rem 1rem;
width: 100%;
@ -145,7 +149,19 @@ svg[aria-label="Algolia"] * {
padding: 2rem 1rem;
}
.DocSearch-Button:active, .DocSearch-Button:focus, .DocSearch-Button:hover {
background: var(--chakra-colors-primary);
}
.DocSearch-Search-Icon * {
color: var(--chakra-colors-bg);
}
/* Mobile modal styling */
.DocSearch-Container, .DocSearch-Modal {
position: fixed;
inset: 1rem 1.875rem;
max-width: calc(100vw - 3.75rem);
max-height: calc(100vh - 2rem);
}
}