feat: center home page main layout
All checks were successful
Chromatic / chromatic (push) Successful in 2m38s
CI / ci (push) Successful in 3m41s
CI / commitlint (push) Successful in 17s
Release / release (push) Successful in 57s

This commit is contained in:
Théo LUDWIG 2024-07-31 16:07:10 +02:00
parent 5aa83510e1
commit 189a84b69f
Signed by: theoludwig
GPG Key ID: ADFE5A563D718F3B
2 changed files with 5 additions and 4 deletions

View File

@ -12,6 +12,7 @@ import { unstable_setRequestLocale } from "next-intl/server"
import Image from "next/image" import Image from "next/image"
import WikipediaLogo from "#public/images/Wikipedia-Logo.webp" import WikipediaLogo from "#public/images/Wikipedia-Logo.webp"
import { Section } from "@repo/ui/Layout/Section"
interface HomePageProps extends LocaleProps {} interface HomePageProps extends LocaleProps {}
@ -26,8 +27,8 @@ const HomePage: React.FC<HomePageProps> = (props) => {
const localeWikipedia = fromLocaleToWikipediaLocale(params.locale) const localeWikipedia = fromLocaleToWikipediaLocale(params.locale)
return ( return (
<MainLayout> <MainLayout center>
<section className="text-center"> <Section horizontalSpacing>
<Typography as="h1" variant="h1"> <Typography as="h1" variant="h1">
{t("home.title")} {t("home.title")}
</Typography> </Typography>
@ -43,7 +44,7 @@ const HomePage: React.FC<HomePageProps> = (props) => {
}, },
})} })}
</Typography> </Typography>
</section> </Section>
<section className="my-6 flex items-center justify-center"> <section className="my-6 flex items-center justify-center">
<Image src={WikipediaLogo} alt="Wikipedia" className="w-72" /> <Image src={WikipediaLogo} alt="Wikipedia" className="w-72" />

View File

@ -12,7 +12,7 @@ export const MainLayout: React.FC<MainLayoutProps> = (props) => {
return ( return (
<main <main
className={classNames( className={classNames(
"min-h-[calc(100vh-188px)] md:mx-auto md:max-w-4xl lg:max-w-7xl", "min-h-[calc(100vh-133px)] md:mx-auto md:max-w-4xl lg:max-w-7xl",
{ {
"flex flex-col items-center justify-center text-center": center, "flex flex-col items-center justify-center text-center": center,
}, },