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

fix: commandbar colors (#9162)

Browse Source 
Searchbar should be white when the new header is active.
This commit is contained in:
Fredrik Strand Oseberg 2025-01-28 14:48:15 +01:00 committed by GitHub
parent 1fba4e10d1
commit 18857c8992
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 18 additions and 4 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,10 +72,16 @@ const StyledContainer = styled('div', {
}, },
})); }));
const StyledSearch = styled('div')(({ theme }) => ({ const StyledSearch = styled('div', {
shouldForwardProp: (prop) => prop !== 'frontendHeaderRedesign',
})<{
frontendHeaderRedesign?: boolean;
}>(({ theme, frontendHeaderRedesign }) => ({
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
backgroundColor: theme.palette.background.elevation1, backgroundColor: frontendHeaderRedesign
? theme.palette.background.paper
: theme.palette.background.elevation1,
border: `1px solid ${theme.palette.neutral.border}`, border: `1px solid ${theme.palette.neutral.border}`,
borderRadius: theme.shape.borderRadiusExtraLarge, borderRadius: theme.shape.borderRadiusExtraLarge,
padding: '3px 5px 3px 12px', padding: '3px 5px 3px 12px',
@ -83,10 +89,16 @@ const StyledSearch = styled('div')(({ theme }) => ({
zIndex: 3, zIndex: 3,
})); }));
const StyledInputBase = styled(InputBase)(({ theme }) => ({ const StyledInputBase = styled(InputBase, {
shouldForwardProp: (prop) => prop !== 'frontendHeaderRedesign',
})<{
frontendHeaderRedesign?: boolean;
}>(({ theme, frontendHeaderRedesign }) => ({
width: '100%', width: '100%',
minWidth: '300px', minWidth: '300px',
backgroundColor: theme.palette.background.elevation1, backgroundColor: frontendHeaderRedesign
? theme.palette.background.paper
: theme.palette.background.elevation1,
})); }));
const StyledClose = styled(Close)(({ theme }) => ({ const StyledClose = styled(Close)(({ theme }) => ({
@ -306,6 +318,7 @@ export const CommandBar = () => {
> >
<RecentlyVisitedRecorder /> <RecentlyVisitedRecorder />
<StyledSearch <StyledSearch
frontendHeaderRedesign={frontendHeaderRedesign}
sx={{ sx={{
borderBottomLeftRadius: (theme) => borderBottomLeftRadius: (theme) =>
showSuggestions showSuggestions
@ -328,6 +341,7 @@ export const CommandBar = () => {
}} }}
/> />
<StyledInputBase <StyledInputBase
frontendHeaderRedesign={frontendHeaderRedesign}
inputRef={searchInputRef} inputRef={searchInputRef}
placeholder={placeholder} placeholder={placeholder}
inputProps={{ inputProps={{