soflyy / oxygen-bugs-and-features Goto Github PK

Describe the bug
A lot of thumbnails in the design library are either missing or display the incorrect image for the assest. For one example of incorrect thumbs choose Financial > content > products

**Have you tried all the steps at **
Yes

Are you able to replicate the issue on a Sandbox install at https://oxygenbuilder.com/try?

Yes, The issue exists in all version of Oxygen 2 I have tested, the design library for freelancer is especially affected with almost half the thumbnails missing.

To Reproduce
Steps to reproduce the behavior:

1. Go to design library
2. Go through the available assets
3. profit!

Expected behavior
Show thumbnails and correct ones.

Screenshots
http://prntscr.com/mfbi22
http://prntscr.com/mfbi7t
http://prntscr.com/mfbjad
http://prntscr.com/mfbjqb
http://prntscr.com/mfbk3o
http://prntscr.com/mfbkrw
http://prntscr.com/mfbl2c
http://prntscr.com/mfbl7e
http://prntscr.com/mfbldb
http://prntscr.com/mfblib
http://prntscr.com/mfblo2
http://prntscr.com/mfbm1n
http://prntscr.com/mfbm7w
http://prntscr.com/mfbmjw
http://prntscr.com/mfbmrv

There are a lot more.

• Firefox, Chrome
• Windows 7
• All versions of Oxygen 2.0 and above

Describe the feature you'd like to see included in Oxygen.
To make everything well-organized inside templates we always need to rename objects not leaving them with default names like section, div etc. Today to rename a block you need to open a structure, push the option button, locate rename button.

It's rather better to make renaming available by:

1. clicking block title on a left pane (there is not binding to any click event's now)
   https://i.imgur.com/Wg9qy4L.png
2. By double-clicking block name in a structure.
3. And maybe one click id renaming somewhere not far from title would be great too because there is also several additional clicks to do that and it's no so clear for new users.

What are the use cases for this feature?
Accessibility.

Examples of this feature or functionality.
No need to provide an example, a lot of apps using this way of renaming.

I find myself often needing to fix the layout settings for multiple elements one after the other and then after setting it for one and picking the next one, the properties form default to the top and I have to drill down again to the layout options under advanced. If the property form can stay open at whatever property you are editing for an entity, when you select any other entity in the preview window or structure, it would speedup work like bulk editing on multiple items tremendously.

Any time the structure needs to change, like a parent div becoming a child of another etc. their layout settings have to be edited and a lot of checking between elements are required to build a robust layout. Currently this is quite a pain to do.

This will in the same way help a lot when needing to check the same property of multiple entities if the properties form doesn't reset to the top level every time and simply update with the settings of the newly selected entity.

Describe the feature you'd like to see included in Oxygen.
A clear, detailed description of the feature you're requesting.

It would be very useful to add modal boxes as an element of the builder, without external plugin.
In the modals we can add sub elements or use other oxygen templates parts.

What are the use cases for this feature?
e.g. Accessibility, e-commerce store that sells bicycles, etc.

We can use it to create forms, videos popups... everything to make a focus on an element.

It would awesome if Oxygen could support RTL languages like Hebrew and Arabic. Currently, I can't build sites for clients that need Hebrew sites.

While editing in the oxygen admin - it'd be amazing to have some keyboard shortcuts to easily go to different panels - eg, you click on, say, a text block, and then press L to go to the layout menu quickly. Holding down shift and dragging on the padding to snap to 10,20,30, etc. Holding down m and pressing the arrow keys to increase margin, p for padding, etc. Those are simple ones. But you get the idea.

I feel it could really make things even quicker. I find myself clicking around a lot to the same panels every time and it's not the best.

Photoshop has a bunch of good examples of keyboard shortcuts, even Divi had some good ones. And I hate divi now to be honest.

Thanks for Oxygen guys!

Not sure of all the intricacies, but having some issues when creating a transform effect in Oxygen (2.2 Beta).

I applied the transform to the hover state of a custom class on a div:

The transform effect renders properly in the builder. but on the live page, this is the CSS it outputs:

"transform: translate(-15);"

Which obviously isn't valid, and thus there is no hover effect.

Whilst trying to move an element in the structure menu I got the following error in the header: TypeError: startParent.hasClass is not a function.

I'm using the Latest WordPress. 5.0.3,

Active plugins:

Classic editor
Oxygen: Oxygen 2.1.2

Linux Mint Cinnamon
Xampp Local host

Currently, all the stylesheets created in Oxygen get put into universal.css, but sometimes CSS in the stylesheets are better template specific as they aren't needed across the rest of the site. ie large pages will lots of CSS.

When we create a new stylesheet in Oxygen, we would be given the option to either;

1. Make it global (this being the default, so it's added to the universal.css file as it already is now)
2. Make it just for that template. So the CSS isn't used across all the other pages and is instead included in a template specific css file.

Something like this...

Benefits: Better performance across site, reduces chances of errors due to using same classes across different pages (if making multiple tests of sales page for example, the CSS will be similar and using same classes ) but layouts can need to be changed.

Ability to completely white-label the HTML/CSS output
Oxygen automatically creates some CSS IDs/classes that can't be modified or renamed. The idea is to have a list of CSS IDs/classes that Oxygen normally creates dynamically next to input fields so they can be renamed to something else

Better product delivery for agencies and clients
White-labelling as much of the HTML/CSS output gives a better impression for agencies and clients in that something is highly customised

The current "slider" helper cannot populate slides with data, which limits its uses. As well as this, we do not currently have a carousel helper.

So, here's a feature request for a slider-carousel, where you can configure not only the number of slides displayed per set (2 or more would be a carousel), but also take data (like ACF) using customisable templates in a similar way to the Easy Posts helper.

Some good carousel options would be:

• To advance by a whole set, or just by one.
• Auto- or manual advance the slide.
• Responsive slide number options (e.g. 3 slides at 1000px, 2 at 750px, 1 at 500px).

In terms of uses, it would be very versatile (like other helpers). Example uses may include:

• Featured gallery for page/post
• Featured posts on homepage
• Featured WooCommerce product
• Rotating testimonials
• Rotating logos in footer

I'm not sure that I've come across anything as versatile as this. Others may be able to provide similar examples in the market, or it may be something unique to Oxygen.

I would like to see woocommerce integration in the new version of oxygen.

Thanks.

"Enabling 3D perspective will make it possible to move, rotate, and scale objects in 3D space. A perspective can be set on a parent element and affect all of its children, or just on the element itself. Both of these options unlock 3D transforms"

Now that we're getting the transform tools, it would be great to be able to get the children perspective options that webflow has:

https://university.webflow.com/article/3d-perspective

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Oxygen Version [e.g. 2.2 Alpha]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Oxygen Version [e.g. 2.2 Alpha]

Additional context
Add any other context about the problem here.

Describe the feature you'd like to see included in Oxygen.
I would like to include icons in headings and rich-text content. I would like to add an icon as a shortcode like [fa-bar class="myiconclass" size="20"] or something like that so that I can quickly add and style the icon.

What are the use cases for this feature?
Creating social links, icons in subheadings etc. If I not I need to add icon and text to a div, adn sometimes if the icon is in the middle of text, it gets really hard to get it done right

Examples of this feature or functionality.
I personally like themeco's implementation - http://demo.theme.co/integrity-1/shortcodes/icons/

Describe the feature you'd like to see included in Oxygen.
A clear, detailed description of the feature you're requesting.

I would love a "Developer Mode", so Oxygen wouldn't name all of the div IDs i am creating.

What are the use cases for this feature?
e.g. Accessibility, e-commerce store that sells bicycles, etc.

Clean code. I am using BEM naming methodology for all my CSS classes, thus already creating a clear readable structure.. all those random ID names are kinda obscuring it. see screenshot.

Hi.

I made a post the good old fashion way today, as I want to hand it off to a client and have them make posts easily, with classic editor.

When I inserted a picture into the classic editor and then looked on front end, all pictures added in the editor were distorted (not responsive).

I then added this (as per fb post) below and it works perfectly.

When adding images to posts using the classic editor. The images will not be responsive.

Do this.

Open posts template > click on the div that has the images on it > click style output > right at the bottom you will see the "img" tag > hightlight that > go to advanced > custom css> and past this in

img width: 100%;height: auto;

Please add this to your oxygen css as standard, do all images added in classic editor are responsive by default.

Thank you.

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

What actually happens
A clear and concise description of what happens instead of the expected behavior.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Oxygen Version [e.g. 2.2 Alpha]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Oxygen Version [e.g. 2.2 Alpha]

Additional context
Add any other context about the problem here.

Since Oxygen is a plugin and not a theme it would be an important feature to add a global Function.php instead of localized PHP or adding another plugin that might be or might become incompatible with Oxygen.

This would permit us to add PHP in one central area for global coverage.

If i have overlapping modules in the oxygen builder, i can not edit the module anymore. Cause if i try to click it, i always click the module on top.
So we need some solution for this in the builder, maybe a small icon in the structure tree element, which will open the settings of this module.

As it currently stands we're only able to add one filter at a time (blur, hue etc) - it would be great to be able to stack filters and turn them on and off like Webflow allows

Describe the feature you'd like to see included in Oxygen.
Define posts per page on a per Easy Posts element basis.

What are the use cases for this feature?
Allows us to return a variable number of posts while retaining pagination functionality. Currently, the "Blog pages show at most" setting under Settings > Reading determines the pagination threshold for all Easy Posts elements on the site.

Examples of this feature or functionality.
N/A

Describe the feature you'd like to see included in Oxygen.

I'd like the ability to stack several elements and rearrange them like Webflow + Thrive Architect has. Ideally would like the following:

1. Solid background colours
2. Gradients
3. Background images
4. Patterns (although not super important vs the rest)

An extra thing would be to be able to toggle images on and off (like webflow allows too)

What are the use cases for this feature?

More style options + less photshop

Examples of this feature or functionality.

https://www.loom.com/share/02245cbafb694714a962f1c6b2e765c4

Describe the feature you'd like to see included in Oxygen.
A clear, detailed description of the feature you're requesting.

Printing styles from the "Advanced" tab to a stylesheet, at the same time resetting the selector. This can be manually done using copy and paste when inspecting in a browser, but it would be handy to have this function inside Oxygen. Even better would be the possibility to have two choices: Print to Stylesheet or Copy to Clipboard

What are the use cases for this feature?
e.g. Accessibility, e-commerce store that sells bicycles, etc.

I am writing all my CSS outside of Oxygen, but I sometimes wish I could just quickly set up the CSS I need inside and then quickly copy it to Sublime to further work on it, use mixins etc.

Even better then just copying the CSS from one selector would be extraction from a whole section and all selectors that exist within a specific class.

Example:

Imagine a structure like this:

.header .header__logo .header__nav .header__cta

When copying the code from .header, it would copy all the CSS that exist from other selectors within the main one, so you would end up with something like this in your clipboard/stylesheet:

.header {
height: 70px;
}

.header__logo {
color: black;
}

..and so on

I really think this would be an amazing feature!

I would like to be able to specify the order of the icons in the Social icons widget.

it would be amazing if we could use SASS inside Oxygen Stylesheets, would make life so much easier! You could use a php Compiler like this one here: https://github.com/leafo/scssphp

along with that, a better code editor would be amazing. you could include Monaco (https://microsoft.github.io/monaco-editor/) and ACE (https://ace.c9.io) and have the user choose for their favourite.. the current code editor is pretty basic, even Elementor CSS editor is more advanced ;)

Describe the feature you'd like to see included in Oxygen.
A clear, detailed description of the feature you're requesting.

What are the use cases for this feature?
e.g. Accessibility, e-commerce store that sells bicycles, etc.

Examples of this feature or functionality.
If another product has done it well, provide examples here.

Describe the feature you'd like to see included in Oxygen.
A template assignation option under "Other" such as "URL" which allows us to define comma separated URLs to pages on which the template should be used to render the content.

What are the use cases for this feature?
This would allow us to target plugin generated pages that are not traditional posts and style them.

Examples of this feature or functionality.
N/A

Bigger library with more drag & drop elements like: premade sections, shape dividers, background overlays, css filters etc.
It would really make design process faster with better visual results with less coding. Great especially for people who are not familiar with advanced coding.

Something similar to what Elementor has with constant growing items to choose from.

Describe the bug
Checking the box for "Cache List of Google Fonts" causes the Builder to not fully load any templates (current or previous builds)

Have you tried all the steps at https://oxygenbuilder.com/documentation/troubleshooting/troubleshooting-guide/?
Yes

Are you able to replicate the issue on a Sandbox install at https://oxygenbuilder.com/try?
No need, see below.

To Reproduce
Steps to reproduce the behavior:

1. Go to 'Oxygen -> Settings --> General'
2. Click on 'Cache List of Google Fonts'
3. Create new template or open an existing.
4. See error

Expected behavior
Builder should load template.

What actually happens
Template loading fails partially through load

Screenshots
Screens here: https://www.facebook.com/groups/1626639680763454/2081755118585239/?comment_id=2083767365050681&notif_id=1548861311882732&notif_t=group_comment_reply

Desktop (please complete the following information):

• OS: Win 10
• Chrome, latest
• Oxygen 2.2 Beta 1

Smartphone (please complete the following information):

• Didnt check

Additional context
Nope.

Screenshots

Desktop (please complete the following information):

• OS: Mac OS X 10.13.6
• Browser: Chrome 72.0.3626.81, Safari 12.0.3 (13606.4.5.3.1)
• Oxygen: Version 2.2 Alpha 1

Describe the feature you'd like to see included in Oxygen.
I'd like if the logos all tasted like spaghetti.

What are the use cases for this feature?
Deliciousness.

Examples of this feature or functionality.
No one else has pulled this off.

From the forum:

It would be super nice to be able to use right-click functionality to copy, paste, and reset styles.

Example Use Cases:

1. Copy Styles from ID to Class

• Right click on an ID's Advanced tab > Copy All Styles, switch to the class, right click on Advanced tab > Paste All Styles

2. Copy Certain Advanced Styling from One Element or Class to Another

• Right click on Effects > Copy Effects, switch to different element or class, right click on Effects > Paste Effects

3. Reset Advanced Styles

• In Advanced tab, right click on Typography > Reset Typography

In « Archive + Easy Post » it is impossible to display ACF images that are related to custom post without custom PHP programming.

To make this work we must put the image in WP FEATURE IMAGE field and not in a ACF image field.

It would be nice to have access to any fields that are made with Custom Post

Possible to style google maps using custom JSON files from a source like snazzymaps.com.
Further to this, would it be possible to upload a custom map marker.

First up, I love that we now have gradients as part of the system, however I still think it needs work when it comes to the UI - it's not the most pleasant currently

I'd improve it by making it similar to Webflows and it's much similar to how most design tools handle gradients (photoshop for example)

https://uploads-ssl.webflow.com/583347ca8f6c7ee058111b55/5c3cec7dc37143433182d861_GVFZB5hJi-MIbitnGRTx_PWKaflXKqqrld4SR1DsrDa0BvbMADa_YvWL_YiZNtTiu1fGUziWrF6PIauoJpMQmgr9YZdbzgVE9spWABQLflP5heBcm0cGokVlirFmbVDMIq7biARV.jpeg

This is the best one I've seen and also includes the feature "repeat" and "reverse" which we don't have atm (I understand we could just reverse the degrees, but this is way faster when testing.

Thanks

Responsive menu builder with few choices to pick from: fullscreen, offscreen and others with dropdown submenus available.

Describe the bug
When in the builder, working in any device width that makes the rules appear at the bottom of page. When I try to use the ruler to view the site at different widths, a horizontal scroll bar appears over the top of the ruler, making it very difficult to use.

To Reproduce
It does the same on the sandbox Oxygen. It's due to the ruler's width being calculated wrong by 6px (not taking into account the 6px margin on the iframe) so we get a horizontal scroll bar that pops up just as we're trying to use the ruler.

Screenshots
Screen recording - https://www.useloom.com/share/b821373287524b7182e041083a9289d1

Desktop (please complete the following information):

• Mac OS: [e.g. iOS]
• Chrome
• Oxygen Version 2.1.2 & 2.2 alpha

By being able to load up the builder straight from the templates screen, it would speed up workflow. Most of the time, when we're in the template screen, it's much more common that we're just trying to load up the builder, not edit where the template is active. That happens much less often. So being able to skip that next edit screen and go straight to the builder would be a smoother workflow.

Currently, the 'view' link that is there is useless as it takes us to the same place as the 'edit' link. So this can just be removed (and replaced with new link)

For users with no JS enabled (the JS doesn't load, loses connection or they have it turned off for some reason) all the content that has the animation applied to will stay hidden forever.

To help us to keep compliant with accessibility standards, if you could include a way of only applying the opacity: 0; if the JS is enabled that would be great. I imagine a lot of Oxygen users will be applying these animations a lot on the main sections of their sites once 2.2 is released.

There has been discussions and proposed solutions to this on the aos github comments - michalsnik/aos#81

The Gallery, unlike the other elements, does not allow to have different layout settings depending on the stack (992px, 768px, 480px).

Describe the bug
Currently, there is no way to access the sub menu in Oxygen sites for keyboard users. You should be able to tab across the to the sub menu items using a keyboard.

To Reproduce
In chrome browser, go to Oxygen's atomic demo page - http://atomic.oxy.host/
Start tabbing across the menu. Notice you can't access the sub menu items with the keyboard alone.

The problem is in the CSS, where you have visibility: hidden; as the way to keep the sub-menu hidden until the user hovers over the menu-item, making the sub menu items not focusable.

Solution
Instead of using visibility, you can instead move the sub-menu out of visibility by giving it a right: 5000px; or something similar to push it off screen. Then bring back to right: auto; on both hover and using focus-within for keyboard users. I made a gist with the CSS I've been adding to Oxygen sites to solve the problem. The bottom part is just to match the colors that are set in Oxygen as Oxygen only applies the color changes to hover but not focus.

https://gist.github.com/wplit/9394985fb87ed279ca175cb45a2ee5ef

Last updated date and post revisions count
Data sources to display last modified date and the number of revisions made to a post

What are the use cases for this feature?
Informs the freshness and attempts to keep the post fresh

Add «Title, Description and Alt Text» option to the gallery Caption with user choice of line 1, line 2 or line 3

Example ;
Upper line = Title OR Caption
Middle line = Caption OR Description
Lower line = Description OR Title

And please make it possible to edit the Typography of the text on the gallery as well as individual image.

Describe the feature you'd like to see included in Oxygen.
A clear, detailed description of the feature you're requesting.

What are the use cases for this feature?
e.g. Accessibility, e-commerce store that sells bicycles, etc.

Examples of this feature or functionality.
If another product has done it well, provide examples here.

I mentioned this during the alpha stage (all pages are similar in response)

https://www.useloom.com/share/5cee6a04180d41fab75894b2d9b942a9

I was told "Thanks for sending that over. I'm able to replicate this slowness when dragging and dropping with a complex page design in Oxygen 2.2 Alpha 1. I'll get a report over to the developers so they can take a look to see why this is happening." but it seems to still exist in the 2.2 beta :)

Thank you

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Oxygen Version [e.g. 2.2 Alpha]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Oxygen Version [e.g. 2.2 Alpha]

Additional context
Add any other context about the problem here.

One undo option is just not enough for speedy work. If you make mistake twice or more you have to delete and do things again. It really slows down design process.

Bug Oxygen 2.1.2: I can't use Global color in Toggle Helper element. It doesn't work in the icon color parameters (default, closed and expanded state).

It ouput the number of the global color in value of background-color (see image below) instead of the hexadecimal value.

Can it be fixed soon please?

Here is a blank install where you can see the issue: http://helpless-whale.w5.wpsandbox.pro?upass=iuA3W367UwNl

The page where you can inspect the code to see the bug: http://helpless-whale.w5.wpsandbox.pro/issue-global-color-on-toggle-helper-element/

Hey guys,

I'm having two issues when it comes to blend modes (under opacity) I'm having 2 issues:

1. It doesn't render an image when a blend mode is applied on mobile (chrome, android - latest version)

https://photos.app.goo.gl/hT3NKYt7r1VuurSx9

2. The blend mode stops when an animation is added:

https://www.useloom.com/share/7c88e052fad24f8eb3ebdbae7ab78010