Search bar and library menu colours

This commit is contained in:
Jackson Harper 2023-06-12 13:41:03 +08:00
parent 2c9b9cc932
commit eacacbebb3
3 changed files with 23 additions and 6 deletions

View file

@ -243,7 +243,7 @@ function MenuPanel(props: MenuPanelProps): JSX.Element {
fontWeight: '600',
fontSize: '16px',
lineHeight: '125%',
color: '$thTextContrast',
color: '$thLibraryMenuPrimary',
pl: '10px',
my: '20px',
}}
@ -331,11 +331,14 @@ function FilterButton(props: FilterButtonProps): JSX.Element {
width: '100%',
maxWidth: '100%',
height: '32px',
backgroundColor: selected ? '#FFEA9F' : 'unset',
backgroundColor: selected ? '$thLibrarySelectionColor' : 'unset',
fontSize: '14px',
fontWeight: 'regular',
fontFamily: '$display',
color: selected ? '#3D3D3D' : '$thTextSubtle',
color: selected
? '$thLibraryMenuSecondary'
: '$thLibraryMenuUnselected',
verticalAlign: 'middle',
borderRadius: '3px',
cursor: 'pointer',
@ -344,10 +347,14 @@ function FilterButton(props: FilterButtonProps): JSX.Element {
whiteSpace: 'nowrap',
alignItems: 'center',
'&:hover': {
backgroundColor: selected ? '#FFEA9F' : '$thBackground4',
backgroundColor: selected
? '$thLibrarySelectionColor'
: '$thBackground4',
},
'&:active': {
backgroundColor: selected ? '#FFEA9F' : '$thBackground4',
backgroundColor: selected
? '$thLibrarySelectionColor'
: '$thBackground4',
},
}}
onClick={(e) => {

View file

@ -258,7 +258,7 @@ export function SearchBox(props: SearchBoxProps): JSX.Element {
height: '38px',
width: '100%',
maxWidth: '521px',
bg: props.compact ? 'white' : '$thBackground2',
bg: '$thLibrarySearchbox',
borderRadius: '6px',
border: border,
}}

View file

@ -174,6 +174,11 @@ export const { styled, css, theme, getCssText, globalCss, keyframes, config } =
thBackgroundContrast: '#FFFFFF',
thLeftMenuBackground: '#FCFCFC',
thLibraryBackground: '#F3F3F3',
thLibrarySearchbox: '#FCFCFC',
thLibraryMenuPrimary: '#3D3D3D',
thLibraryMenuSecondary: '#3D3D3D',
thLibraryMenuUnselected: '#898989',
thLibrarySelectionColor: '#FFEA9F',
thTextContrast: '#1E1E1E',
thTextContrast2: '#3D3D3D',
@ -263,6 +268,11 @@ const darkThemeSpec = {
thBackgroundContrast: '#000000',
thLeftMenuBackground: '#1D1D1D',
thLibraryBackground: '#333333',
thLibrarySearchbox: '#3D3D3D',
thLibraryMenuPrimary: '#EBEBEB',
thLibraryMenuSecondary: '#EBEBEB',
thLibraryMenuUnselected: '#898989',
thLibrarySelectionColor: '#3D3D3D',
thTextContrast: '#FFFFFF',
thTextContrast2: '#EBEBEB',