Merge pull request #1734 from Mihajlo88/testingAnimationNation

Testing with videos on reactNative
zero-to-mastery · Sep 21, 2023 · a0ac449 · a0ac449
2 parents ffb9dfd + 221e4dc
commit a0ac449
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 0 deletions.
diff --git a/Art/Mihajlo88/ainamation.gif b/Art/Mihajlo88/ainamation.gif
diff --git a/Art/Mihajlo88/index.html b/Art/Mihajlo88/index.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Skillshare - Animating SVG with Aga Naplocha</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="css/styles.css" type="text/css" />
+  </head>
+  <body>
+    <svg
+      version="1.1"
+      class="happy-face"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlns:xlink="http://www.w3.org/1999/xlink"
+      x="0px"
+      y="0px"
+      viewBox="-1342 713.1 194.9 194.9"
+      style="enable-background: new -1342 713.1 194.9 194.9"
+      xml:space="preserve"
+    >
+      <style type="text/css">
+        .st0 {
+          fill: #f8b0b1;
+        }
+        .st1 {
+          fill: #151d45;
+        }
+        .st2 {
+          fill: #f16060;
+        }
+      </style>
+      <title id="title" lang="en">This is a happy face.</title>
+      <circle class="st0" cx="-1244.6" cy="810.5" r="97.4" />
+      <circle class="st1" cx="-1266.1" cy="786" r="4.8" />
+      <circle class="st1" cx="-1222.2" cy="786" r="4.8" />
+      <path
+        class="st2"
+        d="M-1195.2,816.3c0,27.3-22.1,49.4-49.4,49.4c-27.3,0-49.4-22.1-49.4-49.4H-1195.2z"
+      />
+    </svg>
+  </body>
+</html>
diff --git a/Art/Mihajlo88/styles.css b/Art/Mihajlo88/styles.css
@@ -0,0 +1,15 @@
+.happy-face {
+  height: 500px;
+  animation-name: bounce;
+  animation-duration: 1s;
+  animation-iteration-count: infinite;
+}
+
+@keyframes bounce {
+  30% {
+    transform: translateY(-50px);
+  }
+  50% {
+    transform: scale(1.5) rotate(10deg);
+  }
+}
diff --git a/include.js b/include.js
@@ -6581,6 +6581,13 @@ let cards = [
     imageLink: './Art/ball/bouncing-ball.gif',
     author: 'Varian1',
     githubLink: 'https://github.com/varian1'
+  },
+  {
+    artName: 'TransCopy',
+    pageLink: './Art/Mihajlo88/index.html',
+    imageLink: './Art/Mihajlo88/animation.gif',
+    author: 'Mihajlo88',
+    githubLink: 'https://github.com/Mihajlo'
   }
 ];