Merge pull request #54 from Pioreactor/codex/standardize-hover-effects-on-pages

Unify hover effects on cards

Author: CamDavidsonPilon

src/components/Card.module.css

@@ -11,9 +11,9 @@
   flex-direction: column;
   align-items: center;
   border-radius: 10px;
-  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
   overflow: hidden;
   margin: 10px;
+  transition: transform 0.3s ease, box-shadow 0.3s ease;
 }
 
 .newLabel {
@@ -32,10 +32,16 @@
   width: 100%;
   height: 200px;
   object-fit: cover;
+  transition: transform 0.3s ease;
+}
+
+.card:hover .cardImage {
+  transform: scale(1.03);
 }
 
 .card:hover {
-  transform: scale(1.05); /* Optional: scale up on hover */
+  transform: translateY(-1px);
+  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
 }
 
 .cardHeader {