fix: day 57

Author: solygambas

057-parallax background svg/index.html

@@ -1094,38 +1094,41 @@ <h1>Go Camping</h1>
               rx="2.87"
               ry="2.87"
             />
-            <polygon
-              class="cls-14"
-              points="217.02 303.37 201.68 288.06 206.33 283.42 221.68 298.72 217.02 303.37"
-            />
-            <polygon
-              class="cls-14"
-              points="209.04 291.38 194.44 276.81 195.05 276.2 209.66 290.76 209.04 291.38"
-            />
-            <polygon
-              class="cls-14"
-              points="171.3 248.48 186.64 263.78 181.99 268.43 166.64 253.12 171.3 248.48"
-            />
-            <polygon
-              class="cls-14"
-              points="179.28 260.47 193.88 275.03 193.27 275.65 178.66 261.08 179.28 260.47"
-            />
-            <polygon
-              class="cls-14"
-              points="166.64 298.72 181.99 283.42 186.64 288.06 171.3 303.37 166.64 298.72"
-            />
-            <polygon
-              class="cls-14"
-              points="178.66 290.76 193.27 276.2 193.88 276.81 179.28 291.38 178.66 290.76"
-            />
-            <polygon
-              class="cls-14"
-              points="221.68 253.12 206.33 268.43 201.68 263.78 217.02 248.48 221.68 253.12"
-            />
-            <polygon
-              class="cls-14"
-              points="209.66 261.08 195.05 275.65 194.44 275.03 209.04 260.47 209.66 261.08"
-            />
+            <!-- Group and Animate Windmill Blades -->
+            <g id="Blades">
+              <polygon
+                class="cls-14"
+                points="217.02 303.37 201.68 288.06 206.33 283.42 221.68 298.72 217.02 303.37"
+              />
+              <polygon
+                class="cls-14"
+                points="209.04 291.38 194.44 276.81 195.05 276.2 209.66 290.76 209.04 291.38"
+              />
+              <polygon
+                class="cls-14"
+                points="171.3 248.48 186.64 263.78 181.99 268.43 166.64 253.12 171.3 248.48"
+              />
+              <polygon
+                class="cls-14"
+                points="179.28 260.47 193.88 275.03 193.27 275.65 178.66 261.08 179.28 260.47"
+              />
+              <polygon
+                class="cls-14"
+                points="166.64 298.72 181.99 283.42 186.64 288.06 171.3 303.37 166.64 298.72"
+              />
+              <polygon
+                class="cls-14"
+                points="178.66 290.76 193.27 276.2 193.88 276.81 179.28 291.38 178.66 290.76"
+              />
+              <polygon
+                class="cls-14"
+                points="221.68 253.12 206.33 268.43 201.68 263.78 217.02 248.48 221.68 253.12"
+              />
+              <polygon
+                class="cls-14"
+                points="209.66 261.08 195.05 275.65 194.44 275.03 209.04 260.47 209.66 261.08"
+              />
+            </g>
             <path
               class="cls-17"
               d="M412.3,357.25h-6.24c-.71,0-1.28-1.08-1.28-2.42s.57-2.41,1.28-2.41h6.24Z"

057-parallax background svg/style.css

@@ -57,3 +57,16 @@ svg {
     transform: translateX(-100px);
   }
 }
+
+/* Group and Animate Windmill Blades */
+#Blades {
+  transform-box: fill-box;
+  transform-origin: center;
+  animation: windmill-spin 20s linear infinite;
+}
+
+@keyframes windmill-spin {
+  100% {
+    transform: rotate(360deg);
+  }
+}