Changed around line 1
+
+
+
+
+
+
Cancel Subscription+
+ body {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+ sans-serif;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 100vh;
+ margin: 0;
+ background-color: #f5f5f5;
+ }
+
+ .container {
+ text-align: center;
+ background: white;
+ padding: 2rem;
+ border-radius: 8px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ max-width: 500px;
+ width: 90%;
+ }
+
+ h1 {
+ color: #333;
+ margin-bottom: 1rem;
+ }
+
+ p {
+ color: #666;
+ line-height: 1.6;
+ margin-bottom: 2rem;
+ }
+
+ .cancel-btn {
+ position: relative;
+ padding: 12px 24px;
+ background-color: #ff4444;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ font-size: 16px;
+ transition: all 0.2s ease;
+ }
+
+ .cancel-btn:hover {
+ background-color: #ff0000;
+ }
+
+ #actualButton {
+ position: fixed;
+ transform: translate(-50%, -50%);
+ }
+
+
+
+
+
We're Sorry to See You Go!
+ But we value your time and want to make this process as simple as
+ possible. You can cancel your subscription with just one click.
+
+
+
+
+
+ const button = document.getElementById("actualButton");
+ let mouseX = 0,
+ mouseY = 0;
+
+ // Track mouse position
+ document.addEventListener("mousemove", (e) => {
+ mouseX = e.clientX;
+ mouseY = e.clientY;
+
+ // Get button dimensions and position
+ const rect = button.getBoundingClientRect();
+ const buttonCenterX = rect.left + rect.width / 2;
+ const buttonCenterY = rect.top + rect.height / 2;
+
+ // Calculate distance between mouse and button center
+ const distance = Math.sqrt(
+ Math.pow(mouseX - buttonCenterX, 2) +
+ Math.pow(mouseY - buttonCenterY, 2),
+ );
+
+ // If mouse gets too close, move the button
+ if (distance < 100) {
+ moveButton();
+ }
+ });
+
+ function moveButton() {
+ // Generate new random position
+ const newX = Math.random() * (window.innerWidth - 100);
+ const newY = Math.random() * (window.innerHeight - 100);
+
+ // Ensure button stays within viewport
+ button.style.left = `${Math.min(Math.max(newX, 100), window.innerWidth - 100)}px`;
+ button.style.top = `${Math.min(Math.max(newY, 100), window.innerHeight - 100)}px`;
+ }
+
+ // Initial position
+ moveButton();
+
+ // Handle window resize
+ window.addEventListener("resize", moveButton);
+
+
+