PhineX Lab | Portfolio Step 7

PhineX / Portfolio · Projects & Contact

7/8

الخطوة ٧

Projects, Contact & Footer

نكمل المحتوى البصري: شبكة المشاريع، نموذج التواصل، والفوتر. آخر خطوة CSS!

المهام

١

للـ .projects-grid: display: grid، grid-template-columns: repeat(3, 1fr)، gap: 18px

٢

للـ .project-card:hover: transform: translateY(-6px)، border-color: rgba(57,255,20,.3)، box-shadow: 0 24px 48px rgba(0,0,0,.4)

٣

للـ .contact-grid: display: grid، grid-template-columns: 1fr 1.6fr

٤

للـ input:focus, textarea:focus: border-color: var(--neon)، box-shadow: 0 0 0 3px rgba(57,255,20,.07)

🎉 تهانينا! انتهيت من كل CSS. الخطوة القادمة هي إضافة JavaScript لتجعل الموقع حياً ومتفاعلاً.

1

alexmorgan.dev / portfolio

◀ السابق

التالي ▶