- placeholder: hide the body ::before hint once the editor body has focus, so
clicking an empty document no longer leaves the hint sitting under the caret
- code block: edit as a bare <pre> and convert to pre > code on save. TinyMCE
treats pre > code as an inline boundary, so typing there leaked into the
following paragraph; Enlighter also splits lines on newlines, so the <br>
the editor produced rendered the whole block as one overflowing line
- code block: align the iframe rendering with Enlighter (Menlo 13px/1.4,
#f8f9fa, 8px radius, 12px 17px padding, nowrap) in both content CSS files
- code block: move the caret into the block after insertion
- hidden block: hang the block-delete overlay on documentElement instead of
body. data-mce-bogus only skips serialization, so the extra body child made
mceInsertContent wipe the document and drop the first hidden block
- settings: give the toggle a real 44x24 hit area, align it to the top of the
row, add aria-labels and show the disabled state
- styles: drop the duplicated @use/@import of publish-drawer and block-tools
- media insert/embed now serialize through serializeBlocks so code blocks are
never stored in editor form
Toolbar
- New ToolMenu renders menus through a portal on body, so they are no longer
clipped by the horizontally scrolling toolbar and no longer fall back to a
native <select>. Triggers reuse .jio-creator__tool-btn geometry, fixing the
heading button's mismatched height/size/position.
- Heading / list / align / quote / hidden-content are all dropdowns.
- Lists: unordered + ordered via InsertOrderedList/InsertUnorderedList.
The TOC button is removed (it also used the wrong icon).
- Adds left / center / right alignment.
- Adds hidden content: comment / login / VIP / paid, wired to the existing
[reply], [jio_hide mode="login"], [vip] and [payshow] shortcodes.
Editor content
- Quote blocks now match the live article: full .quote_q structure, four
colour variables, and an SVG-mask quote mark that does not depend on the
Font Awesome font being present inside the iframe.
- Block math is centred on a transparent background instead of a full-width
grey bar.
- Code blocks are plain <pre><code>, identical to the article page; language
and theme selection is gone and EnlighterJS handles highlighting globally.
The classic submit editor's code modal follows the same shape.
- Hidden content reuses the .tinymce-hide structure and shows a readable label
while keeping the shortcode text in the DOM for saving.
Block deletion
- Two-step delete, WPS style: the first click only selects and highlights the
block, the second click removes it. Clicking elsewhere or Esc cancels.
Contracts updated and extended; 884 widget-system tests pass.