Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-23 00:22:19 +01:00
Code Issues Projects Releases Wiki Activity

chore: fix searchbar styling when focus is on results (#7517)

Browse Source
This commit is contained in:
David Leek 2024-07-02 13:15:57 +02:00 committed by GitHub
parent f42e74e7c5
commit 0a2f7e5a61
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/component/commandBar/CommandBar.tsx
View File

@ -72,11 +72,6 @@ const StyledSearch = styled('div')(({ theme }) => ({
padding: '3px 5px 3px 12px', padding: '3px 5px 3px 12px',
width: '100%', width: '100%',
zIndex: 3, zIndex: 3,
'&:focus-within': {
borderBottomLeftRadius: 0,
borderBottomRightRadius: 0,
borderBottom: '0px',
},
})); }));
const StyledInputBase = styled(InputBase)(({ theme }) => ({ const StyledInputBase = styled(InputBase)(({ theme }) => ({
@ -214,7 +209,22 @@ export const CommandBar = () => {
return ( return (
<StyledContainer ref={searchContainerRef} active={showSuggestions}> <StyledContainer ref={searchContainerRef} active={showSuggestions}>
<RecentlyVisitedRecorder /> <RecentlyVisitedRecorder />
<StyledSearch> <StyledSearch
sx={{
borderBottomLeftRadius: (theme) =>
showSuggestions
? 0
: theme.shape.borderRadiusExtraLarge,
borderBottomRightRadius: (theme) =>
showSuggestions
? 0
: theme.shape.borderRadiusExtraLarge,
borderBottom: (theme) =>
showSuggestions
? '0px'
: `1px solid ${theme.palette.neutral.border}`,
}}
>
<SearchIcon <SearchIcon
sx={{ sx={{
mr: 1, mr: 1,