diff --git a/apps/web/components/common/rich-text-editor.css b/apps/web/components/common/rich-text-editor.css index 110de520..4623ad93 100644 --- a/apps/web/components/common/rich-text-editor.css +++ b/apps/web/components/common/rich-text-editor.css @@ -18,20 +18,21 @@ height: 0; } -/* Headings — aligned with old Markdown minimal mode */ +/* Headings — compact hierarchy for issue tracker context */ .rich-text-editor h1 { - font-size: 1rem; + font-size: 1.125rem; font-weight: 700; - margin-top: 1.25rem; - margin-bottom: 0.75rem; + margin-top: 1.5rem; + margin-bottom: 0.5rem; line-height: 1.4; + letter-spacing: -0.01em; } .rich-text-editor h2 { font-size: 1rem; font-weight: 600; - margin-top: 1rem; - margin-bottom: 0.75rem; + margin-top: 1.5rem; + margin-bottom: 0.5rem; line-height: 1.4; } @@ -75,7 +76,7 @@ } .rich-text-editor li { - margin: 0.125rem 0; + margin: 0.25rem 0; line-height: 1.625; } @@ -87,6 +88,34 @@ color: var(--muted-foreground); } +/* Remove paragraph margins inside list items (Tiptap wraps li content in
) */ +.rich-text-editor li > p { + margin: 0; +} + +.rich-text-editor li > p + p { + margin-top: 0.25rem; +} + +/* Nested lists — bullet style progression and tighter spacing */ +.rich-text-editor ul ul { + list-style-type: circle; + margin: 0.25rem 0; +} + +.rich-text-editor ul ul ul { + list-style-type: square; +} + +.rich-text-editor ol ol { + list-style-type: lower-alpha; + margin: 0.25rem 0; +} + +.rich-text-editor ol ol ol { + list-style-type: lower-roman; +} + /* Inline code */ .rich-text-editor code { font-family: var(--font-mono, ui-monospace, monospace); @@ -95,7 +124,7 @@ border: 1px solid color-mix(in srgb, var(--foreground) 5%, transparent); color: color-mix(in srgb, var(--foreground) 75%, transparent); padding: 0.125rem 0.375rem; - border-radius: calc(var(--radius) * 0.6); + border-radius: var(--radius-sm); } /* Code blocks */ @@ -230,6 +259,25 @@ font-style: italic; } +.rich-text-editor blockquote p { + margin-top: 0.25rem; + margin-bottom: 0.25rem; +} + +.rich-text-editor blockquote > *:first-child { + margin-top: 0; +} + +.rich-text-editor blockquote > *:last-child { + margin-bottom: 0; +} + +.rich-text-editor blockquote blockquote { + margin-top: 0.25rem; + margin-bottom: 0.25rem; + border-left-color: color-mix(in srgb, var(--muted-foreground) 15%, transparent); +} + /* Horizontal rules */ .rich-text-editor hr { border: none;