From d0f0a050a30667a431dd78a6b2cb35b5157c4627 Mon Sep 17 00:00:00 2001
From: taahasid <taahasid01@gmail.com>
Date: Fri, 1 Apr 2022 02:26:58 -0400
Subject: [PATCH] animated camera icons

---
 public/assets/background/camera.svg      | 32 ++++++++++++++++++++++++
 src/components/Landing/Sections/Home.jsx | 26 +++++++++++++++++++
 2 files changed, 58 insertions(+)
 create mode 100644 public/assets/background/camera.svg

diff --git a/public/assets/background/camera.svg b/public/assets/background/camera.svg
new file mode 100644
index 000000000..8d256693c
--- /dev/null
+++ b/public/assets/background/camera.svg
@@ -0,0 +1,32 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="1280.000000pt" height="1005.000000pt" viewBox="0 0 1280.000000 1005.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.15, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,1005.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M7387 10040 c-577 -56 -1110 -268 -1547 -617 -117 -94 -316 -288
+-417 -408 -289 -344 -516 -810 -604 -1241 -12 -60 -27 -114 -33 -120 -6 -6
+-78 -23 -161 -38 -82 -15 -157 -29 -166 -32 -12 -3 -35 24 -84 96 -275 414
+-659 725 -1122 909 -465 185 -1034 212 -1518 72 -300 -86 -574 -226 -825 -420
+-117 -90 -330 -306 -419 -424 -204 -273 -352 -583 -424 -892 -114 -484 -78
+-987 103 -1439 142 -357 383 -690 685 -946 235 -199 590 -388 868 -462 l87
+-23 0 -132 0 -133 -239 0 c-140 0 -241 4 -243 9 -2 6 -131 57 -287 115 l-284
+106 -199 0 c-109 0 -198 -2 -198 -5 0 -4 617 -1291 626 -1306 2 -3 56 8 120
+26 l116 31 66 107 65 107 229 0 228 0 0 -1490 0 -1490 4150 0 4150 0 0 2475 0
+2475 -322 0 -322 0 45 37 c410 344 741 860 893 1394 125 438 143 919 51 1375
+-106 523 -371 1023 -750 1413 -401 413 -875 680 -1436 810 -241 56 -645 84
+-882 61z m-2199 -4387 c126 -206 274 -386 471 -574 l134 -129 -742 0 c-409 0
+-741 3 -739 8 2 4 33 52 69 107 110 164 225 400 269 551 l12 41 147 28 c131
+25 314 61 318 64 0 1 28 -43 61 -96z m4196 -4678 c93 -45 146 -130 146 -235 0
+-76 -21 -129 -71 -178 -54 -55 -104 -76 -184 -76 -79 -1 -130 20 -185 76 -129
+129 -77 357 97 423 50 19 147 14 197 -10z"/>
+<path d="M12060 4810 l-724 -440 -573 0 -573 0 2 -1102 3 -1103 580 -5 580 -5
+715 -434 c393 -238 718 -435 723 -438 4 -2 7 889 7 1981 0 1092 -3 1986 -7
+1986 -5 -1 -334 -199 -733 -440z"/>
+</g>
+</svg>
diff --git a/src/components/Landing/Sections/Home.jsx b/src/components/Landing/Sections/Home.jsx
index eda822e7d..3a161c94c 100644
--- a/src/components/Landing/Sections/Home.jsx
+++ b/src/components/Landing/Sections/Home.jsx
@@ -216,6 +216,12 @@ class Home extends Component {
                                             src={"./assets/background/circle_green.svg"}
                                             height={window.innerHeight / 3}
                                         />
+                                        <img
+                                            alt="background"
+                                            src={"./assets/background/camera.svg"}
+                                            height={window.innerHeight / 5}
+                                        />
+                                        
                                     </div>
                                     <div
                                         style={{
@@ -287,6 +293,26 @@ class Home extends Component {
                                             src={"./assets/background/cross_green.svg"}
                                             height={window.innerHeight / 10}
                                         />
+                                        
+                                    </div>
+                                    <div
+                                        style={{
+                                            opacity,
+                                            position: "absolute",
+                                            bottom: window.innerHeight / 2.5,
+                                            left: window.innerWidth / 10 - movement / 10,
+                                            userSelect: "none",
+                                            pointerEvents: "none",
+                                            zIndex: 10,
+                                            transform: "rotate(-30deg)",
+                                        }}
+                                    >
+                                        <img
+                                            alt="background"
+                                            src={"./assets/background/camera.svg"}
+                                            height={window.innerHeight / 5}
+                                        />
+                                        
                                     </div>
                                     <div
                                         style={{