feat(text): add bottom fade for text

gerdesque · Jun 14, 2020 · 052243f · 052243f
1 parent ab15273
commit 052243f
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/libs/ui/src/lib/text/text.tsx b/libs/ui/src/lib/text/text.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-
+import Fade from 'react-reveal/Fade';
 import './text.scss';
 
 /* eslint-disable-next-line */
@@ -9,7 +9,11 @@ export interface TextProps {
 
 export const Text = (props: TextProps) => {
   return (
-    <div className='box'><p>{props.value}</p></div>
+    <div className='box'>
+      <Fade bottom>
+        <p>{props.value}</p>
+      </Fade>
+    </div>
   );
 };
 

diff --git a/package.json b/package.json
@@ -90,6 +90,7 @@
     "husky": "^4.2.5",
     "jest": "25.2.3",
     "prettier": "1.19.1",
+    "react-reveal": "^1.2.2",
     "standard-version": "^8.0.0",
     "ts-jest": "25.2.1",
     "ts-node": "~7.0.0",

diff --git a/yarn.lock b/yarn.lock
@@ -13959,6 +13959,13 @@ react-redux@^7.1.0:
     prop-types "^15.7.2"
     react-is "^16.9.0"
 
+react-reveal@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/react-reveal/-/react-reveal-1.2.2.tgz#f47fbc44debc4c185ae2163a215a9e822c7adfef"
+  integrity sha512-JCv3fAoU6Z+Lcd8U48bwzm4pMZ79qsedSXYwpwt6lJNtj/v5nKJYZZbw3yhaQPPgYePo3Y0NOCoYOq/jcsisuw==
+  dependencies:
+    prop-types "^15.5.10"
+
 react-router-dom@^5.1.0, react-router-dom@^5.1.2:
   version "5.1.2"
   resolved "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.1.2.tgz#06701b834352f44d37fbb6311f870f84c76b9c18"