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

9
frontend/src/shared/components/ControlledInput/index.tsx
View File

@ -1,5 +1,6 @@
import React, { useState, useEffect, useRef } from 'react';
import styled, { css } from 'styled-components/macro';
import theme from '../../../App/ThemeStyles';
const InputWrapper = styled.div<{ width: string }>`
position: relative;
@ -57,14 +58,14 @@ const InputInput = styled.input<{
background: ${props => props.focusBg};
}
&:focus ~ ${InputLabel} {
color: rgba(115, 103, 240);
color: ${props => props.theme.colors.primary};
transform: translate(-3px, -90%);
}
${props =>
props.hasValue &&
css`
& ~ ${InputLabel} {
color: rgba(115, 103, 240);
color: ${props.theme.colors.primary};
transform: translate(-3px, -90%);
}
`}
@ -115,8 +116,8 @@ const ControlledInput = ({
}: ControlledInputProps) => {
const $input = useRef<HTMLInputElement>(null);
const [hasValue, setHasValue] = useState(false);
const borderColor = variant === 'normal' ? 'rgba(0, 0, 0, 0.2)' : '#414561';
const focusBg = variant === 'normal' ? 'rgba(38, 44, 73, )' : 'rgba(16, 22, 58, 1)';
const borderColor = variant === 'normal' ? 'rgba(0, 0, 0, 0.2)' : theme.colors.alternate;
const focusBg = variant === 'normal' ? theme.colors.bg.secondary : theme.colors.bg.primary;
useEffect(() => {
if (autoFocus && $input && $input.current) {
$input.current.focus();