Buttons appear with overlay!

  • Resolved SteadiOp

    (@steadiop)


    2 years, 11 months ago

    HI – I have configured my banner in the backend and it all appears fine with the correct (default) blue colour for the accept button and the font in the backend rendering of the buttons is correct.

    On the front end, the buttons have an overlay that looks similar/same as the overlay when hovering over a menu item on my page and the colour appears the same/text appears to be the same font…

    I am struggling to override what looks like a theme based CSS issue to get the banner to render as intended (and as it appears in the backend). I’ve tried using the css classes and adding !important and have placed this in the plugin CSS and in the theme CSS override to no avail.

    Any ideas or help from anyone would be very helpful. TIA

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor Rogier Lankhorst

    (@rogierlankhorst)

    There is a theme settings which forces your button background to transparent with an !important.

    You can fix this by adding to your custom css:

    #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
    background-color: var(--cmplz_button_settings_background_color)!important;
}
    Thread Starter SteadiOp

    (@steadiop)

    Thanks Rogier…

    I have tried the code suggested both in the custom theme CSS box and in the complaint banner custom CSS box – it hasn’t had any impact on the front end but it does change the backend version of the ‘allow’ button from blue to white.

    I must still be doing something wrong?

    Also, it has no impact on the front end font for the buttons which differs form the font in the backend… is that as its supposed to be?

    Thanks for your help.

    Plugin Author Aert Hulsebos

    (@aahulsebos)

    Hi @steadiop,

    This removes the red overlay;

    .cmplz-cookiebanner input[type=submit]:before, button:before, .button:before {
    display:none;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
    color: white!important;
}

    regards Aert

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Buttons appear with overlay!’ is closed to new replies.