davidl/tolaria
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: improve editor code blocks

Browse Source
This commit is contained in:
lucaronin
2026-05-12 18:21:26 +02:00
parent c0b0a02ce6
commit 5215754ffa
8 changed files with 332 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/components/EditorTheme.css
View File

@@ -488,6 +488,10 @@
background-color: var(--editor-code-block-background) !important;
border: 1px solid var(--editor-code-block-border);
color: var(--editor-code-block-text) !important;
column-gap: 12px;
display: grid;
grid-template-columns: max-content minmax(0, 1fr);
overflow-x: hidden;
position: relative;
}
@@ -510,8 +514,34 @@
color: var(--editor-code-block-text);
}
.editor__blocknote-container .bn-block-content[data-content-type="codeBlock"]::before {
border-right: 1px solid color-mix(in srgb, var(--editor-code-block-language) 28%, transparent);
color: var(--editor-code-block-language);
content: attr(data-line-numbers);
font: inherit;
grid-column: 1;
grid-row: 2;
line-height: inherit;
min-width: 2ch;
padding-right: 10px;
pointer-events: none;
text-align: right;
user-select: none;
white-space: pre;
}
.editor__blocknote-container .bn-block-content[data-content-type="codeBlock"] > pre {
color: inherit;
grid-column: 2;
grid-row: 2;
min-width: 0;
overflow-x: hidden;
white-space: pre-wrap;
}
.editor__blocknote-container .bn-block-content[data-content-type="codeBlock"] > div {
grid-column: 1 / -1;
grid-row: 1;
}
.editor__blocknote-container .bn-block-content[data-content-type="codeBlock"] > div > select {
@@ -525,13 +555,21 @@
.editor__blocknote-container .bn-block-content[data-content-type="codeBlock"] pre code {
background-color: transparent;
color: inherit;
padding: 0;
border-radius: 0;
color: inherit;
display: block;
grid-column: 2;
min-width: 0;
overflow-wrap: anywhere;
padding: 0;
white-space: pre-wrap;
}
.editor__blocknote-container .bn-block-content[data-content-type="codeBlock"] pre code .shiki {
background-color: transparent !important;
color: inherit !important;
overflow-wrap: anywhere;
white-space: pre-wrap !important;
}
/* --- Blockquote --- */