Update button styles and add hover and click effects

* Add transition for transform and box-shadow properties * Add hover effect to create a 3D shadow effect * Add click effect to create a 3D shadow effect
WhatsApp-Proxy · Oct 30, 2024 · 26a937e · 26a937e
1 parent 81efa6a
commit 26a937e
Showing 1 changed file with 11 additions and 0 deletions.
diff --git a/src/lib/components/proxyList/connectButton.svelte b/src/lib/components/proxyList/connectButton.svelte
@@ -22,5 +22,16 @@
 		font-size: 1rem;
 		font-weight: 500;
 		cursor: pointer;
+		transition: transform 0.2s, box-shadow 0.2s;
+	}
+
+	button:hover {
+		transform: translateY(-2px);
+		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+	}
+
+	button:active {
+		transform: translateY(2px);
+		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
 	}
 </style>