FROM CACHE - en_header
Return management just got easier! We’ve launched Customer Self-Serve Returns to all Shopify merchants. Click here to learn more!

Wookie Theme - Header Shadow?

Solved
SILVENU
Tourist
13 0 3

Hi!

 

Does anyone know how to add a shadow under the header on Wookie? There is a shadow under the sticky header, but I would like a permanent shadow if possible.

My site: silvenu.com

Thanks!

Accepted Solution (1)

Accepted Solutions
Muhammad_Ali_S
Shopify Partner
571 103 159

This is an accepted solution.

@SILVENU ,

Try this.

.tt-desktop-header {
    box-shadow: 0 3px 8px rgb(0 0 0 / 30%);
}
Ali Shahzad | Designer | Developer
- Was my reply helpful? Click Like and Accepted Solution to let me know!
- Hire me | Whatsapp +92 3486775142

View solution in original post

Replies 7 (7)
Muhammad_Ali_S
Shopify Partner
571 103 159

@SILVENU,

Add this at the bottom of the Theme.css file.

.tt-desktop-header {
    box-shadow: 0 0 8px rgb(0 0 0 / 30%);
}

 Do let me know if it works as you wanted.

Ali Shahzad | Designer | Developer
- Was my reply helpful? Click Like and Accepted Solution to let me know!
- Hire me | Whatsapp +92 3486775142
SILVENU
Tourist
13 0 3

This applies the shadow to the header and information bar... is there a way to just do the bottom of the header?

 

Also, is it possible to make the shadow a little less dramatic? ie. reduce the thickness or darkness of it a little?

@Muhammad_Ali_S

Thank you!!

Muhammad_Ali_S
Shopify Partner
571 103 159

This is an accepted solution.

@SILVENU ,

Try this.

.tt-desktop-header {
    box-shadow: 0 3px 8px rgb(0 0 0 / 30%);
}
Ali Shahzad | Designer | Developer
- Was my reply helpful? Click Like and Accepted Solution to let me know!
- Hire me | Whatsapp +92 3486775142
Muhammad_Ali_S
Shopify Partner
571 103 159

@SILVENU,

Reduce 30% to a Lower value for Less bright shadow. 

Ali Shahzad | Designer | Developer
- Was my reply helpful? Click Like and Accepted Solution to let me know!
- Hire me | Whatsapp +92 3486775142
Muhammad_Ali_S
Shopify Partner
571 103 159

@SILVENU,

You can also lower the 3px to 1px or 2px to reduce the height. 

Ali Shahzad | Designer | Developer
- Was my reply helpful? Click Like and Accepted Solution to let me know!
- Hire me | Whatsapp +92 3486775142
SILVENU
Tourist
13 0 3

Thank you so much!!

Muhammad_Ali_S
Shopify Partner
571 103 159

@SILVENU, You're welcome. 

Ali Shahzad | Designer | Developer
- Was my reply helpful? Click Like and Accepted Solution to let me know!
- Hire me | Whatsapp +92 3486775142