Fix #6: larger RTE toolbar buttons + bigger, both-axis-scrolling editor #8

Merged
whitlocktech merged 1 commits from fix/rte-editor-sizing into main 2026-06-30 18:49:24 +00:00
Showing only changes of commit 4c16040373 - Show all commits

View File

@@ -326,25 +326,38 @@ button[disabled] {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 4px;
padding: 8px 10px;
gap: 6px;
padding: 10px 12px;
border-bottom: 1px solid var(--line);
background: var(--panel-flat);
}
.rte-btn {
min-width: 30px;
height: 30px;
padding: 0 8px;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 11px;
border: 1px solid transparent;
border-radius: 6px;
border-radius: 7px;
background: transparent;
color: var(--muted);
font-family: var(--sans);
font-size: 0.85rem;
font-size: 1rem;
line-height: 1;
cursor: pointer;
transition: background 0.12s, color 0.12s, border-color 0.12s;
}
/* Icon (glyph) buttons render larger so picture/link/etc. read clearly. */
.rte-btn[title="Link"],
.rte-btn[title="Insert image"],
.rte-btn[title="Link to another wiki page"],
.rte-btn[title="Quote"],
.rte-btn[title="Divider"],
.rte-btn[title="Undo"],
.rte-btn[title="Redo"] {
font-size: 1.25rem;
}
.rte-btn:hover:not([disabled]) {
background: var(--blue);
color: var(--ink);
@@ -365,12 +378,13 @@ button[disabled] {
background: var(--line);
}
.rte-content {
padding: 14px 16px;
max-height: 460px;
overflow-y: auto;
padding: 16px 18px;
max-height: min(640px, 65vh);
/* Scroll both vertically and sideways (wide images, code blocks, tables). */
overflow: auto;
}
.rte-content .ProseMirror {
min-height: 220px;
min-height: 320px;
outline: none;
}
.rte-content .ProseMirror p.is-editor-empty:first-child::before {
@@ -384,8 +398,8 @@ button[disabled] {
.rte-linkmenu {
position: absolute;
z-index: 20;
top: 50px;
left: 10px;
top: 60px;
left: 12px;
width: min(360px, calc(100% - 20px));
padding: 10px;
border: 1px solid var(--line);