feat: Add clients

Signed-off-by: Avior <github@avior.me>

Dockerfile.static

@@ -32,7 +32,7 @@ FROM docker.io/nginx:1-alpine
 WORKDIR /usr/share/nginx/html
 
 # Copy the nginx config
-ADD ./.docker/nginx.conf /etc/nginx/nginx.conf
+ADD ./nginx.conf /etc/nginx/nginx.conf
 
 # Copy dist fro mthe build image
 COPY --from=BUILD_IMAGE /home/node/dist ./

package-lock.json

@@ -14,6 +14,7 @@
 				"@fontsource-variable/lexend": "^5.0.12",
 				"@tailwindcss/typography": "^0.5.10",
 				"astro": "^3",
+				"astro-seo": "^0.8.0",
 				"easy-sitemap": "^1.2.0",
 				"lucide-astro": "^0",
 				"simple-icons-astro": "^9.16.0",
@@ -1612,6 +1613,11 @@
 				"sharp": "^0.32.5"
 			}
 		},
+		"node_modules/astro-seo": {
+			"version": "0.8.0",
+			"resolved": "https://registry.npmjs.org/astro-seo/-/astro-seo-0.8.0.tgz",
+			"integrity": "sha512-7gq6lhibCM8FuzZIJlbLLWP5EJ9KL2/4XqeFrAg9O6ZK2xMFxJ5ubKf+a0VJwwTu8W8Xr421CmpiXu6Hq7n/7Q=="
+		},
 		"node_modules/autoprefixer": {
 			"version": "10.4.16",
 			"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",

package.json

@@ -23,6 +23,7 @@
 		"@fontsource-variable/lexend": "^5.0.12",
 		"@tailwindcss/typography": "^0.5.10",
 		"astro": "^3",
+		"astro-seo": "^0.8.0",
 		"easy-sitemap": "^1.2.0",
 		"lucide-astro": "^0",
 		"simple-icons-astro": "^9.16.0",

src/components/global/Breadcrumb.astro

@@ -1,5 +1,4 @@
 ---
-import { Home } from 'lucide-astro'
 interface Props {
 	items: Array<{
 		text: string

src/content/clients/agence-cote-particulier-mortagne-sur-sevre/index.md

@@ -0,0 +1,10 @@
+---
+title: Agence côté Particuliers de Mortagne sur Sevre
+site: https://www.sevrecholetais.immo
+logo:
+  src: ./logo.png
+  invert: true
+---
+
+- **Développement** d'un logiciel de récupération d'annonce.
+- **Maintenance** et **Hébergement** du logiciel.

src/content/clients/nasap3d/index.md

@@ -0,0 +1,12 @@
+---
+title: Nasap3D
+site: https://www.nasap3d.com
+logo:
+  src: ./logo.png
+  invert: true
+---
+
+- **Reconstruction** d'un site Wix vers un **développement** spécialisé.
+- **Développement** d'une solution de paiement automatique pour les modèles 3D.
+- **Maintenance** de site internet
+- **Hébergement** de site internet

src/content/clients/spideer.md

@@ -1,3 +0,0 @@
----
-title: Spideer.fr
----

src/content/clients/spideer/index.md

@@ -0,0 +1,9 @@
+---
+title: Spideer.fr
+site: https://www.spideer.fr
+logo:
+  src: ./spideer.png
+---
+
+- **Développement**, **maintenance** et **hébergement** de [studiomoto.fr](/projets/studiomoto)
+- **Hébergement** des sites internet produits par l'Agence.

src/content/config.ts

@@ -6,6 +6,7 @@ const projectsCollection = defineCollection({
 	type: 'content',
 	schema: ({ image }) => z.object({
 		title: z.string(),
+		description: z.string().optional(),
 		image: image().optional(),
 		link: z.object({
 			href: z.string(),
@@ -26,8 +27,13 @@ const blogCollection = defineCollection({
 })
 const clientsCollection = defineCollection({
 	type: 'content',
-	schema: z.object({
+	schema: ({ image }) => z.object({
-		title: z.string()
+		title: z.string(),
+		site: z.string(),
+		logo: z.object({
+			src: image(),
+			invert: z.boolean().optional()
+		}).optional()
 	})
 })
 

src/content/projects/fi3d/index.md

@@ -1,5 +1,6 @@
 ---
-title: "FI3D : Le Portail Ultime pour les Filaments 3D"
+title: "FI3D, Le Portail Ultime pour les Filaments 3D"
+description: FI3D, l'agrégateur de filaments 3D en FDM. Découvrez une large gamme de filaments pour imprimantes 3D, comparez caractéristiques et prix, explorez des produits locaux, et simplifiez vos achats.
 link:
   href: https://fi3d.fr
   rel: _blank

src/content/projects/studiomoto/index.md

@@ -1,6 +1,6 @@
 ---
 title: Studiomoto, Site de référencement d’événement Moto en France
-disabled: Site Inactif
+description: Découvrez Studiomoto, la plateforme dédiée à l'univers de la moto en France. Référencement complet des événements moto, design élégant par l'agence Spideer, contribution ouverte aux organisateurs.
 link:
   href: https://www.studiomoto.fr
 image: ./og.png
@@ -8,12 +8,13 @@ created: 2018-09-10
 updated: 2021-04-29
 ---
 
-# Studiomoto : L'Incontournable Référencement des Événements Moto en France
+![Logo de Studiomoto](./logo.svg)
-
-![Studiomoto](./accueil.png)
 
 **Studiomoto** est bien plus qu'un simple site web. C'est une véritable plateforme dédiée à l'univers passionnant de la moto en France. Développé par Florian BOUILLON et méticuleusement designé par l'agence Spideer, Studiomoto se positionne en tant qu'acteur majeur dans le domaine de l'événementiel motard.
 
+![Studiomoto](./accueil.png)
+*Image 1 : Accueil de Studiomoto.fr*
+
 ## Une Vitrine des Événements Moto
 
 Studiomoto remplit une mission essentielle : celle de référencer et de communiquer sur les divers événements moto se déroulant à travers la France. Qu'il s'agisse de rassemblements, de salons, de compétitions ou de toute autre manifestation liée à la moto, Studiomoto est la source incontournable pour les amateurs et les passionnés de deux-roues.
@@ -43,5 +44,3 @@ Les organisateurs peuvent ajouter des détails complets sur leurs événements,
 En résumé, Studiomoto est bien plus qu'un simple site de référencement d'événements moto en France. C'est une plateforme dynamique qui rapproche la communauté motarde et met en lumière la richesse de l'univers de la moto dans l'hexagone.
 
 Si vous êtes passionné de deux-roues, que vous soyez un motard chevronné ou un amateur curieux, Studiomoto est l'endroit où vous trouverez les informations essentielles sur les événements moto en France.
-
-Pour ne rien manquer des prochaines manifestations motardes, rendez-vous sur [Studiomoto](https://www.studiomoto.fr) dès aujourd'hui !

src/content/projects/studiomoto/logo.svg

@@ -0,0 +1,42 @@
+<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 395.1 83.4"
+	xml:space="preserve">
+	<style>
+		.st0 {
+			fill: #3f8cc6
+		}
+	</style>
+	<g id="Groupe_239" transform="translate(99 18)">
+		<path id="Tracé_11_1_" class="st0"
+			d="M1.5 42.6c2.1 1.4 4.6 2.1 7.1 2.1 3.8 0 7.2-2.2 7.2-6.3 0-2.5-1.4-4.3-4.9-6.3-4.3-2.3-6.6-5-6.6-8.6 0-6 5.2-9.8 11.3-9.8 2.4-.1 4.8.6 6.8 1.8l-1.5 3.3c-1.8-1-3.8-1.6-5.8-1.5-4.1 0-6.6 2.7-6.6 5.5s1.7 4.3 5.2 6.2c4.1 2.2 6.4 4.8 6.4 8.9 0 5.8-4.6 10.3-12.1 10.3-3.4 0-6.6-1.1-8-2.3l1.5-3.3z" />
+		<path id="Tracé_12_1_" class="st0" d="M35.5 17.3h-9.8l.7-3.6h23.7l-.7 3.6h-9.8L34 48.2h-4.1l5.6-30.9z" />
+		<path id="Tracé_13_1_" class="st0"
+			d="M58 13.7l-3.8 20.4c-.3 1.4-.4 2.8-.4 4.2 0 4.3 2.5 6.4 6.2 6.4 4.6 0 7.9-3.1 9.3-10.5l3.8-20.5h4.1l-3.8 20.6c-1.9 9.9-6.9 14-14 14-5.5 0-9.7-3-9.7-9.8 0-1.5.2-3.1.4-4.6l3.7-20.1 4.2-.1z" />
+		<path id="Tracé_14_1_" class="st0"
+			d="M84.4 14.4c2.8-.5 5.6-.7 8.4-.7 5.7 0 10 1.6 12.5 4.5 1.8 1.9 3.2 5 3.2 9.2 0 6.2-2.5 12.3-6.9 16-3.9 3.3-8.9 4.7-15.4 4.7-2.8 0-5.5-.1-8.3-.4l6.5-33.3zm-1.6 29.9c1.4.2 2.9.3 4.3.2 5.3 0 9.8-1.3 12.6-4.2 3.2-3.3 5-7.7 5-12.3 0-5.9-4-10.4-12.3-10.4-1.5 0-3.1.1-4.6.3l-5 26.4z" />
+		<path id="Tracé_15_1_" class="st0" d="M121 13.8l-6.3 34.4h-4.1l6.3-34.4h4.1z" />
+		<path id="Tracé_16_1_" class="st0"
+			d="M153.2 27.4c0 5.8-2.1 12.2-6 16.1-3 3-7.2 4.7-11.4 4.7-8.6 0-12.7-6.5-12.7-13.6 0-5.9 2.3-12.4 6.4-16.4 3-2.9 7-4.5 11.2-4.5 8.9.1 12.5 6.6 12.5 13.7zm-20.7-6.8c-3.2 3.2-5.1 9.1-5.1 13.7 0 5.4 2.4 10.4 9 10.4 2.9-.1 5.6-1.2 7.6-3.3 3.1-3.2 4.9-9.2 4.9-13.8 0-4.8-1.5-10.4-8.8-10.4-2.9.1-5.7 1.3-7.6 3.4z" />
+		<g id="Groupe_3_1_" transform="translate(157.801)">
+			<path id="Tracé_17_1_" class="st0"
+				d="M20.9 30l-3.2-16.2H7.3L0 48.2h9.5L13.4 30l2.2 12.8h5L28.3 30l-3.8 18.2H34l7.3-34.5H31L20.9 30z" />
+			<path id="Tracé_18_1_" class="st0"
+				d="M73.1 18.1c-1.1-1.3-2.5-2.4-4.1-3.2-1.8-.8-3.7-1.2-5.6-1.2-2.7 0-5.4.6-7.9 1.7s-4.7 2.6-6.6 4.5c-1.9 1.9-3.4 4.1-4.5 6.5-1.1 2.4-1.7 4.9-1.7 7.5 0 1.8.3 3.6.9 5.4.5 1.7 1.4 3.2 2.5 4.6 1.1 1.3 2.6 2.4 4.1 3.2 1.8.8 3.7 1.2 5.6 1.2 2.7 0 5.4-.6 7.9-1.7 2.4-1.1 4.7-2.7 6.6-4.6 1.9-1.9 3.4-4.1 4.5-6.5 1.1-2.3 1.7-4.9 1.7-7.5 0-1.8-.3-3.6-.9-5.3-.5-1.7-1.3-3.3-2.5-4.6zm-6.7 14.4c-.4 1.3-1 2.5-1.7 3.6-.8 1.1-1.8 2-2.9 2.7-1.2.7-2.6 1.1-4 1.1-.9 0-1.7-.2-2.5-.6-.7-.4-1.2-.9-1.7-1.5-.4-.6-.8-1.4-1-2.1-.2-.8-.3-1.7-.3-2.5 0-1.3.2-2.6.6-3.9.4-1.3 1-2.5 1.7-3.6.8-1.1 1.7-2 2.9-2.7 1.2-.7 2.6-1.1 4-1.1.9 0 1.7.2 2.5.5.7.3 1.3.8 1.7 1.4.4.6.8 1.4 1 2.1.2.8.3 1.7.3 2.5 0 1.5-.2 2.8-.6 4.1z" />
+			<path id="Tracé_19_1_" class="st0"
+				d="M128.5 18.1c-1.1-1.3-2.5-2.4-4.1-3.2-1.8-.8-3.7-1.2-5.6-1.2-2.7 0-5.4.6-7.9 1.7s-4.7 2.6-6.6 4.5c-1.9 1.9-3.4 4.1-4.5 6.5-1.1 2.4-1.7 4.9-1.7 7.5 0 1.8.3 3.6.9 5.4.5 1.7 1.4 3.2 2.5 4.6 1.1 1.3 2.6 2.4 4.1 3.2 1.8.8 3.7 1.2 5.6 1.2 2.7 0 5.4-.6 7.9-1.7 2.4-1.1 4.7-2.7 6.6-4.6 1.9-1.9 3.4-4.1 4.5-6.5 1.1-2.3 1.7-4.9 1.7-7.5 0-1.8-.3-3.6-.9-5.3-.5-1.7-1.3-3.3-2.5-4.6zm-6.7 14.4c-.4 1.3-1 2.5-1.7 3.6-.8 1.1-1.8 2-2.9 2.7-1.2.7-2.6 1.1-4 1.1-.9 0-1.7-.2-2.5-.6-.7-.4-1.2-.9-1.7-1.5-.4-.6-.8-1.4-1-2.1-.2-.8-.3-1.7-.3-2.5 0-1.3.2-2.6.6-3.9.4-1.3 1-2.5 1.7-3.6.8-1.1 1.7-2 2.9-2.7 1.2-.7 2.6-1.1 4-1.1.9 0 1.7.2 2.5.5.7.3 1.3.8 1.7 1.4.4.6.8 1.4 1 2.1.2.8.3 1.7.3 2.5 0 1.5-.2 2.8-.6 4.1z" />
+			<path id="Tracé_20_1_" class="st0"
+				d="M10.4 0L8.7 8.3H87L84.1 22l-5.6 26.3H88l2.9-13.7 5.6-26.3h40l1.8-8.3H10.4z" />
+		</g>
+	</g>
+	<g id="Groupe_328" transform="translate(-4655.176 3039.814)">
+		<g id="Groupe_327">
+			<g id="Groupe_326">
+				<path id="Tracé_80"
+					d="M4693.4-2967.4c.2-.4.8-1.2 1.6-2.3l.1-.2c.1-.2.2-.3.3-.5l.1-.2c.1-.1.2-.3.3-.5l.1-.2c.6-1 1.3-2 2.1-3.2l.1-.1c.2-.4.5-.7.7-1.1l.4-.6.3-.4c.1-.1.1-.2.2-.3.3-.5.6-.9.9-1.4.1-.1.2-.3.2-.4.3-.5.6-1 .9-1.6.1-.1.1-.2.2-.3 5.1-8.6 10.6-19.3 10.6-24.9v-.1-.3c-.2-10.4-8.7-18.7-19.1-18.7-10.6 0-19.1 8.6-19.1 19.1 0 0 0 0 0 0 0 10.6 19.1 38.4 19.1 38.4v-.2h0z"
+					fill="none" stroke="#3f8cc6" stroke-width="2.728" stroke-miterlimit="10" />
+			</g>
+			<path id="Tracé_81" class="st0"
+				d="M4699.2-2976.4l-.1.1-.4.6c-.2.4-.5.7-.7 1.1l-.1.1c-.8 1.2-1.4 2.3-2.1 3.2l-.1.2c-.1.2-.2.3-.3.5l-.1.2c-.1.2-.2.3-.3.5l-.1.2c-.8 1.2-1.3 2-1.6 2.3v.1l-.1.2s-19.1-27.9-19.1-38.4c0-10.6 8.6-19.1 19.1-19.1 10.4 0 18.9 8.3 19.1 18.7v.4c0 4.9-4.1 13.6-8.6 21.4 8.8 2 17.9 2.2 26.8.6v-28.2c0-4.7-3.3-10.5-7.3-12.8L4700-3038c-4.6-2.4-10.1-2.4-14.8 0l-23 13.5c-2.9 1.7-5.3 5.2-6.5 8.7v-.1c-.5 1.3-.7 2.7-.7 4.1V-2984.3c0 .5 0 1 .1 1.5 1-.6 10.9-6.9 22.8-7l4.8 8.7s-8.9-.6-15.3 1.9c-3.1 1.2-6 2.6-8.8 4.4 1 1.3 2.2 2.4 3.6 3.3l23 13.5c4.6 2.4 10.1 2.4 14.8 0l23.2-13.5c1.2-.7 2.2-1.6 3.1-2.6-2 .2-12.6 1.5-27.1-2.3z" />
+		</g>
+		<circle id="Ellipse_28" class="st0" cx="4692.9" cy="-3004.8" r="10.6" />
+	</g>
+</svg>

src/content/projects/tcgdex/index.md

@@ -1,5 +1,6 @@
 ---
-title: "TCGdex : Explorez l'univers Pokémon JCC, une carte à la fois."
+title: "TCGdex, Explorez l'univers Pokémon JCC, une carte à la fois."
+description: TCGdex, l'API du Pokémon JCC (Jeux de Cartes à Collectionner), est une ressource inestimable pour les amateurs du célèbre jeu de cartes Pokémon. Explorez ses possibilités, et embarquez pour un voyage inoubliable dans l'univers Pokémon.
 link:
   href: https://tcgdex.fr
 image: ./og.png

src/layouts/Article.astro

@@ -1,8 +1,7 @@
 ---
 import Layout, { type Props as BaseProps } from './Layout.astro'
-import Header from 'components/global/Header.astro'
-import Footer from 'components/global/Footer.astro'
 import ButtonLink from 'components/global/ButtonLink.astro'
+import Button from 'components/global/Button.astro'
 import Breadcrumb from 'components/global/Breadcrumb.astro'
 
 export interface Props extends BaseProps {
@@ -12,6 +11,7 @@ export interface Props extends BaseProps {
 		text?: string
 		target?: string
 	}
+	disabled?: string
 	breadcrumb: Array<{
 		text: string
 		href?: string

src/layouts/Base.astro

@@ -1,27 +1,13 @@
 ---
-import Favicon from '../components/Favicon/Favicon.astro'
+import Head, { type Props as HeadProps } from './Head.astro'
-import IconSVG from '../assets/layouts/Base/favicon.svg'
-import IconPNG from '../assets/layouts/Base/favicon.png'
-import '@fontsource-variable/lexend'
 
-export interface Props {
+export interface Props extends HeadProps {}
-	title: string
-}
-
-const { title } = Astro.props;
 ---
 
 <!DOCTYPE html>
-<html lang="en">
+<html lang="fr" prefix="og: https://ogp.me/ns#">
 	<head>
-		<meta charset="UTF-8" />
+		<Head {...Astro.props} />
-		<meta name="description" content="Astro description">
-		<meta name="viewport" content="width=device-width" />
-		<!-- Analytics -->
-		<script defer data-domain="avior.me" src="/js/script.js"></script>
-
-		<Favicon svg={IconSVG} png={IconPNG} icoPath="/favicon.ico" />
-		<title>{title}</title>
 	</head>
 	<body class="bg-blue-50 dark:bg-slate-950 text-slate-950 dark:text-blue-50">
 		<slot />

src/layouts/Head.astro

@@ -0,0 +1,106 @@
+---
+import Favicon from '../components/Favicon/Favicon.astro'
+import IconSVG from '../assets/layouts/Base/favicon.svg'
+import IconPNG from '../assets/layouts/Base/favicon.png'
+import '@fontsource-variable/lexend'
+
+export interface Props {
+	siteName?: string
+	title?: string
+	description?: string
+	canonical?: string
+	image?: Array<typeof IconPNG>
+	twitter?: {
+		title?: string
+		card?: "summary" | "summary_large_image" | "app" | "player"
+		site?: string
+		creator?: string
+	}
+	og?: {
+		title?: string
+		type?: string
+		description?: string
+		url?: string
+	}
+}
+
+const props = Astro.props
+---
+
+<!-- Charset -->
+<meta charset="UTF-8" />
+
+<!-- Viewport -->
+<meta name="viewport" content="width=device-width" />
+
+
+<!-- Analytics -->
+<script defer data-domain="avior.me" src="/js/script.js"></script>
+
+<!-- Favicon -->
+<Favicon svg={IconSVG} png={IconPNG} icoPath="/favicon.ico" />
+
+<!-- OpenGraph Sitename -->
+{props.siteName && (
+	<meta property="og:site_name" content={props.siteName} />
+)}
+
+<!-- Title -->
+{props.title && (
+	<title>{props.title}</title>
+	// <meta property="twitter:title" content={props.twitter?.title ?? props.title} />
+)}
+
+<!-- Description -->
+{props.description && (
+	<meta name="description" content={props.description} />
+)}
+
+<!-- Canonical -->
+{(typeof props.canonical === 'string' || typeof props.canonical == 'undefined') && (
+	<link rel="canonical" href={props.canonical ?? Astro.url.href} />
+)}
+
+<!-- Twitter -->
+<!-- Twitter Card -->
+<meta property="twitter:card" content={props.twitter?.card ?? 'summary'} />
+
+<!-- Twitter Site -->
+{props.twitter?.site && (
+	<meta property="twitter:site" content={props.twitter.site} />
+)}
+
+<!-- Twitter Creator -->
+{props.twitter?.creator && (
+	<meta property="twitter:creator" content={props.twitter.creator} />
+)}
+
+<!-- Twitter Title -->
+{(props.twitter?.title ?? props.title) && (
+	<meta property="twitter:title" content={props.twitter?.title ?? props.title} />
+)}
+
+<!-- OpenGraph -->
+<!-- OpenGraph Title -->
+{(props.og?.title ?? props.title) && (
+	<meta property="og:title" content={props.og?.title ?? props.title} />
+)}
+
+<!-- OpenGraph Description -->
+{(props.og?.description ?? props.description) && (
+	<meta property="og:description" content={props.og?.description ?? props.description} />
+)}
+
+<!-- OpenGraph Type -->
+<meta property="og:type" content={props.og?.type ?? 'website'} />
+
+<!-- OpenGraph URL -->
+<meta property="og:url" content={props.og?.url ?? Astro.url.href} />
+
+<!-- OpenGraph Image -->
+{props.image?.map((img) => (
+	<meta property="og:image" content={img.src} />
+	<meta property="og:image:type" content={`image/${img.format}`} />
+	<meta property="og:image:width" content={img.width.toString()} />
+	<meta property="og:image:height" content={img.height.toString()} />
+))}

src/pages/index.astro

@@ -1,24 +1,60 @@
 ---
-import Layout from '../layouts/Layout.astro'
 import { getCollection } from 'astro:content'
-import Breadcrumb from 'components/global/Breadcrumb.astro'
 import { Image } from 'astro:assets'
+import Layout from 'layouts/Layout.astro'
 
 const projects = await getCollection('projects')
+const clients = await Promise.all((await getCollection('clients')).map(async (it) => ({...it, obj: await it.render()})))
 ---
 
 <Layout title="Avior.me - Developpement de solutions selon vos besoins">
-	<div class="container">
+	<main class="container">
-		<Breadcrumb items={[{ text: 'Accueil', href: '/' }, { text: 'Projets' }]} />
+
-		<main class="grid grid-cols-3 gap-4">
+		<div class="flex justify-center items-center h-64">
+			<h1 class="text-4xl font-bold">Développement de solutions selon vos besoins</h1>
+		</div>
+		<h2 class="text-center md:text-left text-2xl font-semibold mb-4">Projets</h2>
+		<div class="md:grid grid-cols-3 gap-4">
 			{projects.map((it) => (
-				<a href={`/projets/${it.slug}`} class="flex flex-col gap-4">
+				<a href={`/projets/${it.slug}`} class="flex flex-col gap-4 mb-6 md:mb-0">
 					{it.data.image && (
 						<Image src={it.data.image} alt="" />
 					)}
 					<p>{it.data.title}</p>
 				</a>
 			))}
-		</main>
 		</div>
+		<h2 class="text-center md:text-left text-2xl font-semibold my-8">Clients</h2>
+		<div class="flex flex-col gap-4">
+			<div class="grid grid-cols-2 items-center">
+				<div></div>
+				<div class="prose dark:prose-invert max-w-none">
+					<p class="font-semibold">Tâches :</p>
+				</div>
+			</div>
+			{clients.map((client, index) => {
+				const { Content } = client.obj
+				client.data.logo
+				return (
+					<>
+						{index > 0 && (
+							<div class="hidden md:block w-10/12 mx-auto h-0.5 bg-gray-300 dark:bg-gray-700"></div>
+						)}
+						<div class="mt-6 md:mt-0 md:grid grid-cols-2 items-center">
+							<a href={client.data.site} target="_blank" rel="noreferrer nofollow" class="flex flex-col gap-4">
+								{client.data.logo && (
+									<Image class:list={{'mx-auto': true, 'md:mx-0': true, 'dark:invert': client.data.logo.invert}} src={client.data.logo.src} height={48} alt="" />
+								) || (
+									<div>{client.data.title}</div>
+								)}
+							</a>
+							<div class="prose dark:prose-invert max-w-none">
+								<Content />
+							</div>
+						</div>
+					</>
+				)
+			})}
+		</div>
+	</main>
 </Layout>

src/pages/projets/[project].astro

@@ -6,15 +6,15 @@ export const prerender = true
 // 1. Generate a new path for every collection entry
 export async function getStaticPaths() {
 	const blogEntries = await getCollection('projects');
-  return blogEntries.map(entry => ({
+	return blogEntries.map((entry) => ({
 		params: { project: entry.slug }, props: { entry },
-  }));
+	}))
 }
 // 2. For your template, you can get the entry directly from the prop
 const { entry } = Astro.props;
 const { Content } = await entry.render();
 ---
-<Article title={entry.data.title} link={entry.data.link} breadcrumb={[{text: 'Accueil', href: '/'}, {text: 'Projets', href: '/projets'}, {text: entry.data.title}]}>
+<Article title={entry.data.title} image={[entry.data.image]} description={entry.data.description} link={entry.data.link} breadcrumb={[{text: 'Accueil', href: '/'}, {text: 'Projets', href: '/projets'}, {text: entry.data.title}]}>
 	<h1>{entry.data.title}</h1>
 	<p class="flex justify-end font-lights my-0">
 		<span>Sortie initial le {entry.data.created.toLocaleDateString('fr')}</span>

tailwind.config.cjs

@@ -12,14 +12,7 @@ module.exports = {
 				lg: '4rem',
 				xl: '5rem',
 				'2xl': '6rem',
-			},
+			}
-			// screens: {
-			// 	sm: '640px',
-			// 	md: '700px',
-			// 	lg: '1024px',
-			// 	xl: '1280px',
-			// 	'2xl': '1536px',
-			// }
 		},
 		fontFamily: {
 			fontFamily: {