Skip to content

feat(ui): Enhance CTA section layout and messaging #2057

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ComputelessComputer merged 1 commit into from
Dec 2, 2025
Merged

feat(ui): Enhance CTA section layout and messaging #2057

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions apps/web/src/routes/_view/blog/$slug.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,8 +91,9 @@ function Component() {
<div className="max-w-[800px] mx-auto px-4 py-8">
<ArticleContent article={article} />
<RelatedArticlesSection relatedArticles={relatedArticles} />
<CTASection />
</div>
<SlashSeparator />
<CTASection />
<MobileCTA />
</div>
</main>
Expand Down Expand Up @@ -202,7 +203,7 @@ function CTASection() {
const platformCTA = getPlatformCTA(platform);

return (
<section className="mt-16 py-16 -mx-4 px-4 bg-linear-to-t from-stone-50/30 to-stone-100/30">
<section className="py-16 px-4 bg-linear-to-t from-stone-50/30 to-stone-100/30">
<div className="flex flex-col gap-6 items-center text-center">
<div className="mb-4 size-40 shadow-2xl border border-neutral-100 flex justify-center items-center rounded-[48px] bg-transparent">
<Image
Expand All @@ -214,12 +215,11 @@ function CTASection() {
/>
</div>
<h2 className="text-2xl sm:text-3xl font-serif">
Where conversations
<br className="sm:hidden" /> stay yours
Try Hyprnote for yourself
</h2>
<p className="text-lg text-neutral-600 max-w-2xl mx-auto">
Start using Hyprnote today and bring clarity to your back-to-back
meetings
The AI notepad for people in back-to-back meetings. Local-first,
privacy-focused, and open source.
</p>
<div className="pt-6 flex flex-col sm:flex-row gap-4 justify-center items-center">
{platformCTA.action === "download" ? (
Expand Down