2.2.0

Changes:

• NEW: Style prop manager (edit styles per breakpoint and remove - alt + click)
• NEW: Style app (preview all applied styles to element)
• NEW: Left side dock (Box model, Structure panel dev)
• NEW: Mini apps (live server, style app icons shortcuts)
• NEW: Resizable panels
• NEW: CodeMirror dual support (aka Oxygen v4.7 ready)
• NEW: Right click on advanced icon (reset advanced)
• NEW: Custom CSS panel advanced icon shortcut
• NEW: Expand/collapse Blockpad icon
• Compatibility with dock: Box model, Blockpad, context menu
• Compatibility: Fancy border radius pasting collision with unit-autodetection
• Tweak: Structure panel active node line indication
• Tweak: Sync structure with canvas
• Tweak: Elements fire emoji placeholder replaced
• Tweak: Recoda units added Auto option
• Fix: Box model empty values when expanded and clicked on border or size
• Fix: CLI Bugs
• Performance: Reduced watchers count by 22%

• NEW: Style Inspector
• NEW: Codesense for Blockpad
• NEW Tweak: Safari scrollbars
• NEW: Command-line position (top, bottom)
• NEW: Shortcuts hints support for QWERTY, AZERTY
• Fix: Command-line change id, change content
• Fix: Safari icon missing
• Fix: Command-line elements add, heading does not resize according to new tag
• Fix: Command-line: Safari backdrop

Please remove any old 2.X version before installing!

• FIX: CLI sibling adding error
• FIX: Copy ID to clipboard
• FIX: Box model -> padding indications stays on canvas

• NEW: Root font size auto-detection for px to rem conversion
• NEW: Box Model Unit Picker with new unit options (dvw, dvh, ch)
• NEW: Exit to links Pages, Posts, templates, media
• Polish: Box mode detached indication not working!
• Fix: Blockpad drag over Site canvas (iframe) buggy
• Polish: Advanced icons - back to old position in order same as in advanced tab

• POLISH: Plugin core files overhaul
• NEW: Shortcuts hints option added
• NEW: Structure child node spacing control
• Polish: User preference now creates new table and removes old one for potential compatibility improvement with older versions
• Polish: Blockpad code block editor new UX, always on when code block active, added option drag to vertical resize
• Polish/Fix: Box Model 0rem displays as empty ("-") value
• Polish: Dev Structure panel popup theme polish
• Polish: Dev Structure panel removed text for template import, expand, collapse, text is now visible as tooltip
• Polish: Dev Structure added tooltip to indicate double click to edit
• Polish: Box Model reset current, opposite (click + Shift), all (click + Alt)
• Polish: Elements Filter - added some padding to the left for nodes
• Polish: General icon management inside plugin, fixed overflow issues in some components
• Polish: Add elements shortcut (Shift+A) now focus search field

• New: Developer edition structure panel
• Fix: Right-click menu position
• Fix: Custom CSS window shown when selector is locked
• Fix: Elements manager icon overflow
• Polish: Removed notice "No User preference found in database"

• New: Actions -> Quick elements add
• Polish: Page Manger
• Editor tweak: Flexbox inset primary controls organized in one row
• Polish: Hide Box model when selector is locked
• Fix: Site SVG icons wrong size in Editor preview

• NEW: Page manager (search pages, templates, reusables) and switch from Editor
• NEW: Actions (CLI) moved from v1 to v2
• NEW: Live Server moved from v1 to v2
• NEW: Accessibility preferences (adjust interface font-size, icon size, tooltip size, code editor font-size)
• NEW: Preference Save Button
• Fix: Code colorpicker shortcut breaks editor look
• Fix: Left panel cut-off few px to bottom

Introduces first public version of Recoda Workspace 2.0 rewrite.

Box Model

Workspace brings some unseen features for a designers inside WordPress. Vast majority of the effort went inside building Box Model which can take CSS variables, convert px to rem, handles even CSS functions.

Color tools

Recoda 2.0.1 brings unseen color tools inside Oxygen Builder. Our new colorpicker components supports HSL color, and gives you even chance to use it inside code editor.

Another part of color tools is contrast ratio checker. It will calculate foreground - background contrast ratio, and if active element is text it will hint you WCAG level (Fail, AA, AAA).

If you are using global color, now when you want pick foreground color you will get suggestion about which global color pass or fail WCAG criteria.

Other features inside Recoda Workspace 2.0.1:

• Elements manager (filter)
• JavaScript popup code editor
• Blockpad code block editor (3 pane view)
• Draggable custom CSS window
• Adjustable advanced icons bar
• Currently editing
• Canvas controls
• X-mode
• Grid guides (customizable per breakpoint)
• Right click menu
• Codesense (autocomplete)
• Class switcher
• Code editor font size
• Default paragraph tag
• Default heading tag
• Default paragraph tag
• Attributes popup panel
• Quickflow actions
• Shortcuts with cheatsheet

Revolution starts here:
https://www.youtube.com/watch?v=recoda