MrUnknownDE/panel
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/panel.git synced 2026-04-19 06:43:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

ui: I HATE STYLED-COMPONENTS WITH TYPESCRIPT

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

8
resources/scripts/components/elements/Spinner.tsx
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%)'};
`;