mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-28 09:33:46 +00:00
fix(prose): keep TipTap list markers inline with their content
.prose ul/ol used list-inside, but TipTap wraps each <li>'s content in <p>. Combining position:inside with a block-level <p> dropped the content onto the next line under the marker — visible both inside the editor and on the rendered article page. Drop list-inside (default to outside) and add `.prose li > p` rules: first paragraph renders inline with the marker, subsequent paragraphs stay block to preserve multi-paragraph list items. Closes Bedolaga bug-topic #597116.
This commit is contained in:
@@ -917,17 +917,28 @@ img.twemoji {
|
||||
}
|
||||
|
||||
.prose ul {
|
||||
@apply mb-4 list-inside list-disc space-y-2 pl-2;
|
||||
@apply mb-4 list-disc space-y-2 pl-6;
|
||||
}
|
||||
|
||||
.prose ol {
|
||||
@apply mb-4 list-inside list-decimal space-y-2 pl-2;
|
||||
@apply mb-4 list-decimal space-y-2 pl-6;
|
||||
}
|
||||
|
||||
.prose li {
|
||||
@apply text-dark-300;
|
||||
}
|
||||
|
||||
/* TipTap wraps list-item content in <p>. Without these resets, the marker
|
||||
stays on its line and the <p> drops to the next line, breaking lists
|
||||
in the editor and on the rendered article page (Telegram bug #597116). */
|
||||
.prose li > p {
|
||||
@apply mb-0 inline;
|
||||
}
|
||||
|
||||
.prose li > p + p {
|
||||
@apply mt-2 block;
|
||||
}
|
||||
|
||||
.prose li::marker {
|
||||
@apply text-accent-400;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user