🐛(frontend) fix long titles in table of content

Long title in table of content is were not displayed correctly.
This commit fixes the issue.

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
 

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');
 

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