Feature Request: Add CSS to prevent FOUSC when VC Rows are set to Stretch

chrismcb6 · April 2020

When a VC row is set to stretch, the stretching occurs via Javascript, after page load.

This is particularly apparent when there's a row with a background colour or image.

Can an option be added to the theme to handle this with these two simple lines of CSS?

.vc_row[data-vc-full-width="true"]{ opacity: 0; transition: opacity 0.1s;}
.js_active .vc_row[data-vc-full-width="true"]{ opacity: 1; }

I am aware this means that browsers with JS disabled will never get to see these stretched rows, so it would need to be an "option" in the theme to turn off. The visual benefit for the 99%+ with JS enabled would outweigh the Non-JS user issue though.

Pablo · April 2020

Hello,

We'll discuss that, but I think it will not be possible at all.

This plugin is coming from other author, so we do not have permissions to change a lot of things in the plugins files.

For now, all I can suggest you to insert this code into the Theme Options > Custom CSS & JS > CSS

Thanks

chrismcb6 · April 2020

Thanks Pablo, the plugin would not be required to be altered; just your use of it within a theme (BeTheme specifically).

I have added it in to the custom CSS, however I'd expect it to be useful to many theme users too.

Feature Request: Add CSS to prevent FOUSC when VC Rows are set to Stretch

Comments

This website uses cookies