Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 30, 2021 at 12:26 pm #1308104
    whdsolutions

    Hello there

    I was wondering if you could help me, we are struggling to make masonry grid a gradient overlay and text top left like in this example

    Home-Page-Amends-003

    I have posted a URL in Private Content to show you the page as it is now

    July 2, 2021 at 3:46 am #1308430
    Ismael

    Hey whdsolutions,

    Thank you for the inquiry.

    You can use this css code to change the transparent background of the overlay to color gradient.

    #top .av-caption-style-overlay .av-masonry-item-with-image .av-inner-masonry-content {
    background: rgb(2,0,36);
    background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(255,255,255,0) 100%);
}

    You can visit this site or tool to adjust the color.

    // https://cssgradient.io/

    Best regards,
    Ismael

    July 2, 2021 at 2:27 pm #1308508
    whdsolutions

    That is awesome thank you.

    How do we get the titles to go top left like in the example

    July 2, 2021 at 2:32 pm #1308510
    whdsolutions

    Also is there a way to make the hover effect to be monochrome (black and white)

    July 2, 2021 at 2:32 pm #1308511
    whdsolutions

    I sorted this

    July 4, 2021 at 4:18 am #1308612
    Rikard

    Hi,

    Great, I’m glad that you found a solution, and thanks for the update. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.