UI : traduction d'éléments jugés suffisamment stables

src/components/DocsFooter.tsx

@@ -80,7 +80,7 @@ function FooterLink({
         />
         <span>
           <span className="block no-underline text-sm tracking-wide text-secondary dark:text-secondary-dark uppercase font-bold group-focus:text-link dark:group-focus:text-link-dark group-focus:text-opacity-100">
-            {type}
+            {type === 'Next' ? 'Suivant' : 'Précédent'}
           </span>
           <span className="block text-lg group-hover:underline">{title}</span>
         </span>

src/components/Layout/Feedback.tsx

@@ -63,11 +63,11 @@ function SendFeedback({onSubmit}: {onSubmit: () => void}) {
   return (
     <div className="max-w-xs w-80 lg:w-auto py-3 shadow-lg rounded-lg m-4 bg-wash dark:bg-gray-95 px-4 flex">
       <p className="w-full font-bold text-primary dark:text-primary-dark text-lg mr-4">
-        {isSubmitted ? 'Thank you for your feedback!' : 'Is this page useful?'}
+        {isSubmitted ? 'Merci pour votre retour !' : 'Cette page est utile ?'}
       </p>
       {!isSubmitted && (
         <button
-          aria-label="Yes"
+          aria-label="Oui"
           className="bg-secondary-button dark:bg-secondary-button-dark rounded-lg text-primary dark:text-primary-dark px-3 mr-2"
           onClick={() => {
             setIsSubmitted(true);
@@ -79,7 +79,7 @@ function SendFeedback({onSubmit}: {onSubmit: () => void}) {
       )}
       {!isSubmitted && (
         <button
-          aria-label="No"
+          aria-label="Non"
           className="bg-secondary-button dark:bg-secondary-button-dark rounded-lg text-primary dark:text-primary-dark px-3"
           onClick={() => {
             setIsSubmitted(true);

src/components/Layout/Footer.tsx

@@ -286,7 +286,7 @@ export function Footer() {
         </div>
         <div className="flex flex-col">
           <FooterLink href="/learn" isHeader={true}>
-            Learn React
+            Apprendre React
           </FooterLink>
           <FooterLink href="/learn/">Quick Start</FooterLink>
           <FooterLink href="/learn/installation">Installation</FooterLink>
@@ -301,14 +301,14 @@ export function Footer() {
         </div>
         <div className="flex flex-col">
           <FooterLink href="/reference/react" isHeader={true}>
-            API Reference
+            Référence de l’API
           </FooterLink>
           <FooterLink href="/reference/react">React APIs</FooterLink>
           <FooterLink href="/reference/react-dom">React DOM APIs</FooterLink>
         </div>
         <div className="md:col-start-2 xl:col-start-4 flex flex-col">
           <FooterLink href="/community" isHeader={true}>
-            Community
+            Communauté
           </FooterLink>
           <FooterLink href="https://github.com/facebook/react/blob/main/CODE_OF_CONDUCT.md">
             Code of Conduct
@@ -322,7 +322,7 @@ export function Footer() {
           </FooterLink>
         </div>
         <div className="flex flex-col">
-          <FooterLink isHeader={true}>More</FooterLink>
+          <FooterLink isHeader={true}>Plus</FooterLink>
           <FooterLink href="/blog">Blog</FooterLink>
           <FooterLink href="https://reactnative.dev/">React Native</FooterLink>
           <FooterLink href="https://opensource.facebook.com/legal/privacy">

src/components/Layout/Page.tsx

@@ -153,7 +153,7 @@ export function Page({children, toc, routeTree, meta, section}: PageProps) {
                     <>
                       <div className="flex flex-col items-center m-4 p-4">
                         <p className="font-bold text-primary dark:text-primary-dark text-lg mb-4">
-                          How do you like these docs?
+                          Comment trouvez-vous ces docs ?
                         </p>
                         <div>
                           <ButtonLink
@@ -162,7 +162,7 @@ export function Page({children, toc, routeTree, meta, section}: PageProps) {
                             type="primary"
                             size="md"
                             target="_blank">
-                            Take our survey!
+                            Dites-nous tout !
                             <IconNavArrow
                               displayDirection="right"
                               className="inline ml-1"

src/components/MDX/MDXComponents.tsx

@@ -173,7 +173,7 @@ function YouWillLearn({
   children: any;
   isChapter?: boolean;
 }) {
-  let title = isChapter ? 'In this chapter' : 'You will learn';
+  let title = isChapter ? 'Dans ce chapitre' : 'Vous allez apprendre';
   return <SimpleCallout title={title}>{children}</SimpleCallout>;
 }
 

src/components/MDX/Sandpack/CustomPreset.tsx

@@ -119,7 +119,7 @@ const SandboxShell = memo(function SandboxShell({
                   className="inline mr-1.5 text-xl"
                   displayDirection={isExpanded ? 'up' : 'down'}
                 />
-                {isExpanded ? 'Show less' : 'Show more'}
+                {isExpanded ? 'Voir moins' : 'Voir plus'}
               </span>
             </button>
           )}

src/components/MDX/Sandpack/DownloadButton.tsx

@@ -98,9 +98,9 @@ ${css}
     <button
       className="text-sm text-primary dark:text-primary-dark inline-flex items-center hover:text-link duration-100 ease-in transition mx-1"
       onClick={downloadHTML}
-      title="Download Sandbox"
+      title="Télécharger la sandbox"
       type="button">
-      <IconDownload className="inline mr-1" /> Download
+      <IconDownload className="inline mr-1" /> Télécharger
     </button>
   );
 }

src/components/MDX/Sandpack/OpenInCodeSandboxButton.tsx

@@ -9,7 +9,7 @@ export const OpenInCodeSandboxButton = () => {
   return (
     <UnstyledOpenInCodeSandboxButton
       className="text-sm text-primary dark:text-primary-dark inline-flex items-center hover:text-link duration-100 ease-in transition mx-1 ml-2 md:ml-1"
-      title="Open in CodeSandbox">
+      title="Ouvrir dans CodeSandbox">
       <IconNewPage
         className="inline ml-1 mr-1 relative top-[1px]"
         width="1em"

src/components/MDX/Sandpack/ResetButton.tsx

@@ -13,9 +13,9 @@ export function ResetButton({onReset}: ResetButtonProps) {
     <button
       className="text-sm text-primary dark:text-primary-dark inline-flex items-center hover:text-link duration-100 ease-in transition mx-1"
       onClick={onReset}
-      title="Reset Sandbox"
+      title="Réinitialiser la sandbox"
       type="button">
-      <IconRestart className="inline ml-1 mr-1 relative" /> Reset
+      <IconRestart className="inline ml-1 mr-1 relative" /> Réinitialiser
     </button>
   );
 }