aboutsummaryrefslogtreecommitdiff
path: root/components
diff options
context:
space:
mode:
Diffstat (limited to 'components')
-rw-r--r--components/fadethrough.tsx18
1 files changed, 18 insertions, 0 deletions
diff --git a/components/fadethrough.tsx b/components/fadethrough.tsx
new file mode 100644
index 0000000..5f5d06c
--- /dev/null
+++ b/components/fadethrough.tsx
@@ -0,0 +1,18 @@
+import Fade from '@material-ui/core/Fade';
+import Grow from '@material-ui/core/Grow';
+import { ReactNode } from 'react';
+
+export default function FadeThroughTransition(props: {
+ from: ReactNode;
+ to: ReactNode;
+ show: boolean;
+}) {
+ return <div className='posabs a0 fadethrough'>
+ <Grow in={props.show} timeout={500}>
+ <div className='posabs a0 to'>{props.to}</div>
+ </Grow>
+ <Fade in={!props.show}>
+ <div className='posabs a0 from'>{props.from}</div>
+ </Fade>
+ </div>;
+}