fix: align homepage gutters and Persian heading line height

This commit is contained in:
2026-10-03 10:12:00 +03:30
parent 8bf79e3646
commit e758f138ff
5 changed files with 8 additions and 8 deletions

View File

@@ -29,7 +29,7 @@ export default function Footer({ siteContent }: { siteContent: SiteContent }) {
return (
<footer className="bg-footer pb-[calc(5.5rem+env(safe-area-inset-bottom))] text-footer-foreground md:pb-0" dir="rtl">
<div className="container mx-auto px-4 py-10 md:py-12">
<div className="container mx-auto px-4 py-10 md:px-8 md:py-12 lg:px-12">
<div className="grid gap-9 sm:grid-cols-2 lg:grid-cols-[1.5fr_0.8fr_1fr]">
<div className="space-y-4">
<Link to="/" className="inline-flex items-center gap-3 rounded-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent">

View File

@@ -124,7 +124,7 @@ export default function Navbar({ siteContent }: { siteContent: SiteContent }) {
className="sticky top-0 z-40 border-b border-border bg-background/95 pt-[env(safe-area-inset-top)] backdrop-blur supports-[backdrop-filter]:bg-background/85 md:pt-0"
dir="rtl"
>
<div className="container mx-auto px-4 py-2">
<div className="container mx-auto px-4 py-2 md:px-8 lg:px-12">
<div className="flex min-h-14 items-center justify-between gap-4">
<Link to="/" className="flex min-w-0 items-center gap-3 rounded-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">
<div className="grid h-11 w-11 shrink-0 place-items-center rounded-xl bg-brand-wash p-1.5">

View File

@@ -14,7 +14,7 @@ export default function FeaturedEvents({ content, events }: FeaturedEventsProps)
return (
<section className="py-14 md:py-20" aria-labelledby="home-events-title">
<div className="container mx-auto px-4">
<div className="container mx-auto px-4 md:px-8 lg:px-12">
<div className="mb-7 flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between md:mb-9">
<div className="max-w-2xl">
<h2 id="home-events-title" className="text-2xl font-bold leading-relaxed text-foreground md:text-3xl">

View File

@@ -60,7 +60,7 @@ export default function FeaturedPosts({ content, siteContent, posts }: FeaturedP
return (
<section className="border-y border-border/70 bg-brand-wash/55 py-14 md:py-20" aria-labelledby="home-posts-title">
<div className="container mx-auto px-4">
<div className="container mx-auto px-4 md:px-8 lg:px-12">
<div className="mb-7 flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between md:mb-9">
<div className="max-w-2xl">
<h2 id="home-posts-title" className="text-2xl font-bold leading-relaxed text-foreground md:text-3xl">

View File

@@ -23,12 +23,12 @@ export default function Home({ content, siteContent, events, posts }: HomeProps)
return (
<main className="bg-background" dir="rtl">
<section className="border-b border-border/70 bg-brand-wash/45" aria-labelledby="home-hero-title">
<div className="container mx-auto grid items-center gap-8 px-4 py-10 md:grid-cols-[1.15fr_0.85fr] md:gap-12 md:py-16">
<div className="container mx-auto grid items-center gap-8 px-4 py-10 md:grid-cols-[1.15fr_0.85fr] md:gap-12 md:px-8 md:py-16 lg:px-12">
<div>
<p className="mb-3 text-sm font-semibold text-brand-deep">
{siteContent.faculty_subline}
</p>
<h1 id="home-hero-title" className="max-w-3xl text-3xl font-extrabold leading-[1.45] tracking-tight text-brand-deep sm:text-4xl md:text-5xl">
<h1 id="home-hero-title" className="max-w-3xl text-3xl font-extrabold leading-[1.4] text-brand-deep sm:text-4xl sm:leading-[1.4] md:text-5xl md:leading-[1.15]">
{content.hero_heading || content.title}
</h1>
<p className="mt-4 max-w-2xl text-base leading-8 text-muted-foreground md:text-lg">
@@ -58,7 +58,7 @@ export default function Home({ content, siteContent, events, posts }: HomeProps)
</div>
</div>
<div className="relative grid min-h-48 place-items-center overflow-hidden rounded-2xl border border-border/80 bg-brand-wash px-6 py-10 md:min-h-[320px]">
<div className="relative order-first grid min-h-48 place-items-center overflow-hidden rounded-2xl border border-border/80 bg-brand-wash px-6 py-10 md:order-none md:min-h-[320px]">
<div className="pointer-events-none absolute inset-4 rounded-xl border border-primary/20" aria-hidden="true" />
<div className="pointer-events-none absolute inset-x-0 top-0 h-1.5 bg-accent" aria-hidden="true" />
<div className="pointer-events-none absolute -bottom-24 -left-16 h-56 w-56 rounded-full border border-primary/20" aria-hidden="true" />
@@ -79,7 +79,7 @@ export default function Home({ content, siteContent, events, posts }: HomeProps)
<FeaturedPosts content={content} siteContent={siteContent} posts={posts} />
<section className="bg-primary text-primary-foreground" aria-labelledby="home-participation-title">
<div className="container mx-auto flex flex-col gap-6 px-4 py-12 md:flex-row md:items-center md:justify-between md:py-16">
<div className="container mx-auto flex flex-col gap-6 px-4 py-12 md:flex-row md:items-center md:justify-between md:px-8 md:py-16 lg:px-12">
{content.participation_image ? (
<div className="hidden h-24 w-24 shrink-0 place-items-center overflow-hidden rounded-2xl border border-primary-foreground/20 bg-background/10 p-2 md:grid">
<Image