Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.

Okay
  Public Ticket #1388902
The Gem Product Grid
Closed

Comments

  • Walnyera started the conversation

    Hi, I would like to modify the hover color for the Gem product grid (WooCommerce), is there a widget or do I need to use custom CSS?

    Also I used squared images but hey seem to be resized in the grid, how can I also change that?

    Thanks.

  •  7,092
    Oliver replied

    Hi,

    1. CSS:

    body .hover-circular .portfolio-item .image .overlay .overlay-circle,
    body .hover-circular .gallery-item .overlay-wrap .overlay .overlay-circle {
        -webkit-transition: opacity 0.5s 0.2s;
        transition: opacity 0.5s 0.2s;
        background: -moz-linear-gradient(to bottom right, rgba(0, 188, 212,0.75) 0%, rgba(53, 64, 147,0.75) 100%) !important;
        background: -webkit-linear-gradient(to bottom right, rgba(0, 188, 212,0.75) 0%,rgba(53, 64, 147,0.75) 100%) !important;
        background: linear-gradient(to bottom right, rgba(0, 188, 212,0.75) 0%,rgba(53, 64, 147,0.75) 100%) !important;
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0s, opacity 0.4s ease 0s;
        box-sizing: content-box;
    }

    2. Pls, add this css:

    .portfolio:not(.hover-horizontal-sliding) .portfolio-item .image .image-inner img {
        left: 0;
        width: 100%;
    }

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • Walnyera replied

    Thank you very much !

  •  7,092
    Oliver replied

    Welcome!

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver