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

@@ -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