Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Navigation menu drawer

How can I make my Dawn theme navigation drawer less transparent?

naydeam
Visitor
3 0 0

Hi!

 

I'm using the Dawn theme with a transparent header and I noticed that it also kind of turned the navigation menu drawer transparent too... it shows just when I scroll down on page. Other wise, the drawer opens and I can see that navigation is there but is kind of white/transparent. Is there any code that can help me with that? I want it to be visible even when the header is transparent.

Replies 4 (4)

Dan-From-Ryviu
Shopify Partner
10261 2039 2110

Hi @naydeam 

Could you share your store URL?

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

naydeam
Visitor
3 0 0

Yes. 

 

It's naydeam.shop

Dan-From-Ryviu
Shopify Partner
10261 2039 2110

Please add this code to theme.liquid file, after <head> and save file 

<style>
header.header.header--middle-center.header--mobile-center.page-width.drawer-menu.header--has-menu.header--has-social.header--has-account.transparent * {
color: #fff;
}
</style>

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

Anshul_arora
Navigator
453 128 100

Hello @naydeam ,

I understand you are looking to make changes in your menu drawer icon, so it will be visible with the transparent header.

Please add the below mentioned code in your theme.liquid file before </body> tag and save.

<style>

.header__icon span {
color: rgb(249 63 1);
}

a.header__icon.header__icon--account.link.focus-inset.small-hide {
color: rgb(249 63 1);
}

a#cart-icon-bubble {
color: rgb(249 63 1);
}

</style>

Output will look like this ->

Anshul_arora_0-1712043769665.png

 

I hope the solution helps you.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here