From 7128e7fef72b3e7e43c8319748bcdd1d8964693d Mon Sep 17 00:00:00 2001
From: Nathan Vasse <nathan.vasse@gmail.com>
Date: Fri, 1 Sep 2023 11:29:55 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84(react)=20using=20correct=20DataGri?=
 =?UTF-8?q?d=20header=20class?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Previously the headers of the DataGrid were not aligned with the
correct title class.
---
 .changeset/small-peaches-change.md               |  5 +++++
 packages/react/src/components/DataGrid/index.tsx | 11 +++++++----
 2 files changed, 12 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/small-peaches-change.md

diff --git a/.changeset/small-peaches-change.md b/.changeset/small-peaches-change.md
new file mode 100644
index 0000000..163fdae
--- /dev/null
+++ b/.changeset/small-peaches-change.md
@@ -0,0 +1,5 @@
+---
+"@openfun/cunningham-react": patch
+---
+
+using correct fs- class for DataGrid headers
diff --git a/packages/react/src/components/DataGrid/index.tsx b/packages/react/src/components/DataGrid/index.tsx
index 04882a3..e1fa33c 100644
--- a/packages/react/src/components/DataGrid/index.tsx
+++ b/packages/react/src/components/DataGrid/index.tsx
@@ -168,10 +168,13 @@ export const DataGrid = <T extends Row>({
                           <th key={header.id} colSpan={header.colSpan}>
                             {header.isPlaceholder ? null : (
                               <div
-                                className={classNames("c__datagrid__header", {
-                                  "c__datagrid__header--sortable":
-                                    header.column.getCanSort(),
-                                })}
+                                className={classNames(
+                                  "c__datagrid__header fs-h5",
+                                  {
+                                    "c__datagrid__header--sortable":
+                                      header.column.getCanSort(),
+                                  },
+                                )}
                                 {...(header.column.getCanSort()
                                   ? {
                                       role: "button",