withastro · dreyfus92 · Jan 14, 2024 · Jan 4, 2024 · Jan 4, 2024 · Jan 4, 2024
diff --git a/src/content/docs/fr/core-concepts/astro-pages.mdx b/src/content/docs/fr/core-concepts/astro-pages.mdx
@@ -4,6 +4,7 @@ description: Une introduction aux pages Astro
 i18nReady: true
 ---
 
+import ReadMore from '~/components/ReadMore.astro';
 import Since from '~/components/Since.astro'
 
 Les **pages** sont des fichiers qui se trouvent dans le sous-répertoire `src/pages/` de votre projet Astro. Ils sont responsables de la gestion du routage, du chargement des données et de la mise en page globale de chaque page de votre site Web.
@@ -23,7 +24,7 @@ Astro utilise une stratégie de routage appelée **routage basé sur les fichier
 
 Un seul fichier peut également générer plusieurs pages en utilisant le [routage dynamique](/fr/core-concepts/routing/#routes-dynamiques). Cela vous permet de créer des pages même si votre contenu se trouve en dehors du répertoire spécial `/pages/`, par exemple dans une [collection de contenu](/fr/guides/content-collections/) ou un [CMS](/fr/guides/cms/).
 
-📚 En savoir plus sur [Le routage dans Astro](/fr/core-concepts/routing/).
+<ReadMore>En savoir plus sur [Le routage dans Astro](/fr/core-concepts/routing/).</ReadMore>
 
 ### Lien entre les pages
 
@@ -66,7 +67,7 @@ import MySiteLayout from '../layouts/MySiteLayout.astro';
 </MySiteLayout>
 ```
 
-📚 En savoir plus sur les [composants de mise en page](/fr/core-concepts/layouts/) dans Astro.
+<ReadMore>En savoir plus sur les [composants de mise en page](/fr/core-concepts/layouts/) dans Astro.</ReadMore>
 
 ## Pages Markdown/MDX
 
@@ -88,7 +89,7 @@ Voici ma page, écrite en **Markdown**.
 
 ```
 
-📚 En savoir plus sur le [Markdown](/fr/guides/markdown-content/) dans Astro.
+<ReadMore>En savoir plus sur le [Markdown](/fr/guides/markdown-content/) dans Astro.</ReadMore>
 
 ## Pages HTML
 

diff --git a/src/content/docs/fr/core-concepts/framework-components.mdx b/src/content/docs/fr/core-concepts/framework-components.mdx
@@ -4,6 +4,7 @@ description: 'Apprennez à utiliser React, Svelte, etc.. avec Astro'
 
 ---
 import IntegrationsNav from '~/components/IntegrationsNav.astro'
+import ReadMore from '~/components/ReadMore.astro'
 
 Construisez votre site Astro sans sacrifier votre Framework favori. Créez des iles Astro](/fr/concepts/islands/) avec le framework UI de votre choix.
 
@@ -79,7 +80,7 @@ La plupart des modèles d'accessibilité spécifiques au framework devraient fon
 
 Il y a plusieurs directives d'hydratation disponibles pour les composants de Framework : `client:load`, `client:idle`, `client:visible`, `client:media={QUERY}` et `client:only={FRAMEWORK}`.
 
-📚 Allez voir notre [page de référence des directives](/fr/reference/directives-reference/#directives-client) pour une description complète de ces directives, et de leur utilisation.
+<ReadMore>Allez voir notre [page de référence des directives](/fr/reference/directives-reference/#directives-client) pour une description complète de ces directives, et de leur utilisation.</ReadMore>
 
 ## Mixer des Frameworks
 
@@ -233,7 +234,7 @@ Si vous essayez d'hydrater un composant Astro avec un modificateur `client:`, vo
 
 Les [composants Astro](/fr/core-concepts/astro-components/) sont des composants de modélisation HTML uniquement, sans exécution côté client. Cependant, vous pouvez utiliser une balise `<script>` dans votre modèle de composant Astro pour envoyer du JavaScript au navigateur qui s'exécute dans la portée globale.
 
-📚 Apprenez-en plus sur [les `<script>` client-side dans les composants Astro](/fr/guides/client-side-scripts/)
+<ReadMore>Apprenez-en plus sur [les `<script>` client-side dans les composants Astro](/fr/guides/client-side-scripts/)</ReadMore>
 
 [mdn-io]: https://developer.mozilla.org/fr/docs/Web/API/Intersection_Observer_API
 [mdn-ric]: https://developer.mozilla.org/fr/docs/Web/API/Window/requestIdleCallback

diff --git a/src/content/docs/fr/core-concepts/layouts.mdx b/src/content/docs/fr/core-concepts/layouts.mdx
@@ -4,6 +4,8 @@ description: Une introduction aux composants Layouts, un type de composant Astro
 i18nReady: true
 ---
 
+import ReadMore from '~/components/ReadMore.astro'
+
 Les **Layouts** (ou "mise-en-pages" en français) sont des [composants Astro](/fr/core-concepts/astro-components/) utilisés pour fournir une structure d'interface utilisateur réutilisable, comme un modèle de page.
 
 Par convention, nous utilisons le terme "mise en page" pour les composants Astro qui fournissent des éléments d'interface utilisateur commune à toutes les pages, tels que les en-têtes, les barres de navigation et les pieds de page. Un composant de mise en page typique d'Astro fournit [aux pages Astro, Markdown ou MDX](/fr/core-concepts/astro-pages/) les éléments suivants :
@@ -54,7 +56,7 @@ import MySiteLayout from '../layouts/MySiteLayout.astro';
 ```
 
 
-📚 Apprenez-en plus sur [les Slots](/fr/core-concepts/astro-components/#les-emplacements-slots).
+<ReadMore>Apprenez-en plus sur [les Slots](/fr/core-concepts/astro-components/#les-emplacements-slots).</ReadMore>
 
 ## Mises en page Markdown/MDX
 
@@ -227,7 +229,7 @@ const { title, fancyJsHelper } = Astro.props;
 <!-- -->
 ```
 
-📚 Pour en savoir plus sur la prise en charge de Markdown et de MDX par Astro, consultez notre [guide Markdown/MDX](/fr/guides/markdown-content/).
+<ReadMore>Pour en savoir plus sur la prise en charge de Markdown et de MDX par Astro, consultez notre [guide Markdown/MDX](/fr/guides/markdown-content/).</ReadMore>
 
 ## Utilisation d'une mise en page unique pour les fichiers `.md`, `.mdx` et `.astro`.
 

diff --git a/src/content/docs/fr/core-concepts/routing.mdx b/src/content/docs/fr/core-concepts/routing.mdx
@@ -6,6 +6,7 @@ i18nReady: true
 import FileTree from '~/components/FileTree.astro'
 import RecipeLinks from "~/components/RecipeLinks.astro"
 import Since from '~/components/Since.astro'
+import ReadMore from '~/components/ReadMore.astro'
 
 Astro utilise un **routage basé sur les fichiers** pour générer vos URLs de construction en fonctionde la disposition des fichiers dans le répertoire `src/pages/` de votre projet. Lorsqu'un fichier est ajouté au répertoire `src/pages` de votre projet, il est automatiquement disponible en tant que route basée sur son nom de fichier.
 
@@ -83,7 +84,7 @@ Cela va générer `/en-v1/info` et `/fr-v2/info`.
 
 Les paramètres peuvent être inclus dans des parties séparées du chemin, ainsi nous pourrions utiliser `src/pages/[lang]/[version]/info.astro` avec le même `getStaticPaths` pour générer `/en/v1/info` et `/fr/v2/info`.
 
-📚 En savoir plus sur [`getStaticPaths()`](/fr/reference/api-reference/#getstaticpaths).
+<ReadMore>En savoir plus sur [`getStaticPaths()`](/fr/reference/api-reference/#getstaticpaths).</ReadMore>
 
 <RecipeLinks slugs={["fr/recipes/i18n"]} />
 

diff --git a/src/content/docs/fr/editor-setup.mdx b/src/content/docs/fr/editor-setup.mdx
@@ -20,7 +20,9 @@ Astro fonctionne avec n'importe quel éditeur decode. Cependant, VS Code est l'
 
 Pour commencer, installez l'extension [Astro VS Code](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode) dès maintenant.
 
-📚 Voir comment [configurer TypeScript](/fr/guides/typescript/) dans votre projet Astro.
+import ReadMore from '~/components/ReadMore.astro';
+
+<ReadMore>Voir comment [configurer TypeScript](/fr/guides/typescript/) dans votre projet Astro.</ReadMore>
 
 ## JetBrains IDEs
 

diff --git a/src/content/docs/fr/guides/configuring-astro.mdx b/src/content/docs/fr/guides/configuring-astro.mdx
@@ -2,10 +2,12 @@
 title: Configurer Astro
 i18nReady: true
 ---
+import ReadMore from '~/components/ReadMore.astro'
 
 Personnalisez le fonctionnement d'Astro en ajoutant un fichier `astro.config.mjs` dans votre projet. C'est un fichier commun dans les projets Astro, et tous les exemples officiels de modèles et de thèmes sont livrés avec un fichier par défaut.
 
-📚 Lisez la [doc de référence de l'API d'Astro](/fr/reference/configuration-reference/) pour une vue d'ensemble de toutes les options de configuration supportées.
+<ReadMore>Lisez la [doc de référence de l'API d'Astro](/fr/reference/configuration-reference/) pour une vue d'ensemble de toutes les options de configuration supportées.</ReadMore>
+
 ## Le Fichier de Configuration d'Astro
 
 Un fichier de configuration Astro valide exporte sa configuration en utilisant l'export `default`, en utilisant l'aide `defineConfig` recommandée :
@@ -164,4 +166,4 @@ const { SECRET_PASSWORD } = loadEnv(process.env.NODE_ENV, process.cwd(), "");
 
 ## Référence de configuration
 
-📚 Lisez la documentation de référence [sur la configuration de l'API d'Astro](/fr/reference/configuration-reference/) pour une vue d'ensemble des options de configuration supportées.
+<ReadMore>Lisez la documentation de référence [sur la configuration de l'API d'Astro](/fr/reference/configuration-reference/) pour une vue d'ensemble des options de configuration supportées.</ReadMore>
diff --git a/src/content/docs/fr/guides/deploy/cloudflare.mdx b/src/content/docs/fr/guides/deploy/cloudflare.mdx
@@ -4,6 +4,7 @@ description: Comment déployer votre site Astro sur le web en utilisant les page
 type: deploy
 i18nReady: true
 ---
+import ReadMore from '~/components/ReadMore.astro'
 
 Vous pouvez déployer votre projet Astro sur [Cloudflare Pages](https://pages.cloudflare.com/), une plateforme permettant aux développeurs frontaux de collaborer et de déployer des sites web statiques (JAMstack) et SSR.
 
@@ -60,7 +61,7 @@ Une fois vos ressources téléchargées, Wrangler vous donnera une URL de prévi
 Pour que la prévisualisation fonctionne, vous devez installer `wrangler`
 
 ```bash
-pnpm install wrangler --save-dev
+pnpm add wrangler --save-dev
 ```
 
 Il est alors possible de mettre à jour le script de prévisualisation pour exécuter `wrangler` au lieu de la commande de prévisualisation intégrée à Astro :
@@ -127,7 +128,7 @@ Les [Pages Functions](https://developers.cloudflare.com/pages/platform/functions
 
 Pour commencer, créez un répertoire `/functions` à la racine de votre projet. L'écriture de vos fichiers Functions dans ce répertoire génère automatiquement un Worker avec des fonctionnalités personnalisées aux itinéraires prédéfinis. Pour en savoir plus sur l'écriture des fonctions, consultez la [documentation Pages Functions](https://developers.cloudflare.com/pages/platform/functions/).
 
-📚 En savoir plus sur [SSR in Astro](/fr/guides/server-side-rendering/).
+<ReadMore>En savoir plus sur [SSR in Astro](/fr/guides/server-side-rendering/).</ReadMore>
 
 ## Dépannage
 

diff --git a/src/content/docs/fr/guides/deploy/deno.mdx b/src/content/docs/fr/guides/deploy/deno.mdx
@@ -4,6 +4,7 @@ description: Comment déployer votre site Astro sur le web en utilisant Deno.
 type: deploy
 i18nReady: true
 ---
+import ReadMore from '~/components/ReadMore.astro'
 
 Vous pouvez déployer un site Astro rendu côté serveur sur [Deno Deploy](https://deno.com/deploy), un système distribué qui exécute JavaScript, TypeScript et WebAssembly à la pointe de la technologie, dans le monde entier.
 
@@ -170,6 +171,6 @@ Vous pouvez alors utiliser cette commande pour construire et déployer votre sit
     ```
 
 
-📚 En savoir plus sur [SSR in Astro](/fr/guides/server-side-rendering/).
+<ReadMore>En savoir plus sur [SSR in Astro](/fr/guides/server-side-rendering/).</ReadMore>
 
 [Deno adapter]: https://github.com/denoland/deno-astro-adapter
diff --git a/src/content/docs/fr/guides/deploy/netlify.mdx b/src/content/docs/fr/guides/deploy/netlify.mdx
@@ -4,6 +4,8 @@ description: Comment déployer votre site Astro sur le web sur Netlify.
 type: deploy
 i18nReady: true
 ---
+import ReadMore from '~/components/ReadMore.astro'
+
 [Netlify](https://netlify.com) propose des services d'hébergement et de backend sans serveur (serverless) pour les applications web et les sites web statiques. Tout site Astro peut être hébergé sur Netlify !
 
 Ce guide comprend des instructions pour le déploiement sur Netlify via l'interface utilisateur du site Web ou le CLI de Netlify.
@@ -52,6 +54,7 @@ Si vous préférez installer l'adaptateur manuellement, suivez les deux étapes
       // astro.config.mjs
       import { defineConfig } from 'astro/config';
       import netlify from '@astrojs/netlify/functions';
+
       export default defineConfig({
         output: 'server',
         adapter: netlify({
@@ -95,13 +98,14 @@ Si votre projet est stocké sur GitHub, GitLab, BitBucket, ou Azure DevOps, vous
   publish = "dist"
 ```
 
-📚 Plus d'informations sur le ["Déploiement d'un dépôt Astro Git existant" (EN)](https://www.netlify.com/blog/how-to-deploy-astro/#deploy-an-existing-git-repository-to-netlify) sur le blog de Netlify
+<ReadMore>Plus d'informations sur le ["Déploiement d'un dépôt Astro Git existant" (EN)](https://www.netlify.com/blog/how-to-deploy-astro/#deploy-an-existing-git-repository-to-netlify) sur le blog de Netlify</ReadMore>
 
 
 ### Déploiement CLI
 
 Vous pouvez également créer un nouveau site sur Netlify et relier votre dépôt Git en installant et en utilisant le [CLI de Netlify](https://cli.netlify.com/).
 
+
 1. Installez le CLI de Netlify globalement : 
 
     ```bash
@@ -118,7 +122,7 @@ Vous pouvez également créer un nouveau site sur Netlify et relier votre dépô
 
    Le CLI ajoutera une clé de déploiement au dépôt, ce qui signifie que votre site sera automatiquement reconstruit sur Netlify chaque fois que vous ferez `git push`.
 
-📚 Plus de détails de Netlify sur [Déployer un site Astro à l'aide de la CLI Netlify (EN)](https://www.netlify.com/blog/how-to-deploy-astro/#link-your-astro-project-and-deploy-using-the-netlify-cli)
+<ReadMore>Plus de détails de Netlify sur [Déployer un site Astro à l'aide de la CLI Netlify (EN)](https://www.netlify.com/blog/how-to-deploy-astro/#link-your-astro-project-and-deploy-using-the-netlify-cli)</ReadMore>
 
 ### Définir une version de Node.js
 

diff --git a/src/content/docs/fr/guides/deploy/vercel.mdx b/src/content/docs/fr/guides/deploy/vercel.mdx
@@ -4,6 +4,7 @@ description: Comment déployer votre site Astro vers le web sur Vercel.
 type: deploy
 i18nReady: true
 ---
+import ReadMore from '~/components/ReadMore.astro'
 
 Vous pouvez utiliser [Vercel](http://vercel.com/) pour déployer un site Astro vers son global edge network (réseau périphérique mondial) sans aucune configuration.
 
@@ -60,7 +61,7 @@ Vous pouvez déployer Vercel via l'interface utilisateur du site web ou en utili
 
 Une fois que votre projet a été importé et déployé, tous les pushes ultérieures vers les bracnhes généreront des [Déploiements de prévisualisation (EN)](https://vercel.com/docs/concepts/deployments/environments#preview), et toutes les modifications apportées à la branche de production (communément appelée "main") donneront lieu à un [Déploiement de production (EN)](https://vercel.com/docs/concepts/deployments/environments#production).
 
-📚 Apprenez-en plus sur l'[Intégration Git de Vercel (EN)](https://vercel.com/docs/concepts/git).
+<ReadMore>Apprenez-en plus sur l'[Intégration Git de Vercel (EN)](https://vercel.com/docs/concepts/git).</ReadMore>
 
 
 ### Déploiement via ILC
@@ -81,7 +82,7 @@ Une fois que votre projet a été importé et déployé, tous les pushes ultéri
 
 Vous pouvez utiliser `vercel.json` pour surcharger le comportement par défaut de Vercel et pour configurer des paramètres supplémentaires. Par exemple, vous pouvez souhaiter attacher des en-têtes aux réponses HTTP de vos déploiements. 
 
-📚 En savoir plus sur la [configuration Vercel (EN)](https://vercel.com/docs/project-configuration).
+<ReadMore>En savoir plus sur la [configuration Vercel (EN)](https://vercel.com/docs/project-configuration).</ReadMore>
 
 ### Mise à jour vers Astro 2.0
 

diff --git a/src/content/docs/fr/guides/imports.mdx b/src/content/docs/fr/guides/imports.mdx
@@ -4,6 +4,7 @@ description: Apprendre comment importer différents types de contenu avec Astro.
 i18nReady: true
 ---
 import RecipeLinks from "~/components/RecipeLinks.astro";
+import ReadMore from '~/components/ReadMore.astro'
 
 Astro supporte la plupart des ressources statiques sans aucune configuration requise. Vous pouvez utiliser la directive `import` n'importe où dans votre projet JavaScript (y compris votre *frontmatter* d'Astro) et Astro inclura une copie construite et optimisée de cette ressource statique dans votre build final. `@import` est également prise en charge dans les balises CSS et `<style>`.
 
@@ -61,7 +62,8 @@ import MyComponent from "./MyComponent"; // MyComponent.tsx
 
 :::
 
-📚 Lire la suite [Prise en charge de TypeScript dans Astro](/fr/guides/typescript/).
+<ReadMore>Lire la suite [Prise en charge de TypeScript dans Astro](/fr/guides/typescript/).</ReadMore>
+
 
 ## JSX / TSX
 

diff --git a/src/content/docs/fr/guides/markdown-content.mdx b/src/content/docs/fr/guides/markdown-content.mdx
@@ -7,6 +7,7 @@ i18nReady: true
 import Since from '~/components/Since.astro'
 import FileTree from '~/components/FileTree.astro'
 import RecipeLinks from "~/components/RecipeLinks.astro";
+import ReadMore from '~/components/ReadMore.astro'
 
 Le [Markdown](https://daringfireball.net/projects/markdown/) est couramment utilisé pour créer des contenus à forte teneur en texte, tels que des articles de blog et de la documentation. Astro inclut une prise en charge intégrée des fichiers Markdown standard qui peuvent également inclure un [frontmatter YAML](https://dev.to/paulasantamaria/introduction-to-yaml-125f) pour définir des métadonnées personnalisées telles qu'un titre, une description et des balises.
 
@@ -58,7 +59,7 @@ Ce n'est probablement pas suffisamment stylisé, mais le Markdown supporte :
 - Et plus encore !
 ```
 
-📚 En savoir plus sur le [routage basé sur les fichiers d'Astro](/fr/core-concepts/routing/) ou les options pour créer des [routes dynamiques](/fr/core-concepts/routing/#routes-dynamiques).
+<ReadMore>En savoir plus sur le [routage basé sur les fichiers d'Astro](/fr/core-concepts/routing/) ou les options pour créer des [routes dynamiques](/fr/core-concepts/routing/#routes-dynamiques).</ReadMore>
 
 ## Fonctionnalités de Markdown
 
@@ -99,7 +100,7 @@ const {frontmatter} = Astro.props;
 
 Vous pouvez également [styliser votre Markdown](/fr/guides/styling/#markdown-styling) dans votre composant de mise en page.
 
-📚 En savoir plus sur les [mises en page Markdown](/fr/core-concepts/layouts/#mises-en-page-markdownmdx).
+<ReadMore>En savoir plus sur les [mises en page Markdown](/fr/core-concepts/layouts/#mises-en-page-markdownmdx).</ReadMore>
 
 
 ### Identifiants d'En-tête

diff --git a/src/content/docs/fr/install/auto.mdx b/src/content/docs/fr/install/auto.mdx
@@ -133,8 +133,22 @@ Bravo ! Vous êtes maintenant prêt à développer avec Astro ! 🥳
 
 Voici quelques sujets que nous vous recommandons d'explorer ensuite. Vous pouvez les lire dans n'importe quel ordre. Vous pouvez même quitter notre documentation pour un moment et aller jouer dans votre nouveau codebase de projet Astro, revenant ici chaque fois que vous rencontrez des problèmes ou avez des questions.
 
-📚 **Ajoutez un framework:** Apprenez à étendre Astro avec un support pour React, Svelte, Tailwind et plus encore en utilisant `npx astro add` dans notre [guide d'intégrations](/fr/guides/integrations-guide/).
-
-📚 **Déployez votre site:** Apprenez à construire et déployer un projet Astro sur le web dans notre [guide de déploiement](/fr/guides/deploy/).
-
-📚 **Comprenez votre projet:** En savoir plus sur la structure de projet d'Astro dans notre [guide de la structure de projet](/fr/core-concepts/project-structure/).
+import { CardGrid, LinkCard } from '@astrojs/starlight/components';
+
+<CardGrid>
+  <LinkCard
+    title="Comprenez votre base de code"
+    description="Pour en savoir plus sur la structure des fichiers d'Astro, consultez notre guide sur la structure du projet."
+    href="/fr/core-concepts/project-structure/"
+  />
+  <LinkCard
+    title="Ajouter un framework"
+    description="Étendez Astro avec le support de React, Svelte, Tailwind et plus encore dans notre guide des intégrations."
+    href="/fr/guides/integrations-guide/"
+  />
+  <LinkCard
+    title="Déployez votre site"
+    description="Apprenez à construire et à déployer un projet Astro sur le web dans notre guide Déploiement."
+    href="/fr/guides/deploy/"
+  />
+</CardGrid>