Yadciel/taskcafe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: make theme more consistent

Browse Source
This commit is contained in:
FernTheDev
2020-12-17 19:13:34 -04:00
committed by Jordan Knott
parent ea767f3d19
commit b5fd3b1bf1
56 changed files with 336 additions and 310 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/shared/components/PopupMenu/LabelEditor.tsx
View File

@ -4,7 +4,7 @@ import styled from 'styled-components';
import { SaveButton, DeleteButton, LabelBox, EditLabelForm, FieldLabel, FieldName } from './Styles';
const WhiteCheckmark = styled(Checkmark)`
fill: rgba(${props => props.theme.colors.text.secondary});
fill: ${props => props.theme.colors.text.secondary};
`;
type Props = {
labelColors: Array<LabelColor>;

13
frontend/src/shared/components/PopupMenu/Styles.ts
View File

@ -1,6 +1,7 @@
import styled, { css } from 'styled-components';
import { mixin } from 'shared/utils/styles';
import ControlledInput from 'shared/components/ControlledInput';
import theme from 'App/ThemeStyles';
export const Container = styled.div<{
invertY: boolean;
@ -176,7 +177,7 @@ export const LabelIcon = styled.div`
cursor: pointer;
&:hover {
background: rgb(115, 103, 240);
background: ${props => props.theme.colors.primary};
}
`;
@ -233,8 +234,8 @@ export const FieldName = styled.input`
font-weight: 400;
&:focus {
box-shadow: rgb(115, 103, 240) 0px 0px 0px 1px;
background: ${mixin.darken('#262c49', 0.15)};
box-shadow: ${props => props.theme.colors.primary} 0px 0px 0px 1px;
background: ${mixin.darken(theme.colors.bg.secondary, 0.15)};
}
`;
@ -258,7 +259,7 @@ export const LabelBox = styled.span<{ color: string }>`
`;
export const SaveButton = styled.input`
background: rgb(115, 103, 240);
background: ${props => props.theme.colors.primary};
box-shadow: none;
border: none;
color: #fff;
@ -296,7 +297,7 @@ export const DeleteButton = styled.input`
&:hover {
color: #fff;
background: rgb(115, 103, 240);
background: ${props => props.theme.colors.primary};
border-color: transparent;
}
`;
@ -317,7 +318,7 @@ export const CreateLabelButton = styled.button`
cursor: pointer;
&:hover {
background: rgb(115, 103, 240);
background: ${props => props.theme.colors.primary};
}
`;

3
frontend/src/shared/components/PopupMenu/index.tsx
View File

@ -4,6 +4,7 @@ import useOnOutsideClick from 'shared/hooks/onOutsideClick';
import { createPortal } from 'react-dom';
import NOOP from 'shared/utils/noop';
import produce from 'immer';
import theme from 'App/ThemeStyles';
import {
Container,
ContainerDiamond,
@ -18,7 +19,7 @@ import {
function getPopupOptions(options?: PopupOptions) {
const popupOptions = {
borders: true,
diamondColor: '#262c49',
diamondColor: theme.colors.bg.secondary,
targetPadding: '10px',
showDiamond: true,
width: 316,