Alin-Muste

How can we make the header smaller in the top and bottom padding? They already have a padding of 0, and reducing the "header" height doesn't also move the text, it only cuts the black background.

2 minutes ago, Ziggy said:

Add this additionally:

body.tweak-transparent-header .header:not(.shrink):not(.transparent-header-theme--override) {
    backdrop-filter: blur(0px) !important;
}

 

Wow, thank you so much!
Finally, the last issue I see is that on mobile it seems like the menu doesn't appear anymore after adding the code, any idea why?

29 minutes ago, Ziggy said:

You can try this Custom CSS:

[data-header-style="dynamic"].header {
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(10px);
}

 

Thanks, that is great, however now the bar is always blurry (including on the hero which looks weird), is there a way to make it so only when the background fades in the blur fades in as well?

How can we make the HEADER black background that appears with "SCROLL BACK" or "BASIC STICKY HEADER"
Be 50% opacity and blurred ?

We use adaptive color, so it is transparent when you first land on the page but as you scroll the black background fades in becuase of the BASIC STICKY HEADER option

5 minutes ago, Ziggy said:

If you have the header color set to solid you can change the color, opacity, and blur effect.

Hello,
The header background is transparent, however we use this feature :
Which fades in a black background to the header after the first section.
How do we edit this black background with or without code?
Check biobuilds.com for an example

How can we make the black header bar that appears with "SCROLL BACK" or "STANDARD STICKY HEADER"
Be 50% opacity and blurred ?

How do we make the "VIEW CATALOGUE" button on the website "postion: fixed" while also not being overlayed by images and text when scrolling down. Z-Index is already at maximum and that doesn't seem to fix it.

Site: https://www.biobuilds.com/tourism

19 minutes ago, abibacon said:

Hey @Alin-Muste, you'll want to use the '.fe-block-b29d00e9c400b3846cf4' rather than that block id. 

That seems to do something, however now it doesn't even pass the first section. It gets stuck after that.

We want it to keep on the entire site so wherever they are they can just go to the catalogue easily.

Thanks for the help by the way!

19 minutes ago, abibacon said:

Ah okay, the selector may need to be adjusted, what is the CSS you're using? @Alin-Muste

This one:


@media only screen and (min-width: 661px) {
    #block-b29d00e9c400b3846cf4 {
        position: fixed;
        z-index: 9999999999;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        width: 400px;
        height: 55px;
        box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.3);
        border-radius: 5px;
    }
}

1 minute ago, abibacon said:

Hey @Alin-Muste, looks like it is a z-index issue, you'll want to increase this further.

It is z-index 9999999999, what should I change it to?

How do we make the "VIEW CATALOGUE" button on the website "postion: fixed" while also not being overlayed by images and text when scrolling down. Z-Index is already at maximum and that doesn't seem to fix it.

Site: https://www.biobuilds.com/tourism