Avoid layout shift when changing of reports filter

betagouv · Dec 17, 2024 · ec83a46 · ec83a46
1 parent 6f0e5d4
commit ec83a46
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/apps/webapp/src/layout/PageLayout.tsx b/apps/webapp/src/layout/PageLayout.tsx
@@ -4,10 +4,10 @@ import { AppHeader } from "./AppHeader";
 
 export const PageLayout: React.FC<PropsWithChildren> = ({ children }) => {
   return (
-    <div className="flex flex-col h-screen">
+    <div className="flex flex-col h-screen w-full">
       <AppHeader />
-      <main className="flex-grow flex place-items-center">
-        <div className={"flex-grow"}>{children}</div>
+      <main className="flex-grow flex">
+        <div className="flex-grow">{children}</div>
       </main>
       <AppFooter />
     </div>

diff --git a/apps/webapp/src/reports/adapters/primary/components/ReportList/ReportListPage.tsx b/apps/webapp/src/reports/adapters/primary/components/ReportList/ReportListPage.tsx
@@ -1,9 +1,9 @@
-import { fr } from "@codegouvfr/react-dsfr";
+import { cx } from "@codegouvfr/react-dsfr/fr/cx";
 import ReportList from "./ReportList";
 
 export const ReportListPage = () => {
   return (
-    <div className={fr.cx("fr-px-15w", "fr-py-15w")}>
+    <div className={cx("fr-px-15w", "fr-py-15w")}>
       <ReportList />
     </div>
   );