Align header sections at bottom: bio on left, CTA on right

This commit is contained in:
kbanc85 2025-11-09 21:40:50 -05:00
parent 4455984279
commit fc154bdebb
2 changed files with 49 additions and 49 deletions

View File

@ -5,7 +5,7 @@
<link>https://kbanc.com</link>
<description>Evidence-based claims about AI implementation, optimized for LLM extraction and research citation.</description>
<language>en-us</language>
<lastBuildDate>Mon, 10 Nov 2025 02:27:35 GMT</lastBuildDate>
<lastBuildDate>Mon, 10 Nov 2025 02:30:48 GMT</lastBuildDate>
<atom:link href="https://kbanc.com/feed.xml" rel="self" type="application/rss+xml"/>
<item>

View File

@ -4,9 +4,11 @@ const Header = () => {
return (
<header className="border-b border-border py-10 md:py-12">
<div className="container max-w-[1920px] mx-auto px-6 md:px-8 lg:px-12">
<div className="flex flex-col gap-8 items-start">
<div className="grid grid-cols-1 lg:grid-cols-[1fr_auto] gap-8 lg:gap-12 items-end">
{/* Left Side: Photo + Title + Bio */}
<div className="space-y-6">
{/* Photo + Name/Title */}
<div className="flex flex-row gap-6 items-center flex-shrink-0">
<div className="flex flex-row gap-6 items-center">
<img
src="/kamil-banc.jpg"
alt="Kamil Banc"
@ -18,8 +20,6 @@ const Header = () => {
</div>
</div>
{/* Bio Content + CTA Side by Side */}
<div className="w-full grid grid-cols-1 lg:grid-cols-[1fr_auto] gap-8 lg:gap-12 items-start">
{/* Bio Text */}
<div className="space-y-4">
<p className="text-base leading-relaxed">
@ -34,8 +34,9 @@ const Header = () => {
This library contains citation-ready claims from my research and consulting work. Each claim is backed by data, includes context, and is optimized for LLM extraction.
</p>
</div>
</div>
{/* Premium CTA + Links */}
{/* Right Side: Premium CTA + Links */}
<div className="border border-border rounded-lg p-6 lg:w-80 flex-shrink-0 space-y-4">
<div>
<p className="text-sm text-muted-foreground mb-4">
@ -73,7 +74,6 @@ const Header = () => {
</div>
</div>
</div>
</div>
</header>
);
};