NO BUG: A popup loses its styling

Browser: Brave
OS: macOS
Video: Jam

The styles that I add via the class manager to a popup show in the popup editor, but not when I open the popup via a custom post type template when opened on the front end.

Hi Yasmine,
Thanks so much for your report!

Your CSS has an issue since the styles are there but only show downwards from the tablet-portrait breakpoint.

Please have a look at your custom CSS. If you add a custom media query, you should add it to the base breakpoint. Otherwise, it gets wrapped with the breakpoint media query, resulting in invalid CSS.

Best regards,
timmse

Hi Timmse,

I did add the CSS at the desktop breakpoint inside the editor (and nothing added in the small media queries for this one), but maybe its some of my other CSS!

Ok, but it’s not about the .share--btn styles, it’s about this:

Unfortunately, I can’t tell you where you added the .flex-grid--m-1… custom CSS, but that leads to the problem, as far as I can see.

I found and disabled the .flex-grid–m-1, but its still not fixed.

So then I turned off all my custom css in my style.css file (where I keep all my variables) , and changed my share–btn style to:

%root% {
color: red!important /*var(--primary)*/;
font-weight: bold;
}

There are no other CSS classes on the section, container, other elements within this section.

And I still get:


Not the red I’d expect and which shows in the editor.

Is the problem on the template I open it from?

Hi @yasmine ,

Please check the custom CSS in your footer template as well. There must be something incorrect causing the generated style corrupted.

Regards,
Jenn

Thank you - its somewhere in my footer!

1 Like