marketing-shibata50/multica
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #354 from multica-ai/refactor/editor-typography-polish

Browse source 
refactor(editor): polish typography for better visual hierarchy
This commit is contained in:
Naiyuan Qing 2026-04-02 20:14:08 +08:00 • committed by GitHub
commit 35b379d688
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 56 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

64
apps/web/components/common/rich-text-editor.css
View file

@ -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 <p>) */
.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;