feat: add marianne font

betagouv · Nov 13, 2024 · a356145 · a356145
1 parent 26fcfe5
commit a356145
Show file tree

Hide file tree

Showing 15 changed files with 208 additions and 36 deletions.
diff --git a/package.json b/package.json
@@ -35,6 +35,9 @@
   "pnpm": {
     "patchedDependencies": {
       "[email protected]": "patches/[email protected]"
+    },
+    "overrides": {
+      "restructure": "3.0.0"
     }
   }
 }
diff --git a/packages/backend/public/fonts/Marianne-Bold.ttf b/packages/backend/public/fonts/Marianne-Bold.ttf
diff --git a/packages/backend/public/fonts/Marianne-BoldItalic.ttf b/packages/backend/public/fonts/Marianne-BoldItalic.ttf
diff --git a/packages/backend/public/fonts/Marianne-Regular.ttf b/packages/backend/public/fonts/Marianne-Regular.ttf
diff --git a/packages/backend/public/fonts/Marianne-RegularItalic.ttf b/packages/backend/public/fonts/Marianne-RegularItalic.ttf
diff --git a/packages/backend/src/index.ts b/packages/backend/src/index.ts
@@ -5,6 +5,9 @@ import { ENV } from "./envVars";
 import { generateOpenApi, initFastify } from "./router";
 import { makeDebug } from "./features/debug";
 import { initClauseV2 } from "./tmp";
+import { initFonts } from "@cr-vif/pdf";
+
+initFonts("./public/");
 
 const debug = makeDebug("index");
 

diff --git a/packages/frontend/package.json b/packages/frontend/package.json
@@ -33,7 +33,7 @@
     "@mui/material": "^5.15.15",
     "@prisma/client": "^4.8.1",
     "@rawwee/react-pdf-html": "^1.0.2",
-    "@react-pdf/renderer": "^3.4.2",
+    "@react-pdf/renderer": "^4.0.0",
     "@tanstack/react-query": "^4.18.0",
     "@tanstack/react-router": "^1.22.2",
     "@tanstack/router-devtools": "^1.22.2",

diff --git a/packages/frontend/public/fonts/Marianne-Bold.ttf b/packages/frontend/public/fonts/Marianne-Bold.ttf
diff --git a/packages/frontend/public/fonts/Marianne-BoldItalic.ttf b/packages/frontend/public/fonts/Marianne-BoldItalic.ttf
diff --git a/packages/frontend/public/fonts/Marianne-Regular.ttf b/packages/frontend/public/fonts/Marianne-Regular.ttf
diff --git a/packages/frontend/public/fonts/Marianne-RegularItalic.ttf b/packages/frontend/public/fonts/Marianne-RegularItalic.ttf
diff --git a/packages/frontend/src/contexts/AuthContext.tsx b/packages/frontend/src/contexts/AuthContext.tsx
@@ -86,6 +86,7 @@ export const AuthProvider = ({ children }: PropsWithChildren) => {
           user_id: data!.user!.id,
         },
       });
+      await electric.db.picture_lines.sync({});
 
       return true;
     },

diff --git a/packages/frontend/src/main.tsx b/packages/frontend/src/main.tsx
@@ -8,12 +8,14 @@ import { Link } from "@tanstack/react-router";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ErrorBoundary } from "react-error-boundary";
 import { registerSW } from "virtual:pwa-register";
+import { initFonts } from "@cr-vif/pdf";
 
 if ("serviceWorker" in navigator) {
   registerSW({});
 }
 
 startReactDsfr({ defaultColorScheme: "system", Link: Link });
+initFonts();
 
 const queryClient = new QueryClient({
   defaultOptions: {

diff --git a/packages/pdf/src/report.tsx b/packages/pdf/src/report.tsx
@@ -4,6 +4,30 @@ import React from "react";
 import type { Udap, Report, Service_instructeurs, Clause_v2, Pictures } from "@cr-vif/electric-client/frontend";
 import { Buffer } from "buffer";
 
+export const initFonts = (folder: string = "") => {
+  Font.register({
+    family: "Marianne",
+    fonts: [
+      {
+        src: `${folder}/fonts/Marianne-Regular.ttf`,
+        fontStyle: "normal",
+        fontWeight: "normal",
+      },
+      { src: `${folder}/fonts/Marianne-Bold.ttf`, fontStyle: "normal", fontWeight: "bold" },
+      {
+        src: `${folder}/fonts/Marianne-RegularItalic.ttf`,
+        fontStyle: "italic",
+        fontWeight: "normal",
+      },
+      {
+        src: `${folder}/fonts/Marianne-BoldItalic.ttf`,
+        fontStyle: "italic",
+        fontWeight: "bold",
+      },
+    ],
+  });
+};
+
 Font.registerHyphenationCallback((word) => {
   return [word];
 });
@@ -33,31 +57,15 @@ export const ReportPDFDocument = ({ udap, htmlString, images, pictures }: Report
           <body>
             <style>
               body {
-                font-family: Helvetica;
+                font-family: Marianne;
               }
 
               strong {
-                font-family: Helvetica-Bold;
+                font-weight: bold;
               }
-
+              
               em {
-                font-family: Helvetica-Oblique;
-              }
-
-              strong em span {
-                font-family: Helvetica-BoldOblique;
-              }
-
-              em strong span {
-                font-family: Helvetica-BoldOblique;
-              }
-
-              strong em {
-                font-family: Helvetica-BoldOblique;
-              }
-
-              em strong {
-                font-family: Helvetica-BoldOblique;
+                font-style: italic;
               }
 
               .marianne-img {
@@ -103,7 +111,7 @@ export const ReportPDFDocument = ({ udap, htmlString, images, pictures }: Report
               .right-texts > div {
                 text-align: right;
                 font-size: 14px;
-                font-family: Helvetica-Bold;
+                font-weight: bold;
               }
 
               .meeting-date {