iamshaunjp#3 finish

beegramin9 · Aug 1, 2021 · 00358b4 · 00358b4
1 parent 4132a81
commit 00358b4
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/pizzajoint/src/components/Home.js b/pizzajoint/src/components/Home.js
@@ -5,10 +5,13 @@ import { motion } from 'framer-motion';
 const Home = () => {
   return (
     <motion.div className="home container"
-      animate={{ rotateZ: 180, opacity: 0.2, marginTop: 200 }}
+      animate= {{ marginTop: 200, opacity:0.2, rotateZ: 160}}
     >
       <motion.h2 
-        animate={{ fontSize: 50, color: '#ff2994', x: 100, y: -100 }}
+        // {{}}의 의미: dynamic date가 들어오면 {}, 그리고 마침 그 dynamic data가 object라서 결론적으로 bracket이 두번 쓰이는 것
+        // jsx의 Style처럼, framerMotion의 animate는 css의 hyphen을 쓰지 않고, CamalCase로 대체한다
+        // x,y는 position right,left,top,bottom 처럼 최초 자리에서 옮겨진다. y축은 위에서 아래로
+        animate={{ fontSize: 50, color:'#ff2994', x: 10, y: -10 }}
       >
         Welcome to Pizza Joint
       </motion.h2>