Merge pull request #496 from ananyag309/default

Made uniform cursor throughout the website

Feedback.html

@@ -287,7 +287,6 @@
       left: 0;
       pointer-events: none;
       z-index: 99999999;
-      /* Stays on top of all elements */
     }
 
 
@@ -308,6 +307,27 @@
       font-weight: 500;
       color: green;
     }
+
+    /* Add this new CSS for the cursor effect */
+    .circle-container {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      pointer-events: none;
+      z-index: 9999;
+    }
+
+    .circle {
+      position: absolute;
+      width: 25px;
+      height: 25px;
+      border-radius: 50%;
+      pointer-events: none;
+      background: radial-gradient(circle, rgba(71, 240, 255, 0.3), rgba(0, 119, 255, 0.3));
+      transition: transform 0.1s, left 0.1s, top 0.1s;
+    }
   </style>
 </head>
 
@@ -499,7 +519,73 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
         window.location.href = 'index.html';
       }, 5000); // Adjust the delay as needed
     });
+
+    // Update or add this JavaScript for the cursor effect
+    const coords = { x: 0, y: 0 };
+    const circles = document.querySelectorAll(".circle");
+
+    const colors = [
+      "#ffb56b",
+      "#fdaf69",
+      "#f89d63",
+      "#f59761",
+      "#ef865e",
+      "#ec805d",
+      "#e36e5c",
+      "#df685c",
+      "#d5585c",
+      "#d1525c",
+      "#c5415d",
+      "#c03b5d",
+      "#b22c5e",
+      "#ac265e",
+      "#9c155f",
+      "#950f5f",
+      "#830060",
+      "#7c0060",
+      "#680060",
+      "#60005f",
+      "#48005f",
+      "#3d005e"
+    ];
+
+    circles.forEach(function (circle, index) {
+      circle.x = 0;
+      circle.y = 0;
+      circle.style.backgroundColor = colors[index % colors.length];
+    });
+
+    window.addEventListener("mousemove", function(e){
+      coords.x = e.clientX;
+      coords.y = e.clientY;
+    });
+
+    function animateCircles() {
+      let x = coords.x;
+      let y = coords.y;
+
+      circles.forEach(function (circle, index) {
+        circle.style.left = x - 12 + "px";
+        circle.style.top = y - 12 + "px";
+
+        circle.style.scale = (circles.length - index) / circles.length;
+
+        circle.x = x;
+        circle.y = y;
+
+        const nextCircle = circles[index + 1] || circles[0];
+        x += (nextCircle.x - x) * 0.3;
+        y += (nextCircle.y - y) * 0.3;
+      });
+
+      requestAnimationFrame(animateCircles);
+    }
+
+    animateCircles();
   </script>
+
+  <!-- Add this if it's not already present -->
+  <div class="circle"></div>
 </body>
 
-</html>
+</html>

contact.html

@@ -422,4 +422,4 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
 </script>
 </body>
 
-</html>
+</html>