Align header sections at bottom: bio on left, CTA on right
This commit is contained in:
parent
4455984279
commit
fc154bdebb
|
|
@ -5,7 +5,7 @@
|
||||||
<link>https://kbanc.com</link>
|
<link>https://kbanc.com</link>
|
||||||
<description>Evidence-based claims about AI implementation, optimized for LLM extraction and research citation.</description>
|
<description>Evidence-based claims about AI implementation, optimized for LLM extraction and research citation.</description>
|
||||||
<language>en-us</language>
|
<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"/>
|
<atom:link href="https://kbanc.com/feed.xml" rel="self" type="application/rss+xml"/>
|
||||||
|
|
||||||
<item>
|
<item>
|
||||||
|
|
|
||||||
|
|
@ -4,22 +4,22 @@ const Header = () => {
|
||||||
return (
|
return (
|
||||||
<header className="border-b border-border py-10 md:py-12">
|
<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="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">
|
||||||
{/* Photo + Name/Title */}
|
{/* Left Side: Photo + Title + Bio */}
|
||||||
<div className="flex flex-row gap-6 items-center flex-shrink-0">
|
<div className="space-y-6">
|
||||||
<img
|
{/* Photo + Name/Title */}
|
||||||
src="/kamil-banc.jpg"
|
<div className="flex flex-row gap-6 items-center">
|
||||||
alt="Kamil Banc"
|
<img
|
||||||
className="w-24 h-24 md:w-32 md:h-32 rounded-lg object-cover flex-shrink-0"
|
src="/kamil-banc.jpg"
|
||||||
/>
|
alt="Kamil Banc"
|
||||||
<div>
|
className="w-24 h-24 md:w-32 md:h-32 rounded-lg object-cover flex-shrink-0"
|
||||||
<h1 className="text-4xl md:text-5xl font-bold mb-2">Kamil Banc</h1>
|
/>
|
||||||
<p className="text-xl text-secondary">AI Implementation Expert</p>
|
<div>
|
||||||
|
<h1 className="text-4xl md:text-5xl font-bold mb-2">Kamil Banc</h1>
|
||||||
|
<p className="text-xl text-secondary">AI Implementation Expert</p>
|
||||||
|
</div>
|
||||||
</div>
|
</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 */}
|
{/* Bio Text */}
|
||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
<p className="text-base leading-relaxed">
|
<p className="text-base leading-relaxed">
|
||||||
|
|
@ -34,42 +34,42 @@ 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.
|
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>
|
</p>
|
||||||
</div>
|
</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 className="border border-border rounded-lg p-6 lg:w-80 flex-shrink-0 space-y-4">
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm text-muted-foreground mb-4">
|
<p className="text-sm text-muted-foreground mb-4">
|
||||||
Get access to enterprise case studies, premium workflows, and our AI chatbot trained on all assets.
|
Get access to enterprise case studies, premium workflows, and our AI chatbot trained on all assets.
|
||||||
</p>
|
</p>
|
||||||
<a
|
<a
|
||||||
href="https://aiadopters.club/subscribe"
|
href="https://aiadopters.club/subscribe"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
className="bg-accent hover:bg-accent/90 text-accent-foreground font-medium px-4 py-2 rounded-lg transition-colors whitespace-nowrap text-center inline-flex items-center justify-center gap-2 w-full text-sm"
|
className="bg-accent hover:bg-accent/90 text-accent-foreground font-medium px-4 py-2 rounded-lg transition-colors whitespace-nowrap text-center inline-flex items-center justify-center gap-2 w-full text-sm"
|
||||||
>
|
>
|
||||||
Unlock Premium
|
Unlock Premium
|
||||||
<ExternalLink className="h-3 w-3" />
|
<ExternalLink className="h-3 w-3" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-col gap-2 pt-2 border-t border-border">
|
<div className="flex flex-col gap-2 pt-2 border-t border-border">
|
||||||
<a
|
<a
|
||||||
href="https://www.linkedin.com/in/kbanc/"
|
href="https://www.linkedin.com/in/kbanc/"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
className="text-accent hover:underline inline-flex items-center gap-1 text-sm"
|
className="text-accent hover:underline inline-flex items-center gap-1 text-sm"
|
||||||
>
|
>
|
||||||
LinkedIn <ExternalLink className="h-3 w-3" />
|
LinkedIn <ExternalLink className="h-3 w-3" />
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="https://aiadopters.club"
|
href="https://aiadopters.club"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
className="text-accent hover:underline inline-flex items-center gap-1 text-sm"
|
className="text-accent hover:underline inline-flex items-center gap-1 text-sm"
|
||||||
>
|
>
|
||||||
AI Adopters Club <ExternalLink className="h-3 w-3" />
|
AI Adopters Club <ExternalLink className="h-3 w-3" />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue