Add quote indicator and distinct callout styling for Note/Tip/Warning/Important
- Description editor: blockquotes get a left accent line and muted color so it's clear when typing in "quote mode" (matches the existing active Quote toolbar button highlight). - Editor block cards: each text block's left border is colored by its level (info/success/warn/error) so Note/Tip/Warning/Important are distinguishable at a glance. - PDF/HTML/DOCX exports: callouts now get a level-specific accent color and tinted background/shading (blue/green/amber/red), instead of all looking identical except for the label text. Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
This commit is contained in:
+13
-2
@@ -11,6 +11,15 @@ const LIST_INDENT = 14;
|
||||
const QUOTE_INDENT = 10;
|
||||
const HEADING_BUMP = { h1: 2.5, h2: 2, h3: 1.5, h4: 1 };
|
||||
|
||||
// Callout styling per text-block level, matching the colors used in the
|
||||
// HTML/editor UI so a "Tip" looks distinct from a "Warning" at a glance.
|
||||
const LEVEL_STYLE = {
|
||||
info: { accent: [59, 130, 246], tint: [239, 246, 255] }, // blue — Note
|
||||
success: { accent: [16, 185, 129], tint: [236, 253, 245] }, // green — Tip
|
||||
warn: { accent: [245, 158, 11], tint: [255, 251, 235] }, // amber — Warning
|
||||
error: { accent: [239, 68, 68], tint: [254, 242, 242] }, // red — Important
|
||||
};
|
||||
|
||||
function fontForRun(run) {
|
||||
if (run.code) return 'F3';
|
||||
if (run.bold && run.italic) return 'F5';
|
||||
@@ -258,9 +267,11 @@ function exportPdf(ast, outDir, template = {}) {
|
||||
? layoutDescription(pdf, tb.descriptionHtml, usableW - 18, 9.5)
|
||||
: { items: [], height: 0 };
|
||||
const blockH = 16 + bodyH;
|
||||
const style = LEVEL_STYLE[tb.level] || LEVEL_STYLE.info;
|
||||
ensure(blockH + 4);
|
||||
pdf.rect(M, y, 3, blockH, { fill: tpl.accentColor });
|
||||
pdf.text(label, M + 10, y + 2, { size: 9.5, font: 'F2' });
|
||||
pdf.rect(M, y, usableW, blockH, { fill: style.tint });
|
||||
pdf.rect(M, y, 3, blockH, { fill: style.accent });
|
||||
pdf.text(label, M + 10, y + 2, { size: 9.5, font: 'F2', color: style.accent });
|
||||
let by = y + 16;
|
||||
for (const item of items) {
|
||||
if (item.kind === 'hr') {
|
||||
|
||||
Reference in New Issue
Block a user