CSS Cascade is different in release 1.7.1

Home Forums Polyclinic CSS Cascade is different in release 1.7.1

Viewing 10 posts - 1 through 10 (of 16 total)
  • Author
    Posts
  • #19996

    aisdwebservices
    Participant

    CSS Cascade is different in release 1.7.1

    Hey Webman,

    There seems to be a difference in the way you are calling your CSS cascade in theme version 1.7.1 than in previous releases. The file dev.polyclinic.styles.css is now being called last overriding styles placed in the “additional CSS” customizer causing significant altering of our sites. I can, of course, override by adding !important to these styles but I wanted to make sure that I don’t do this unnecessarily if this cascade change was in error in this version.

    Thank you for your time.

    Greg Stone
    Arlington ISD Web Services

    #19998

    Oliver Juhas
    Keymaster

    Hi Greg,

    There was no change in loading the stylesheet files in Polyclinic and WordPress’ “Additional CSS” field output loads after all theme stylesheets for me, as it should.

    And I can see the same on your website – the “Additional CSS” is also being loaded after theme stylesheets there. You can check the HTML of your website generated in your web browser (right click → “View page source” or CTRL+U, most likely).
    Can you confirm this please?

    (You can actually see the changelog.md file inside the theme folder for details about updates.)

    Best regards,

    Oliver Juhas
    WebMan Design

    #20010

    aisdwebservices
    Participant

    I believe I discovered the discrepancy. It looks like some of your CSS changed to add additional classes in certain cases that were different than how beaver-builder sets their defaults (which is what we were styling from). I’ve attached an example of this. It led me to believe that the Polyclinic stylesheet was being called last when it was just an added parent class overriding a child. I’ve updated our code to reflect yours and layout is corrected on our sites.

    Thanks for the quick response!!

    Greg

    #20013

    Oliver Juhas
    Keymaster

    Hi Greg,

    Yes, the Beaver Builder compatibility (and styles) was updated to reflect version 2.2 of the plugin. Updating your custom CSS accordingly will resolve the issue.

    Best regards,

    Oliver Juhas
    WebMan Design

    #20015

    aisdwebservices
    Participant

    Thanks Oliver!

    That makes complete sense. BB 2.2 isn’t showing as an update for us yet. I’ll go to their site and check the downloads area. We just upgraded to WP5.0 today so it’s been a little crazy getting everything in place.

    #20016

    Oliver Juhas
    Keymaster

    Hi aisdwebservices,

    The BB2.2 is available in paid version of the plugin for now only. Hoping soon for free Lite Version update too.

    Best regards,

    Oliver Juhas
    WebMan Design

    #20028

    aisdwebservices
    Participant

    Oliver,

    We’ve updated to BB 2.2 and are still seeing this issue with a very specific issue concerning “.fl-module-content”. I’ve attached another screenshot. This does seem to be a deviation from core beaver builder CSS. Your CSS is cascading after margins in the global settings in BB in this particular case. It’s the only deviation I’ve seen in my investigation.

    Thanks!

    GPS

    #20030

    Oliver Juhas
    Keymaster

    Hi GPS,

    Like I’ve mentioned in one of my previous reply above, the theme CSS styles regarding Beaver Builder were changed. You need to adapt your custom CSS to fix the issue.

    Please understand that from your screenshot it’s not possible for me to understand the issue. Can you maybe provide a screenshot of what exactly is wrong and describe the issue in more details? For now I only know that your custom CSS is not being applied the way it was before the update ;)
    You seems to have an issue with module margins. Could you provide the screenshot of that particular module maybe? Also, can you provide URL to affected page so I can check the code personally? That way I will be able to provide more help.

    Thank you.

    Best regards,

    Oliver Juhas
    WebMan Design

    #20031

    aisdwebservices
    Participant

    I can certainly do that but it seems odd that your theme styles would be overriding the global BB styles where it never has in the past. Even when I remove my custom CSS, your CSS overrides core BB styles in this case.
    I did notice that the theme is now using dev.polyclinic.styles.css instead of polyclinic.styles.css (although both are in the “wmtheme-polyclinic” folder). Could this be a reason for the issue? I do not believe I’ve seen that file being used by you in a production theme and we’ve been using this theme for 2+ years.

    GPS

    #20032

    Oliver Juhas
    Keymaster

    Hi GPS,

    My themes actually all override Beaver Builder global styles and always had. In recent theme update the styles were just modernized (made the same to my newer themes). This is to make sure the Beaver Builder layout is the same width as the website content layout (which is not when using Beaver Builder by default – they simply style the content differently leaving gaps on the sides – you can try their demo at https://www.wpbeaverbuilder.com/ for preview and compare it to https://themedemos.webmandesign.eu/polyclinic/ content width).

    But also, the issue here might lie in what you mean by “Beaver Builder global styles“. Please note that the theme only overrides the actual global styles reset of Beaver Builder. And not all of it. It does not override the actual specific Beaver Builder page layout. Do you experience an issue with actual specific page layout?

    And dev.polyclinic.styles.css should only be loaded when your website is in debug mode. The polyclinic.styles.css stylesheet is minified version of the dev. one and should be loaded in all other cases. However, it seems you are correct, the dev. stylesheet is loaded all the time. I will check this and fix in next theme release. Thank you for spotting! Although this is not the cause of the issue as both stylesheets contain the same styles (only one of those are minified).

    But can you actually provide a specific issue you experience? What styles are being overridden for you and what is the expected behavior? Can you provide a screenshot of the issue on the actual Beaver Builder module that is affected? Should it have more spacing/margins? Or is there some other issue? Can you please explain? Thank you.

    Best regards,

    Oliver Juhas
    WebMan Design

Viewing 10 posts - 1 through 10 (of 16 total)

You must be logged in to reply to this topic.