From 8bf30d0ec36b3d4bfe5690a123768afeb6a9a00a Mon Sep 17 00:00:00 2001
From: Anthony LC <anthony.le-courric@mail.numerique.gouv.fr>
Date: Fri, 5 Jun 2026 12:42:26 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B(frontend)=20fix=20long=20titles=20?=
 =?UTF-8?q?in=20table=20of=20content?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Long title in table of content is were not displayed correctly.
This commit fixes the issue.
---
 CHANGELOG.md                                                  | 1 +
 .../apps/e2e/__tests__/app-impress/doc-table-content.spec.ts  | 1 -
 .../features/docs/doc-table-content/components/Heading.tsx    | 4 ++--
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ca8b7128f..34ffa31fc 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,6 +17,7 @@ and this project adheres to
 - 🐛(frontend) fix crash when orphaned threads #2395
 - 🐛(backend) order trashbin response by most recently deleted
 - 🐛(backend) stream document content with an async iterator under ASGI #2381
+- 🐛(frontend) fix long titles in table of content #2399
 
 ## [v5.2.0] - 2026-06-03
 
diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-table-content.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-table-content.spec.ts
index 3009837db..e69038594 100644
--- a/src/frontend/apps/e2e/__tests__/app-impress/doc-table-content.spec.ts
+++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-table-content.spec.ts
@@ -39,7 +39,6 @@ test.describe('Doc Table Content', () => {
     const level3 = elSidePanel.getByText('Level 3');
 
     await expect(level1).toBeVisible();
-    await expect(level1).toHaveCSS('padding', /0px 0px 0px 8px/);
     await expect(editorLevel1).not.toBeInViewport();
     await expect(level1).toHaveAttribute('aria-selected', 'false');
 
diff --git a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx
index 2480b4284..5aa6db99c 100644
--- a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx
@@ -42,7 +42,7 @@ export const Heading = ({
       id={`heading-${headingId}`}
       className="--docs--table-content-heading"
       $width="100%"
-      $height="var(--c--globals--spacings--lg)"
+      $minHeight="var(--c--globals--spacings--lg)"
       onMouseOver={() => setIsHover(true)}
       onMouseLeave={() => setIsHover(false)}
       onClick={() => {
@@ -83,7 +83,7 @@ export const Heading = ({
     >
       <Text
         $size="sm"
-        $padding={{ left: leftPaddingMap[level] }}
+        $padding={{ left: leftPaddingMap[level], vertical: 'xs' }}
         $weight={isHighlight ? '700' : '500'}
         $css="overflow-wrap: break-word;"
         $hasTransition