Okay
  Public Ticket #2809283
Fancy box customization
Closed

Comments

  • amministrazione_bcame started the conversation
    June 23, 2021 at 9:39am

    Hi,

    is it possibile to change the overlay color above the image on idle? Di default it seams to be semitransparent black gradient, i need it to be full filled blu semitransparent (3d section from the top). 

    Thank you  

  •  8,847
    Tahir replied
    June 23, 2021 at 10:22am

    Hey Again,

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    .nectar-fancy-box[data-style="hover_desc"] .box-bg:before, .nectar-fancy-box[data-style="hover_desc"]:before {
    height: 100%;
    background: linear-gradient( 90deg ,#242d4a7a 0%,#02588b9c 80%) !important;
}

    Thanks

    ThemeNectar Support Team 

  • amministrazione_bcame replied
    June 23, 2021 at 2:23pm

    Ok, done! It works.

    Just one thing, actually, it was ok to have another gradient effect — gradient transparency, so i'd like to maintain it how it was before, just changing the color, while with this custom CSS the hover effect got override also. Thanx

  •  1,878
    Judith replied
    June 23, 2021 at 2:35pm

    Hi There,

    Do I didn't see the color on hover override. 

    This css changes the color on idle/before hover:

    .nectar-fancy-box[data-style="hover_desc"] .box-bg:before, .nectar-fancy-box[data-style="hover_desc"]:before {
        background: linear-gradient(to bottom,rgba(15,15,15,0),rgb(202 55 55 / 75%) 100%);
    }

    And this on hover:

    .nectar-fancy-box[data-style="hover_desc"][data-color="accent-color"]:before {
        background: linear-gradient(to bottom, rgba(0,0,0,0), #6e2088 100%);
    }

    Thanks.