UX plugin for Oxygen Builder

There are series of buttons across the bottom of the screen:

Launch new live server instance: opens a new window with the frontend view of the current page. But why? Refresh live server instance: causes the window that was launched to refresh. But why? It's easier to refresh the window with Ctrl+R... Toggle style inspector: when clicked icon turns orange. Nothing else happens. Toggle x-ray mode: Nothing happens when clicked. Toggle grid system guide: Nothing happens when clicked. Toggle help panel: Nothing happens when clicked.

There's also some sort of command line...what is this for? Are there any instructions?

I use Hydrogen Pack to lock classes. When locked. red is used rather than green to denote they are locked. The list of used classes does not use the red "locked" colour:

When Oxy Toolbox Navigator function is on, there is an overlap. (https://user-images.githubusercontent.com/29856708/125200417-6b75c800-e2ae-11eb-9ed5-b691c3509f3b.jpg)

Could you please add condition (if OXTB Navigator is on = then add 33px top margin to

#oxygen-ui .ct-panel-elements-managers, #oxygen-ui .oxygen-global-settings, #ct-viewport-container.oxy-fullscreen-toggle { margin-top: 33px;

There's a button labelled "ADD" under the Attribute button...it has a green circle above it. When clicked, this button does nothing except change the circle to orange. Is it broken?

[ FEATURE REQUEST ]

It would be great to be able to cycle through the viewport handles using a shortcut, perhaps

SHIFT + COMMAND + ⟵ to go small SHIFT + COMMAND + ⟶ to go bigger

[ FEATURE REQUEST ]

A shortcut that we can set for entering FULL SCREEN mode would be nice. If it can't be modified, I suggest TAB or maybe SHIFT + TAB (something no one ever uses)

Issue The Zoom value reflects the width of the contents relative to the width of the viewport. When a page has a Zoom value of 64% then the content width is 64% of the viewport width. The content is not expanded to fill 100% of the viewport width.

Clicking the 'lock' expands the contents to 100% of the viewport width.

Toggling the structure panel on and off seems to increase the amount of 'dead space' between the right side of the content and the structure panel.

Expected The Zoom value reflects the width of the viewport page width relative to the width of the screen, expanding the content to fix 100% of the viewport. When a page has a Zoom value of 42%, it means that the width of the visible content has been reduced to 42% of its actual size.

Clicking the 'lock' expands the contents to the actual size (i.e. 100%) often meaning that the contents are wider than the viewport and the user is required to scroll left and right.

Testing Environment Local 6.0.0+5444 WordPress: 5.7.2 Oxygen: 3.8 No other plugins

I like to leave the Admin bar visible when in the Oxygen editor for easy access to all pages and templates and other custom links I keep in the bar. When it's visible, the 4 panels to switch views of the right sidebar and the save button are hidden.

Live Server logic works, but practice not. Why? Reload command is called before Oxygen saves so you don't see changes and you need save twice.

Solution: Set some time out before calling reload command in order that Oxygen have time to save before calling.

This feature is oriented towards dual monitor setup. Idea is that you work on one monitor in Oxygen and on other you can see fronted preview. This is sub feature of Live Server in order to work you need launch live server instance.

How it works? Canvas window and Live server window are bidirectional scroll synced. So if you scroll live server it will scroll Oxygen canvas and vice versa.

What is wsMacro? This is extension for command-line which will enable crazy things like adding multiple classes to multiple elements in really fast way. How it works?

1. You write boilerplate command like for first element: .py-1.px-2.bg-red
2. Toggle Macro mode ON
3. click in DOM tree panel on every element which should have applied that command
4. Toggle OFF Macro mode when you are done

What if you forgot add it to some element? Just toggle ON again and add it.

Is this just for adding classes, not really this will be probably most used case, but you can record any macro command like adding .bg-primary.py-1-px-2>h1.class-heading+p.class-my-text and apply this to multiple for eg. divs to add classes and multiple styled elements to it It really simple, you write first boilerplate, toggle ON and apply to any elements

Hey, sorry to bug about a version that probably is not supported again :/

In the structure panel, on oxygen 4.0 (alpha2) is not working as intended, instead of items do the indentation to the right side of the structure panel, it is doing for the left side (canvas side)

Hi, i know it still early for that, but just a heads up on oxygen 4.0

Right now the margin / padding fields are completely out of place due to the new oxygen 4 layout

It would be better to add a prefix to all the CSS variables used by Recoda for the theming. This is to avoid conflicts between recoda theme variables with the users own CSS variables, or those from other plugins/frameworks.

For eg. var(--text-color) is used by Recoda for the theme, but I am using the same variable for my styling, so there is a conflict (only in backend)

so instead of var(--text-color) it could be var(--ws-text-color) to avoid any conflicts in all situations.

There is a small compatibility problem with the oxypowerpack plugin, the icon when it is on the right side remains hidden and can only be seen by hiding the command bar.