StarMC/Astral-nook
StarMC/Astral-nook
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Show a message when the spinner is displayed

Browse source
This commit is contained in:
Dane Everitt 2020-07-11 15:45:28 -07:00
parent 93cab68cc3
commit 43f8ec23b8
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
2 changed files with 14 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

5
resources/scripts/components/elements/SpinnerOverlay.tsx
View file

@ -10,16 +10,17 @@ interface Props {
backgroundOpacity?: number;
}
const SpinnerOverlay = ({ size, fixed, visible, backgroundOpacity }: Props) => (
const SpinnerOverlay: React.FC<Props> = ({ size, fixed, visible, backgroundOpacity, children }) => (
<Fade timeout={150} in={visible} unmountOnExit>
<div
css={[
tw`top-0 left-0 flex items-center justify-center w-full h-full rounded`,
tw`top-0 left-0 flex items-center justify-center w-full h-full rounded flex-col`,
!fixed ? tw`absolute` : tw`fixed`,
]}
style={{ zIndex: 9999, background: `rgba(0, 0, 0, ${backgroundOpacity || 0.45})` }}
>
<Spinner size={size}/>
{children && (typeof children === 'string' ? <p css={tw`mt-4 text-neutral-400`}>{children}</p> : children)}
</div>
</Fade>
);