fix headings

apps/client/src/features/editor/readonly-page-editor.tsx

@@ -66,12 +66,14 @@ export default function ReadonlyPageEditor({
 
   return (
     <>
+      <div className="page-title">
         <EditorProvider
           editable={false}
           immediatelyRender={true}
           extensions={titleExtensions}
           content={title}
         ></EditorProvider>
+      </div>
 
       <EditorProvider
         editable={false}

apps/client/src/features/editor/styles/core.css

@@ -52,7 +52,34 @@
 
   h1,
   h2,
-  h3,
+  h3 {
+    letter-spacing: -0.01em;
+    line-height: 1.2;
+    font-weight: 600;
+    margin-bottom: 0;
+  }
+
+  h1 strong,
+  h2 strong,
+  h3 strong {
+    font-weight: 600;
+  }
+
+  h1 {
+    font-size: 1.875rem;
+    margin-top: 1.875rem;
+  }
+
+  h2 {
+    font-size: 1.5rem;
+    margin-top: 1.5rem;
+  }
+
+  h3 {
+    font-size: 1.25rem;
+    margin-top: 1.25rem;
+  }
+
   h4,
   h5,
   h6 {
@@ -243,3 +270,10 @@
 .actionIconGroup {
   background: var(--mantine-color-body);
 }
+
+.page-title .ProseMirror h1 {
+  font-size: 2.5rem;
+  font-weight: 700;
+  margin-top: 0;
+  margin-bottom: 0.75em;
+}

apps/client/src/features/editor/title-editor.tsx

@@ -244,6 +244,7 @@ export function TitleEditor({
   }
 
   return (
+    <div className="page-title">
       <EditorContent
         editor={titleEditor}
         onKeyDown={(event) => {
@@ -254,5 +255,6 @@ export function TitleEditor({
           handleTitleKeyDown(event);
         }}
       />
+    </div>
   );
 }