Cayden Website 2.0: Rewrite with t3code & hand

components/sections/feats.tsx

@@ -0,0 +1,31 @@
+import Reveal from '@/components/ui/reveal';
+import SectionHeading from '@/components/ui/section-heading';
+import { feats } from '@/lib/site';
+
+const Feats = () => (
+	<section id="feats" className="container-page py-16">
+		<SectionHeading title="Leadership">
+			Operations and community work outside of code.
+		</SectionHeading>
+
+		<ul className="grid panel sm:grid-cols-2">
+			{feats.map((feat, i) => (
+				<li
+					key={feat.title}
+					className="border-white/12 p-6 transition-colors not-last:border-b hover:bg-white/[0.04] sm:odd:border-r sm:odd:nth-last-2:border-b-0 md:p-7"
+				>
+					<Reveal delay={i * 60}>
+						<h3 className="font-display text-base font-medium text-ink">
+							{feat.title}
+						</h3>
+						<p className="mt-1.5 text-sm leading-relaxed text-ink/70">
+							{feat.detail}
+						</p>
+					</Reveal>
+				</li>
+			))}
+		</ul>
+	</section>
+);
+
+export default Feats;