mukeshs/twenty_crm
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

6
front/src/modules/ui/components/inputs/AutosizeTextInput.tsx
View File

@ -22,10 +22,10 @@ const StyledContainer = styled.div`
`;
const StyledTextArea = styled(TextareaAutosize)`
background: ${(props) => props.theme.tertiaryBackground};
background: ${({ theme }) => theme.background.tertiary};
border: none;
border-radius: 5px;
color: ${(props) => props.theme.text80};
color: ${({ theme }) => theme.font.color.primary};
font-family: inherit;
font-size: 13px;
font-weight: 400;
@ -41,7 +41,7 @@ const StyledTextArea = styled(TextareaAutosize)`
}
&::placeholder {
color: ${(props) => props.theme.text30};
color: ${({ theme }) => theme.font.color.light};
font-weight: 400;
}
`;

8
front/src/modules/ui/components/inputs/DoubleTextInput.tsx
View File

@ -1,8 +1,6 @@
import { ChangeEvent, useRef } from 'react';
import styled from '@emotion/styled';
import { textInputStyle } from '../../layout/styles/themes';
type OwnProps = {
leftValue: string;
rightValue: string;
@ -17,16 +15,14 @@ const StyledContainer = styled.div`
justify-content: space-between;
& > input:last-child {
border-left: 1px solid ${(props) => props.theme.primaryBorder};
padding-left: ${(props) => props.theme.spacing(2)};
border-left: 1px solid ${({ theme }) => theme.border.color.light};
padding-left: ${({ theme }) => theme.spacing(2)};
}
`;
const StyledEditInplaceInput = styled.input`
height: 18px;
width: 45%;
${textInputStyle}
`;
export function DoubleTextInput({

12
front/src/modules/ui/components/inputs/TextInput.tsx
View File

@ -10,22 +10,22 @@ type OwnProps = Omit<
};
const StyledInput = styled.input<{ fullWidth: boolean }>`
background-color: ${({ theme }) => theme.lighterBackgroundTransparent};
border: 1px solid ${({ theme }) => theme.lightBorder};
background-color: ${({ theme }) => theme.background.transparent.lighter};
border: 1px solid ${({ theme }) => theme.border.color.light};
border-radius: 4px;
padding: ${({ theme }) => theme.spacing(2)} ${({ theme }) =>
theme.spacing(3)};
color: ${({ theme }) => theme.text80};
color: ${({ theme }) => theme.font.color.primary};
outline: none;
width: ${({ fullWidth, theme }) =>
fullWidth ? `calc(100% - ${theme.spacing(6)})` : 'auto'};
&::placeholder,
&::-webkit-input-placeholder {
color: ${({ theme }) => theme.text30}
font-family: ${({ theme }) => theme.fontFamily};;
font-weight: ${({ theme }) => theme.fontWeightMedium};
color: ${({ theme }) => theme.font.color.light}
font-family: ${({ theme }) => theme.font.family};;
font-weight: ${({ theme }) => theme.font.weight.medium};
}
margin-bottom: ${({ theme }) => theme.spacing(3)};
`;