How to move all icons in the header to the right side? DAWN THEME

Store Design
1

In the main header, there are 3 icons such as search, account, and cart, and they are all in their respective places, but what I want is to align them all in a horizontal way to the right side of the header,

Please refer the picture down below for clarification

Capture.PNG
Capture.PNG1080×804 448 KB

URL: Test – Abbasi (theabbasiandsons.myshopify.com)

Password: testingpage

2

in base.css there css for hideing right side search

@media screen and (min-width: 990px){

.header:not(.header–top-center)>.header__search, .header–top-center *>.header__search { display: none;

}
remove this class (, .header–top-center *>.header__search) from that only
and make comment for to left side search or you can hide from css

screenshot-theabbasiandsons.myshopify.com-2022.08.14-17_24_21.png
screenshot-theabbasiandsons.myshopify.com-2022.08.14-17_24_21.png1917×836 149 KB

3

Hi, @justauser

You can try this code

  1. Go to Online Store-> Theme->Edit code
  2. Asset-> base.css ->paste the below code at the bottom of the file.
@media(min-width:989px){
.header--top-center *>.header__search{
  display: block !important;
}
 .header--top-center>.header__search{
 display:none !important;
 }
 .header--top-center {
    grid-template-areas: "heading  heading heading"
"header__search navigation icons";
}
 }
2 Likes
4

A B.jpg
A B.jpg1920×1080 106 KB

Hi @Sphurti Thank you for your reply, but is there a way to lower it and align it in the same level as the menu bars as shown in the picture B

1 Like
5

@Ahsan_ANC worked like a charm! thank you so much.

if so happens if you need anything done with AI or data analysis I am up for you!

Thank you again