mirror of
https://github.com/stablyai/orca
synced 2026-04-21 14:17:16 +00:00
fix(editor): improve rich markdown table readability (#827)
* fix(editor): improve rich markdown table readability Show borders and subtle striping for rich markdown tables so cell boundaries stay legible in the formatted editor. * fix(editor): keep rich table headers sentence case Keep the new table styling readable without forcing header text to uppercase. * style(rich-md): fix table striping against Tiptap tbody-only DOM Switch zebra striping to nth-child(odd) so the shaded row doesn't sit directly under the header, and drop the compounding th font-size. --------- Co-authored-by: Jinjing <6427696+AmethystLiang@users.noreply.github.com>
This commit is contained in:
parent
897ba4a3dc
commit
b8b773e892
1 changed files with 28 additions and 0 deletions
|
|
@ -280,6 +280,34 @@
|
|||
background: color-mix(in srgb, var(--foreground) 2%, transparent);
|
||||
}
|
||||
|
||||
.rich-markdown-editor table {
|
||||
width: 100%;
|
||||
margin: 1em 0;
|
||||
border-collapse: collapse;
|
||||
font-size: 0.95em;
|
||||
}
|
||||
|
||||
.rich-markdown-editor th,
|
||||
.rich-markdown-editor td {
|
||||
padding: 8px 14px;
|
||||
border: 1px solid var(--border);
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.rich-markdown-editor th {
|
||||
font-weight: 600;
|
||||
background: color-mix(in srgb, var(--foreground) 4%, transparent);
|
||||
}
|
||||
|
||||
/* Why: Tiptap tables render as <tbody> only with the first <tr> containing
|
||||
<th> cells. Striping odd rows (1, 3, 5) skips the header row — which has
|
||||
no <td> — and starts alternation from the second data row, avoiding a
|
||||
shaded band directly adjacent to the header. */
|
||||
.rich-markdown-editor tr:nth-child(odd) td {
|
||||
background: color-mix(in srgb, var(--foreground) 1.5%, transparent);
|
||||
}
|
||||
|
||||
.rich-markdown-editor code {
|
||||
padding: 0.2em 0.4em;
|
||||
border-radius: 5px;
|
||||
|
|
|
|||
Loading…
Reference in a new issue