Header Adjustments Dawn Theme

[Lavished]

Hello, 

 Any way I can make more room in Dawn theme Mobile header to make the logo appear bigger,

I already increased the width of logo to the max with a different code.   I would like to decrease the space between the cart and search icon, also move menu hambuger  to the left more  and if possible make the announcement bar  thinner. Thank you. 

Lovedandlavished.com

pw test123

[Made4uo-Ribe · Accepted solution]

Hi @Lavished 

Try this one. 

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes"
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "theme. Liquid" file. Find the </body> tag and paste the code below before the tag. 

<style>
@media only screen and (max-width: 749px){
.header__icon--cart {
    margin-right: 0 !important;
}
.header__icons {
    margin-right: -1.2rem !important;
}

header.header {
    padding-left: 6px;
    padding-right: 6px;
}

.header__search {
    margin-right: -1.4rem;
}
}
</style>

• And Save. 
• Result:
• 

Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better! 

[DaisyVo]

Hi @Lavished 

To complete your requests, please follow these steps:

1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
2. Paste the code provided into the Custom CSS section.

@media screen and (max-width: 768px){
header.header {
    padding-left: 10px !important;
}
summary.header__icon.header__icon--search > span {
    width: fit-content !important;
}
summary.header__icon.header__icon--search > span > span.svg-wrapper:nth-child(1) {
    width: unset !important;
}
summary.header__icon.header__icon--search {
    width: fit-content !important;
}
}

Here is the result: 

I hope this helps

Best,

Daisy

[Made4uo-Ribe]

Welcome! Would you mind hitting 'like' as well? Thanks!

[Lavished]

I didn't realized it caused a problem , or maybe something else did it, but now my mobile page toggles from side to side, right to left vice versa. 😞

[Lavished]

when I deleted the code the problem went away once I added it again the problem returned,- thank you.