diff --git a/src/components/App/DragLayer.tsx b/src/components/App/DragLayer.tsx index a583af5..046d007 100644 --- a/src/components/App/DragLayer.tsx +++ b/src/components/App/DragLayer.tsx @@ -79,7 +79,7 @@ export const DragLayer = ( duration = defaultDuration; } } - } else if (type === "TASK_BLOCK") { + } else if (type === TASK) { duration = event.duration || defaultDuration; } diff --git a/src/components/Demo/Demo.tsx b/src/components/Demo/Demo.tsx index c2aab62..9e742e1 100644 --- a/src/components/Demo/Demo.tsx +++ b/src/components/Demo/Demo.tsx @@ -4,6 +4,7 @@ import { animated, useSpring, useSpringRef, useChain } from "@react-spring/web"; import styled from "styled-components"; export const Demo = () => { + const [key, setKey] = React.useState(0); const firstRef = useSpringRef(); const secondRef = useSpringRef(); const thirdRef = useSpringRef(); @@ -15,7 +16,7 @@ export const Demo = () => { delay: 1000, config: { duration: 1000 }, }); - + const heading2Styles = useSpring({ ref: secondRef, from: { opacity: 0, transform: "translate3d(0, -40px, 0)" }, @@ -23,15 +24,15 @@ export const Demo = () => { delay: 2500, config: { duration: 1000 }, }); - + const heading3Styles = useSpring({ ref: thirdRef, - from: { opacity: 0, transform: "translate3d(0, -40px, 0)" }, - to: { opacity: 1, transform: "translate3d(0, 0, 0)" }, + from: { opacity: 0, scale: 0.95 }, + to: { opacity: 1, scale: 1 }, delay: 2000, - config: { duration: 1000 }, + config: { duration: 700 }, }); - + useChain([firstRef, secondRef, thirdRef]); return ( @@ -42,11 +43,13 @@ export const Demo = () => { But we can help you waste less. - - Week is a calendar and task manager app -
for individuals who aspire to accomplish more. + + + Week is a calendar and task manager app +
for individuals who aspire to accomplish more. +
-
+ ); }; @@ -57,4 +60,4 @@ const Heading2 = styled(animated.h2)` const Info = styled(animated.div)` text-align: center; -`; \ No newline at end of file +`;