Jakub Zych
086e485215
- preservationExtensions: raw HTML cards for unmodelled blocks (shown as text), figure with figcaption, the YouTube embed placeholder node, span marks, a global attribute map (never on* handlers), tables without colgroup or min-width, inline images without base64 - serializeDocument keeps the original bytes of every top-level block still equal to the loaded one, so editing one paragraph changes only that paragraph; tables serialize with thead and bare cell text - Links accept only http, https, mailto and relative URLs (isPolicyUrl, the rule both sanitizer policies apply) and gain no target, rel or class - Toolbar with headings, marks, lists, links, blockquote, table editing, images, embeds, raw HTML block, undo and redo; en and pl labels - Images from the picker or a drop go out as summer-upload and are inserted on summer-upload-result with alt text and an optional caption - editor-corpus.json: the editor own output, rebuilt and checked by corpus.test.ts (UPDATE_CORPUS=1 rewrites it) for the policy tests - README Blog Editor section
2 lines
7.3 KiB
CSS
2 lines
7.3 KiB
CSS
golem15-journal-blogeditor{display:block;border:1px solid var(--c-border);border-radius:12px;background:var(--c-surface);color:var(--c-text)}golem15-journal-blogeditor[invalid]{border-color:var(--c-danger)}golem15-journal-blogeditor .blogeditor__bar{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;border-bottom:1px solid var(--c-border);background:var(--c-subtle);border-radius:12px 12px 0 0}golem15-journal-blogeditor .blogeditor__tools{display:flex;flex-wrap:wrap;gap:4px 12px}golem15-journal-blogeditor .blogeditor__group{display:flex;flex-wrap:wrap;gap:2px}golem15-journal-blogeditor .blogeditor__tabs{display:flex;gap:2px;margin-left:auto}golem15-journal-blogeditor .blogeditor__form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px 8px;padding:8px;border-bottom:1px solid var(--c-border);background:var(--c-surface)}golem15-journal-blogeditor .blogeditor__form label{display:flex;flex:1 1 220px;flex-direction:column;gap:2px;font-size:12px;color:var(--c-muted)}golem15-journal-blogeditor .blogeditor__form input{box-sizing:border-box;width:100%;padding:5px 8px;border:1px solid var(--c-border-strong);border-radius:6px;background:var(--c-bg);color:var(--c-text);font:inherit;font-size:13px}golem15-journal-blogeditor .blogeditor__form input::placeholder{color:var(--c-placeholder)}golem15-journal-blogeditor .blogeditor__form input:focus{outline:2px solid var(--c-ring);outline-offset:-1px}golem15-journal-blogeditor .blogeditor__form button[data-action=apply],golem15-journal-blogeditor .blogeditor__form button[data-action=insert]{background:var(--c-primary);color:var(--c-on-primary)}golem15-journal-blogeditor .blogeditor__error{flex-basis:100%;margin:0;font-size:12px;color:var(--c-danger)}golem15-journal-blogeditor .blogeditor__error:empty,golem15-journal-blogeditor .blogeditor__status:empty{display:none}golem15-journal-blogeditor .blogeditor__status{margin:0;padding:6px 12px;border-top:1px solid var(--c-border);font-size:12px;color:var(--c-muted)}golem15-journal-blogeditor button{font:inherit;font-size:13px;line-height:1.2;padding:4px 8px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--c-text);cursor:pointer}golem15-journal-blogeditor button:hover{background:var(--c-hover)}golem15-journal-blogeditor button:focus-visible{outline:2px solid var(--c-ring);outline-offset:1px}golem15-journal-blogeditor button[aria-selected=true],golem15-journal-blogeditor button[aria-pressed=true]{background:var(--c-sel)}golem15-journal-blogeditor button:disabled{color:var(--c-muted);cursor:default}golem15-journal-blogeditor .blogeditor__content{min-height:240px;max-height:70vh;overflow:auto}golem15-journal-blogeditor .blogeditor__source{display:block;box-sizing:border-box;width:100%;min-height:320px;padding:12px 16px;border:0;border-radius:0 0 12px 12px;background:var(--c-bg);color:var(--c-text);font-family:DM Mono,ui-monospace,monospace;font-size:13px;line-height:1.5;resize:vertical}golem15-journal-blogeditor .blogeditor__source:focus{outline:2px solid var(--c-ring);outline-offset:-2px}golem15-journal-blogeditor [hidden]{display:none!important}golem15-journal-blogeditor .ProseMirror{position:relative;word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;font-feature-settings:"liga" 0;min-height:240px;padding:12px 16px;outline:none;font-size:15px;line-height:1.6}golem15-journal-blogeditor .ProseMirror[contenteditable=false]{color:var(--c-muted)}golem15-journal-blogeditor .ProseMirror [contenteditable=false]{white-space:normal}golem15-journal-blogeditor .ProseMirror [contenteditable=false] [contenteditable=true]{white-space:pre-wrap}golem15-journal-blogeditor .ProseMirror pre{white-space:pre-wrap}golem15-journal-blogeditor img.ProseMirror-separator{display:inline!important;border:none!important;margin:0!important;width:0!important;height:0!important}golem15-journal-blogeditor .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute;margin:0}golem15-journal-blogeditor .ProseMirror-gapcursor:after{content:"";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid var(--c-text);animation:blogeditor-cursor-blink 1.1s steps(2,start) infinite}@keyframes blogeditor-cursor-blink{to{visibility:hidden}}golem15-journal-blogeditor .ProseMirror-hideselection *::selection{background:transparent}golem15-journal-blogeditor .ProseMirror-hideselection *{caret-color:transparent}golem15-journal-blogeditor .ProseMirror-focused .ProseMirror-gapcursor{display:block}golem15-journal-blogeditor .ProseMirror>*+*{margin-top:.75em}golem15-journal-blogeditor .ProseMirror :where(p,ul,ol,blockquote,table,figure,pre){margin-bottom:0}golem15-journal-blogeditor .ProseMirror h2{font-size:1.5em;font-weight:600;margin:1em 0 .5em}golem15-journal-blogeditor .ProseMirror h3{font-size:1.25em;font-weight:600;margin:1em 0 .5em}golem15-journal-blogeditor .ProseMirror h4{font-size:1.1em;font-weight:600;margin:1em 0 .5em}golem15-journal-blogeditor .ProseMirror ul{list-style:disc;padding-left:1.5em}golem15-journal-blogeditor .ProseMirror ol{list-style:decimal;padding-left:1.5em}golem15-journal-blogeditor .ProseMirror a{color:var(--c-primary);text-decoration:underline}golem15-journal-blogeditor .ProseMirror blockquote{margin-left:0;padding-left:1em;border-left:3px solid var(--c-border-strong);color:var(--c-muted)}golem15-journal-blogeditor .ProseMirror code{padding:0 4px;border-radius:4px;background:var(--c-subtle);font-family:DM Mono,ui-monospace,monospace;font-size:.9em}golem15-journal-blogeditor .ProseMirror pre{padding:8px 12px;border-radius:8px;background:var(--c-subtle)}golem15-journal-blogeditor .ProseMirror pre code{padding:0;background:transparent}golem15-journal-blogeditor .ProseMirror hr{border:0;border-top:1px solid var(--c-border-strong)}golem15-journal-blogeditor .ProseMirror img{max-width:100%;height:auto}golem15-journal-blogeditor .ProseMirror table{border-collapse:collapse;width:100%}golem15-journal-blogeditor .ProseMirror :where(td,th){border:1px solid var(--c-border-strong);padding:4px 8px;vertical-align:top}golem15-journal-blogeditor .ProseMirror th{background:var(--c-subtle);font-weight:600;text-align:left}golem15-journal-blogeditor .ProseMirror :where(td,th)>p{margin:0}golem15-journal-blogeditor .ProseMirror .selectedCell{background:var(--c-sel)}golem15-journal-blogeditor .ProseMirror figure{margin-left:0;margin-right:0}golem15-journal-blogeditor .ProseMirror figcaption{margin-top:4px;font-size:13px;color:var(--c-muted)}golem15-journal-blogeditor .blogeditor__raw,golem15-journal-blogeditor .blogeditor__embed{border:1px dashed var(--c-border-strong);border-radius:8px;background:var(--c-subtle);color:var(--c-muted);font-size:13px}golem15-journal-blogeditor .blogeditor__embed{padding:16px;text-align:center}golem15-journal-blogeditor .blogeditor__card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 4px 4px 10px;border-bottom:1px dashed var(--c-border)}golem15-journal-blogeditor .blogeditor__raw-source{max-height:160px;margin:0;padding:8px 10px;overflow:auto;background:transparent;font-family:DM Mono,ui-monospace,monospace;font-size:12px;white-space:pre-wrap}golem15-journal-blogeditor .ProseMirror-selectednode.blogeditor__raw,golem15-journal-blogeditor .ProseMirror-selectednode.blogeditor__embed,golem15-journal-blogeditor .ProseMirror img.ProseMirror-selectednode{outline:2px solid var(--c-ring)}
|