admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Apply new theme (#449)

Browse Source 
* Apply new theme

* Fix storybook

* Fixes

* Fix regressions
This commit is contained in:
Charles Bochet
2023-06-26 19:13:04 -07:00
committed by GitHub
parent 2a42ebb70d
commit d6364a9fdd
115 changed files with 818 additions and 721 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
front/src/modules/ui/layout/right-drawer/components/RightDrawer.tsx
View File

@ -12,7 +12,7 @@ import { RightDrawerRouter } from './RightDrawerRouter';
const StyledRightDrawer = styled.div`
display: flex;
flex-direction: row;
width: ${(props) => props.theme.rightDrawerWidth};
width: ${({ theme }) => theme.rightDrawerWidth};
`;
export function RightDrawer() {

6
front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBar.tsx
View File

@ -4,8 +4,8 @@ import { RightDrawerTopBarCloseButton } from './RightDrawerTopBarCloseButton';
const StyledRightDrawerTopBar = styled.div`
align-items: center;
border-bottom: 1px solid ${(props) => props.theme.lightBorder};
color: ${(props) => props.theme.text60};
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
color: ${({ theme }) => theme.font.color.secondary};
display: flex;
flex-direction: row;
font-size: 13px;
@ -18,7 +18,7 @@ const StyledRightDrawerTopBar = styled.div`
const StyledTopBarTitle = styled.div`
align-items: center;
font-weight: 500;
margin-right: ${(props) => props.theme.spacing(1)};
margin-right: ${({ theme }) => theme.spacing(1)};
`;
export function RightDrawerTopBar({

8
front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarCloseButton.tsx
View File

@ -8,7 +8,7 @@ import { isRightDrawerOpenState } from '../states/isRightDrawerOpenState';
const StyledButton = styled.button`
align-items: center;
background: none;
border: 1px solid ${(props) => props.theme.lightBorder};
border: 1px solid ${({ theme }) => theme.border.color.light};
border-radius: 4px;
cursor: pointer;
display: flex;
@ -16,14 +16,14 @@ const StyledButton = styled.button`
height: 24px;
padding: 3px;
transition: ${(props) => props.theme.clickableElementBackgroundTransition};
transition: ${({ theme }) => theme.clickableElementBackgroundTransition};
width: 24px;
&:hover {
background: ${(props) => props.theme.lightBackgroundTransparent};
background: ${({ theme }) => theme.background.transparent.light};
}
svg {
color: ${(props) => props.theme.text40};
color: ${({ theme }) => theme.font.color.tertiary};
transform: rotate(45deg);
}
`;