summaryrefslogtreecommitdiffstats
path: root/finished-application/frontend/components/CartCount.js
diff options
context:
space:
mode:
Diffstat (limited to 'finished-application/frontend/components/CartCount.js')
-rw-r--r--finished-application/frontend/components/CartCount.js64
1 files changed, 0 insertions, 64 deletions
diff --git a/finished-application/frontend/components/CartCount.js b/finished-application/frontend/components/CartCount.js
deleted file mode 100644
index ae51f20..0000000
--- a/finished-application/frontend/components/CartCount.js
+++ /dev/null
@@ -1,64 +0,0 @@
-import styled from 'styled-components';
-import { TransitionGroup, CSSTransition } from 'react-transition-group';
-import PropTypes from 'prop-types';
-
-const Dot = styled.div`
- background: ${props => props.theme.red};
- color: white;
- border-radius: 50%;
- padding: 0.5rem;
- line-height: 2rem;
- min-width: 3rem;
- margin-left: 1rem;
- font-weight: 100;
- font-feature-settings: 'tnum';
- font-variant-numeric: tabular-nums;
-`;
-
-const AnimationStyles = styled.span`
- position: relative;
- .count {
- display: block;
- position: relative;
- transition: all 0.4s;
- backface-visibility: hidden;
- }
- .count-enter {
- transform: rotateX(0.5turn);
- }
-
- .count-enter-active {
- transform: rotateX(0);
- }
-
- .count-exit {
- top: 0;
- position: absolute;
- transform: rotateX(0);
- }
-
- .count-exit-active {
- transform: rotateX(0.5turn);
- }
-`;
-
-const CartCount = ({ count }) => (
- <AnimationStyles>
- <TransitionGroup>
- <CSSTransition
- unmountOnExit
- className="count"
- classNames="count"
- key={count}
- timeout={{ enter: 400, exit: 400 }}
- >
- <Dot>{count}</Dot>
- </CSSTransition>
- </TransitionGroup>
- </AnimationStyles>
-);
-
-CartCount.propTypes = {
- count: PropTypes.number.isRequired,
-};
-export default CartCount;