Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • November 13, 2020 at 12:54 pm #1260331
    fkm

    Hello,
    I´d like to move the cookie consent box to the middle of the screen at the desktop version.
    In addition I´d like to customize the spacing inside the box (padding?) if possible and switch the centered text to a left aligned one.
    Please help.
    Thanks a lot in advance.
    Best regards, fkm

    November 14, 2020 at 6:58 am #1260457
    Rikard

    Hey fkm,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (min-width: 768px) {
.avia-cookiemessage-top-left {
    left: 38%;
}

.avia_cookie_text {
    text-align: left;
}
}

    Best regards,
    Rikard

    November 16, 2020 at 5:03 pm #1260750
    fkm

    Hey Rikard,

    works great for the big screen – thank you very much!

    Still the text is centered on mobile devices (smartphone).
    Please let me know how to change it into a left aligned as well.
    Also I´d like to move the buttons to the left (nor centered) and increase the space above and below them.

    Thank you very much for your help in advance.

    Best regards, fkm

    November 19, 2020 at 3:36 pm #1261580
    Yigit

    Hi fkm,

    I checked your website however cookie bar is currently disabled. Could you please enable it once again and post a screenshot showing the changes you would like to make? You can upload your screenshots on imgur.com and post the links here :)

    Best regards,
    Yigit

    November 25, 2020 at 12:02 pm #1262976
    fkm

    Hi Yigit,

    first of all thank you very much for your reply (and pleace excuse my late).

    I just enabled the cookie bar again. Please see the screenshots (dropbox link).
    If possible, I´d like to have a similar cookie bar for all devises (left aligned text and bottoms at the left on desktop and mobile devices).

    Thanks a lot in advance.

    Best regards, fkm

    November 25, 2020 at 2:54 pm #1263005
    Yigit

    Hi,

    Please try adding following code to bottom of Quick CSS field

    
@media only screen and (min-width: 768px) {
.avia-cookiemessage-top-left {
    width: 45%;
}
.avia-cookie-consent .avia-cookie-consent-button {
    float: left;
    margin-left: 0;
}}

    Best regards,
    Yigit

    November 25, 2020 at 4:12 pm #1263024
    fkm

    Hi Yigit,

    this code works very well for viewing on desktop/tablet – so far, many thanks.
    Still both the text and the buttons are centered viewing on smartphones.
    Please let me know how to match it.

    In addition please let me know if it´s possible (without major effort) to implimate a colored overlay behind the cookie box as a background for the whole screen which disappears when the box is clicked away.

    Thanks again in advance.

    Best regrads, fkm

    November 26, 2020 at 2:28 pm #1263266
    Yigit

    Hi fkm,

    That is because there is not enough space. You could try adding following code to Quick CSS which would decrease paddings on the sides and font size so buttons would be displayed side by side

    @media only screen and (max-width: 480px) {
#top .avia-cookie-consent .avia-cookie-consent-button {
    padding-left: 13px;
    padding-right: 13px;
    font-size: 12px;
}}

    You can display an overlay using following code

    .avia-cookie-consent-wrap[aria-hidden="false"] {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 999;
}

    0,0,0 is RGB value of the color and 0.5 is opacity level which you can adjust between 0-1 :)

    Best regards,
    Yigit

    November 26, 2020 at 5:07 pm #1263297
    fkm

    Hi, Yigit.

    Thank you very much for your fast reply/support.
    Worked just great.

    Best regards, fkm

    November 26, 2020 at 5:28 pm #1263301
    Yigit

    Hi fkm,

    You are welcome! :)

    For your information, you can take a look at Enfold documentation here – https://kriesi.at/documentation/enfold/

    If you have any other questions or issues, feel free to start a new thread under Enfold sub forum and we will gladly try to help you :)

    Enjoy the rest of your day!

    Best regards,
    Yigit

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘cookie consent box styling’ is closed to new replies.