ui: I HATE STYLED-COMPONENTS WITH TYPESCRIPT

This commit is contained in:
Matthew Penner 2021-07-22 11:15:27 -06:00
parent 23de3d68f3
commit 361596e051
40 changed files with 180 additions and 147 deletions

View file

@ -1,6 +1,6 @@
import React, { Suspense } from 'react';
import styled, { css, keyframes } from 'styled-components/macro';
import tw from 'twin.macro';
import styled, { keyframes } from 'styled-components/macro';
import tw, { css } from 'twin.macro';
export type SpinnerSize = 'small' | 'base' | 'large';
@ -25,12 +25,12 @@ const SpinnerComponent = styled.div<Props>`
border-width: 3px;
border-radius: 50%;
animation: ${spin} 1s cubic-bezier(0.55, 0.25, 0.25, 0.70) infinite;
${props => props.size === 'small' ? tw`w-4 h-4 border-2` : (props.size === 'large' ? css`
${tw`w-16 h-16`};
border-width: 6px;
` : null)};
border-color: ${props => !props.isBlue ? 'rgba(255, 255, 255, 0.2)' : 'hsla(212, 92%, 43%, 0.2)'};
border-top-color: ${props => !props.isBlue ? 'rgb(255, 255, 255)' : 'hsl(212, 92%, 43%)'};
`;