Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-17 13:46:47 +02:00
Code Issues Projects Releases Wiki Activity

fix: command bar search padding

Browse Source
This commit is contained in:
Tymoteusz Czech 2025-03-14 11:13:11 +01:00
parent bdc21cc4e2
commit 3912b443d0
No known key found for this signature in database
GPG Key ID: 133555230D88D75F
1 changed files with 22 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -68,16 +68,27 @@ const StyledContainer = styled('div', {
}, },
})); }));
const StyledSearch = styled('div')(({ theme }) => ({ const StyledSearch = styled('div')<{ isOpen?: boolean }>(
display: 'flex', ({ theme, isOpen }) => ({
alignItems: 'center', display: 'flex',
backgroundColor: theme.palette.background.paper, alignItems: 'center',
border: `1px solid ${theme.palette.neutral.border}`, backgroundColor: theme.palette.background.paper,
borderRadius: theme.shape.borderRadiusExtraLarge, border: `1px solid ${theme.palette.neutral.border}`,
padding: '3px 5px 3px 12px', borderRadius: theme.shape.borderRadiusExtraLarge,
width: '100%', padding: '3px 5px 3px 12px',
zIndex: 3, width: '100%',
})); zIndex: 3,
...(isOpen
? {
borderBottomLeftRadius: 0,
borderBottomRightRadius: 0,
borderBottom: '0px',
paddingTop: theme.spacing(0.5),
paddingBottom: theme.spacing(0.5),
}
: {}),
}),
);
const StyledInputBase = styled(InputBase)(({ theme }) => ({ const StyledInputBase = styled(InputBase)(({ theme }) => ({
width: '100%', width: '100%',
@ -302,22 +313,7 @@ export const CommandBar = () => {
return ( return (
<StyledContainer ref={searchContainerRef} active={showSuggestions}> <StyledContainer ref={searchContainerRef} active={showSuggestions}>
<RecentlyVisitedRecorder /> <RecentlyVisitedRecorder />
<StyledSearch <StyledSearch isOpen={showSuggestions}>
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,