i18n(fr): add resources/themes and update resources/plugins & `gu…

…ides/css-and-tailwind` (#2919)

docs/src/content/docs/fr/guides/css-and-tailwind.mdx

@@ -7,6 +7,8 @@ import { Tabs, TabItem, Steps } from '@astrojs/starlight/components';
 
 Vous pouvez mettre en forme votre site Starlight avec du CSS personnalisé ou utiliser le module d'extension Tailwind de Starlight.
 
+Pour changer rapidement l'apparence par défaut de votre site, consultez les [thèmes communautaires](/fr/resources/themes/).
+
 ## Styles CSS personnalisés
 
 Personnalisez les styles appliqués à votre site Starlight en fournissant des fichiers CSS supplémentaires pour modifier ou étendre les styles par défaut de Starlight.

docs/src/content/docs/fr/resources/plugins.mdx

@@ -130,38 +130,6 @@ Les [modules d'extension](/fr/reference/plugins/) peuvent personnaliser la confi
 	/>
 </CardGrid>
 
-### Thèmes communautaires
-
-Un thème est un module d'extension Starlight qui modifie l'apparence visuelle d'un site avec des redéfinitions de composants, du CSS personnalisé ou d'autres nouvelles fonctionnalités.
-
-<CardGrid>
-	<LinkCard
-		href="https://github.com/HiDeoo/starlight-theme-rapide"
-		title="starlight-theme-rapide"
-		description="Thème Starlight inspiré du thème Vitesse pour Visual Studio Code."
-	/>
-	<LinkCard
-		href="https://github.com/Fevol/starlight-theme-obsidian"
-		title="starlight-theme-obsidian"
-		description="Thème Starlight inspiré par le style des sites d'Obsidian Publish."
-	/>
-	<LinkCard
-		href="https://github.com/TheOtterlord/catppuccin-starlight"
-		title="catppuccin-starlight"
-		description="Thème apaisant aux couleurs pastel pour Starlight"
-	/>
-	<LinkCard
-		href="https://github.com/louisescher/starlight-ion-theme"
-		title="starlight-ion-theme"
-		description="Un thème élégant et moderne pour Starlight."
-	/>
-	<LinkCard
-		href="https://github.com/adrian-ub/starlight-theme-black"
-		title="starlight-theme-black"
-		description="Thème Starlight inspiré par la doc de shadcn"
-	/>
-</CardGrid>
-
 ## Outils et intégrations communautaires
 
 import { CardGrid, LinkCard } from '@astrojs/starlight/components';

docs/src/content/docs/fr/resources/themes.mdx

@@ -0,0 +1,76 @@
+---
+title: Thèmes
+description: Modifiez l'apparence visuelle de votre documentation avec un thème communautaire pour Starlight
+tableOfContents: false
+sidebar:
+  order: 1
+head:
+  - tag: style
+    content: |
+      body { --sl-content-width: 66.75rem; }
+---
+
+import ThemeGrid from '~/components/theme-grid.astro';
+
+Un thème est un module d'extension Starlight qui modifie l'apparence visuelle d'un site avec du [CSS personnalisé](/fr/guides/css-and-tailwind/), des [redéfinitions de composants](/fr/guides/overriding-components/), ou d'autres nouvelles fonctionnalités.
+
+### Thèmes communautaires
+
+Installez un thème créé par la communauté pour personnaliser rapidement l'apparence de votre site.
+
+<ThemeGrid
+	labels={{
+		/** Accessible label for the theme toggle. */
+		legend: 'Aperçu',
+		/** Accessible label for the dark color scheme variant. */
+		dark: 'Sombre',
+		/** Accessible label for the light color scheme variant. */
+		light: 'Clair',
+	}}
+	themes={[
+		{
+			title: 'Starlight Rapide',
+			description:
+				'Thème Starlight inspiré du thème Vitesse pour Visual Studio Code.',
+			href: 'https://starlight-theme-rapide.vercel.app/',
+			previews: { light: 'rapide-light.png', dark: 'rapide-dark.png' },
+		},
+		{
+			title: 'Starlight Obsidian Theme',
+			description:
+				"Thème Starlight inspiré par le style des sites d'Obsidian Publish.",
+			href: 'https://fevol.github.io/starlight-theme-obsidian/',
+			previews: { light: 'obsidian-light.png', dark: 'obsidian-dark.png' },
+		},
+		{
+			title: 'Catppuccin for Starlight',
+			description: 'Thème apaisant aux couleurs pastel pour Starlight.',
+			href: 'https://catppuccin-starlight.otterlord.dev/',
+			previews: { light: 'catppuccin-light.png', dark: 'catppuccin-dark.png' },
+		},
+		{
+			title: 'Ion',
+			description: 'Un thème élégant et moderne pour Starlight.',
+			href: 'https://louisescher.github.io/starlight-ion-theme/',
+			previews: { light: 'ion-light.png', dark: 'ion-dark.png' },
+		},
+		{
+			title: 'Starlight Black',
+			description: 'Thème Starlight inspiré par la doc de shadcn.',
+			href: 'https://starlight-theme-black.vercel.app/',
+			previews: { light: 'black-light.png', dark: 'black-dark.png' },
+		},
+		{
+			title: 'Starlight Flexoki',
+			description:
+				'Un thème chaleureux et convivial basé sur la palette de couleurs Flexoki.',
+			href: 'https://delucis.github.io/starlight-theme-flexoki/',
+			previews: { light: 'flexoki-light.png', dark: 'flexoki-dark.png' },
+		},
+	]}
+/>
+
+:::tip[Ajoutez le vôtre !]
+Avez-vous construit un thème pour Starlight ?
+[Ouvrez une PR](https://github.com/withastro/starlight/blob/main/CONTRIBUTING.md#themes) ajoutant votre thème à cette page !
+:::