feat: theme for dark mode (#982)

Co-authored-by: QiShaoXuan <qishaoxuan777@gmail.com>
This commit is contained in:
x1a0t
2023-02-16 14:23:24 +08:00
committed by GitHub
parent 520076b31d
commit fe8831f7ae
5 changed files with 37 additions and 26 deletions

View File

@@ -57,8 +57,9 @@ export const StyledCard = styled.div<{
...displayFlex('flex-start', 'flex-start'),
marginBottom: '24px',
transition: 'background .2s',
background: theme.mode === 'light' ? '#FFF' : '#2C2C2C',
':hover': {
background: theme.colors.hoverBackground,
background: theme.colors.cardHoverBackground,
'.add-icon': {
borderColor: theme.colors.primaryColor,
color: theme.colors.primaryColor,
@@ -135,14 +136,13 @@ export const StyleWorkspaceAdd = styled.div(() => {
...displayFlex('center', 'center'),
};
});
export const StyledModalHeader = styled('div')(({ theme }) => {
export const StyledModalHeader = styled('div')(() => {
return {
width: '100%',
height: '72px',
position: 'absolute',
left: 0,
top: 0,
background: theme.colors.pageBackground,
borderRadius: '24px 24px 0 0',
padding: '0 40px',
...displayFlex('space-between', 'center'),

View File

@@ -7,7 +7,7 @@ export const StyledSliderBar = styled.div<{ show: boolean }>(
width: show ? '256px' : '0',
height: '100vh',
minHeight: '450px',
background: theme.mode === 'dark' ? '#272727' : '#F9F9FB',
background: theme.colors.hubBackground,
boxShadow: theme.shadow.modal,
transition: 'width .15s, padding .15s',
position: 'relative',