From 12b6877aeb0a6bcddab4193b62cd10347b8c328b Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 13:31:11 -0700 Subject: Pulsating holder element showing, even if amount is empty --- packages/instant/src/components/animations/pulse.tsx | 15 +++++++++++++++ 1 file changed, 15 insertions(+) create mode 100644 packages/instant/src/components/animations/pulse.tsx (limited to 'packages/instant/src/components/animations') diff --git a/packages/instant/src/components/animations/pulse.tsx b/packages/instant/src/components/animations/pulse.tsx new file mode 100644 index 000000000..01d6ea070 --- /dev/null +++ b/packages/instant/src/components/animations/pulse.tsx @@ -0,0 +1,15 @@ +import { keyframes, styled } from '../../style/theme'; + +const pulsingKeyframes = keyframes` + 0%, 100% { + opacity: 0.2; + } + 50% { + opacity: 100; + } +`; +export const Pulse = styled.div` + animation-name: ${pulsingKeyframes} + animation-duration: 2s; + animation-iteration-count: infinite; +`; -- cgit v1.2.3