Home Forums Ascend Theme CSS for Semi-transparent Overlay on Mobile Transparent Header on Ascend

This topic is: not resolved
In Progress
Posted in: Ascend Theme  
  • April 19, 2021 at 10:42 am #265182

    Hi – I found the following CSS from a post (that I now cannot find!) to apply a semi-transparent black overlay to the transparent header in Ascend to give it a smoked-out effect.

    body.trans-header div:not(.is-sticky)>.headerclass-outer div:not(.is-sticky)>.kad-header-topbar-primary-outer div:not(.is-sticky)>.headerclass {
    background: rgba(0,0,0,0.3);
    }

    I am trying to replicate that effect on the mobile rendering but without success. I think I should work with “mobile-headerclass” and have tried some combinations but I don’t have enough CSS knowledge or understanding of the available objects. Can anyone help please?

    As a related secondary question, if anyone can point out where I would find references to the objects that I can use and set in CSS for the various Kadence Themes, I’d like to be more self-sufficient next time 🙂

    All help and words of wisdom appreciated!

    Cheers…

    Adrian.

    Please Login to continue

    If you do not have an account you can register here.