[Support request] Shadows for blocks

[Pedro]

Hello! I would like to add shadows to content blocks like they do in Woorkup:

https://www.dropbox.com/s/a3on1zt1dniokpx/Captura%20de%20pantalla%20de%202019-03-14%2023-24-29.png?dl=0

How can I do it? Thank you!

[Leo]

Hi there,

Try this CSS:

.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
    border: 1px solid rgba(0,0,0,.05);
    box-shadow: 0 0 27px 0 rgba(214, 231, 233, 0.52);
}

[Pedro]

Hi leo!

That code adds to the blocks of products.

What I want is to add shadow to the entire block of the content of the site as to the sidebar.

Thank you!

[Leo]

So are you only referring to the single product page?

The front page isn’t possible as you have a full-width image which is inside the content container.

[Pedro]

Hi leo!

I mean the main container and the left sidebar.

[Leo]

Give this a shot:

.site-main, .sidebar .widget {
    box-shadow: 0 0 27px 0 rgba(214, 231, 233, 0.52);
    border: 1px solid rgba(0,0,0,.05);
}

[Author]

Posts