style: improve editor block spacing for better readability

- Add 1rem bottom margin to paragraphs
- Increase heading margins and add contextual spacing
- Add proper spacing for lists and list items
- Ensure code blocks have consistent bottom margin
- Add line-height of 1.6 for better paragraph readability

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Justin Edmund 2025-06-26 10:07:54 -04:00
parent 9da64583ba
commit 8845baf402

View file

@ -7,6 +7,17 @@
margin-top: 0; margin-top: 0;
} }
/* Paragraph spacing */
.tiptap p {
margin-top: 0;
margin-bottom: 1rem;
line-height: 1.6;
}
.tiptap p:last-child {
margin-bottom: 0;
}
/* For Placeholder */ /* For Placeholder */
.tiptap .is-empty::before { .tiptap .is-empty::before {
pointer-events: none; pointer-events: none;
@ -24,16 +35,27 @@
.tiptap h5, .tiptap h5,
.tiptap h6 { .tiptap h6 {
line-height: 1.2; line-height: 1.2;
margin-top: 1rem; margin-top: 1.5rem;
margin-bottom: 0.75rem;
text-wrap: pretty; text-wrap: pretty;
} }
.tiptap h1, .tiptap h1,
.tiptap h2 { .tiptap h2 {
margin-top: 1rem; margin-top: 2rem;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
/* Reduce top margin for headings that immediately follow other elements */
.tiptap p + h1,
.tiptap p + h2,
.tiptap p + h3,
.tiptap p + h4,
.tiptap p + h5,
.tiptap p + h6 {
margin-top: 1.5rem;
}
.tiptap h1 { .tiptap h1 {
font-size: 2rem; font-size: 2rem;
} }
@ -66,6 +88,10 @@
margin: 0; margin: 0;
} }
.tiptap blockquote p:not(:last-child) {
margin-bottom: 0.5rem;
}
/* Horizontal Rule */ /* Horizontal Rule */
.tiptap hr { .tiptap hr {
border: none; border: none;
@ -85,10 +111,27 @@
/* List Styling */ /* List Styling */
.tiptap ul,
.tiptap ol {
margin-top: 0;
margin-bottom: 1rem;
padding-left: 1.5rem;
}
.tiptap ul li,
.tiptap ol li {
margin-bottom: 0.25rem;
}
.tiptap ul li p, .tiptap ul li p,
.tiptap ol li p { .tiptap ol li p {
margin-top: 0.25em; margin-top: 0;
margin-bottom: 0.25em; margin-bottom: 0.25rem;
}
.tiptap ul li:last-child,
.tiptap ol li:last-child {
margin-bottom: 0;
} }
/* Task List Styling */ /* Task List Styling */
@ -431,6 +474,8 @@ input[type='checkbox'] {
padding: 1.5rem; padding: 1.5rem;
position: relative; position: relative;
height: fit-content; height: fit-content;
margin-top: 0;
margin-bottom: 1rem;
} }
.code-wrapper-tile { .code-wrapper-tile {