DeCentN2Madness/aia-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(process): equal-height cards with hover scale effect

Browse Source 
Equalizes all six process cards to the tallest card's height via a
resize-aware script. Adds scale(1.05) hover transition matching the
live site. Adjusts card padding and icon sizing; shortens two step
labels for better card balance.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jeff Hales
2026-06-09 14:47:36 -07:00
parent ce5e53c71f
commit 1bc0224f76
3 changed files with 16 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/src/styles/components.css
+3 -2
View File
@@ -128,8 +128,9 @@
.esa-grid img { max-height: 170px; justify-self: center; }
.process-section h2, .testimonial-section h2 { text-align: center; }
.process-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); margin-top: 2.5rem; }
.process-grid div { background: white; min-height: 190px; padding: 2rem 1rem; text-align: center; }
.process-grid img { margin: 0 auto 1rem; width: 72px; }
.process-grid div { background: white; min-height: 190px; padding: 3.2rem 1rem; position: relative; text-align: center; transition: transform .3s ease-in-out; }
.process-grid div:hover { transform: scale(1.05); z-index: 1; }
.process-grid img { margin: 0 auto 1rem; width: 42%; }
.director-card { align-items: center; display: flex; gap: 1.5rem; }
.director-card img { max-height: 260px; width: auto; }
.signature { max-width: 270px; }