External/SnapOtter
1
0
Fork 0
mirror of https://github.com/snapotter-hq/SnapOtter.git synced 2026-08-03 07:46:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: refine landing hero layout and spacing

Browse Source 
Clean headline break, two-tier subtitle with tool list and lighter
attributes line, more vertical breathing room.
This commit is contained in:
SnapOtter
2026-06-06 11:38:48 +08:00
parent fa897148a4
commit cfe3c1a2b3
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/landing/src/components/hero.tsx
+10 -6
View File
@@ -79,7 +79,7 @@ export function Hero() {
const mouse = useMouseParallax(25);
return (
<section className="relative overflow-hidden px-6 pt-32 pb-24 md:pt-44 md:pb-36">
<section className="relative overflow-hidden px-6 pt-40 pb-32 md:pt-52 md:pb-44">
{/* Gradient mesh background - follows mouse */}
<div
className="pointer-events-none absolute inset-0 -z-10 transition-transform duration-700 ease-out"
@@ -115,15 +115,19 @@ export function Hero() {
<div className="relative mx-auto max-w-4xl text-center">
<h1 className="animate-[fadeUp_0.6s_ease-out_both] font-[family-name:var(--font-nunito)] text-4xl font-extrabold tracking-tight sm:text-5xl md:text-6xl lg:text-7xl">
50+ image tools. One Docker container.
50+ image tools.
<br />
One Docker container.
</h1>
<p className="mt-4 animate-[fadeUp_0.6s_ease-out_0.1s_both] text-base text-muted md:text-lg">
Resize, compress, convert, remove backgrounds, upscale, OCR, and more. Open source. Runs
on your network.
<p className="mx-auto mt-6 max-w-2xl animate-[fadeUp_0.6s_ease-out_0.1s_both] text-base text-muted md:text-lg">
Resize, compress, convert, remove backgrounds, upscale, OCR, and more.
</p>
<p className="mt-2 animate-[fadeUp_0.6s_ease-out_0.15s_both] text-sm tracking-wide text-muted/60">
Open source. Fully offline. Runs on your network.
</p>
<p className="mt-4 animate-[fadeUp_0.6s_ease-out_0.2s_both] text-xl font-medium md:text-2xl">
<p className="mt-6 animate-[fadeUp_0.6s_ease-out_0.2s_both] text-xl font-medium md:text-2xl">
<TypingCursor />
</p>