cdricms/latosa-escrima
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

centering features

Browse Source
This commit is contained in:
gom-by
2025-01-13 13:53:53 +01:00
parent 0ef71f41bd
commit e7753fe555
2 changed files with 104 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
latosa-frontend/app/page.tsx
View File

@@ -6,6 +6,7 @@ export default function Home() {
return (
<main>
<Hero />
<div className="flex flex-col">
<Features
title="DÉVELOPPEMENT DU SYSTÈME"
description="Latosa Escrima Concepts est un système martial dynamique et en constante évolution. Ce système repose sur une approche logique, qui progresse au fil du développement des compétences techniques des pratiquants."
@@ -105,6 +106,7 @@ export default function Home() {
</ul>
</FeatureItem>
</Features>
</div>
<Gallery6 />
<Gallery6 />
</main>

8
latosa-frontend/components/features.tsx
View File

@@ -8,8 +8,8 @@ const Features: React.FC<
}>
> = ({ title, description, cta, children }) => {
return (
<section className="py-32 px-4">
<div className="container flex flex-col gap-16 lg:px-16">
<section className="py-32 px-4 container self-center">
<div className="flex flex-col gap-16 lg:px-16">
<div className="lg:max-w-sm">
<h2 className="mb-3 text-xl font-semibold md:mb-4 md:text-4xl lg:mb-6">
{title}
@@ -43,7 +43,7 @@ export const FeatureItem: React.FC<
}>
> = ({ title, children, image, position }) => {
const _image = () => (
<div className="md:min-h-[24rem] lg:min-h-[28rem] xl:min-h-[32rem]">
<div className="md:min-h-[18rem] lg:min-h-[24rem] xl:min-h-[28rem]">
<img
src={image}
alt={title}
@@ -61,7 +61,7 @@ export const FeatureItem: React.FC<
);
return (
<div
className={`flex ${position === "left" ? "flex-col" : "flex-col-reverse"} overflow-clip rounded-xl border border-border md:col-span-2 md:grid md:grid-cols-2 md:gap-6 lg:gap-8`}
className={`flex ${position === "left" ? "flex-col" : "flex-col-reverse"} container self-center overflow-clip rounded-xl border border-border md:col-span-2 md:grid md:grid-cols-2 md:gap-6 lg:gap-8`}
>
{position === "left" ? (
<>