Re: Mobile version is not to scale (Dawn theme)

Solved

Mobile version is not to scale (Dawn theme)

Gee3
Excursionist
26 0 1

Hi, 

 

I've noticed that the mobile version of my website is not to scale. 

 

- My header icons are cut off

- The table in delivery information is not mobile-friendly 

-  Even some headers and descriptions on the product page are too large

 

 https://tiliano.co.uk/?_ab=0&_fd=0&_sc=1

P/w: Debut23

 

Thanks so much

Accepted Solution (1)

laddisahsi
Shopify Partner
385 38 41

This is an accepted solution.

Hi @Gee3 

You can follow the following steps:

1. Please go to the Online Store
2. Then Edit Code
3. Please find the theme.liquid file
4. Before end of </head> Please add following code.

<style>
@media only screen and (max-width: 600px) {
header-drawer {
    margin-left: 0px !important;
}
}
</style>

 

laddisahsi_0-1697451680265.png

 

 

If this solution is worked, then please Like this and Mark this as accepted solution!


Laddi

-Shopify website development, Theme & App Development
-Contact me: WhatsApp


-Email Me
-If this solution is worked, then please Like this and Mark this as accepted solution!

View solution in original post

Replies 10 (10)

laddisahsi
Shopify Partner
385 38 41

This is an accepted solution.

Hi @Gee3 

You can follow the following steps:

1. Please go to the Online Store
2. Then Edit Code
3. Please find the theme.liquid file
4. Before end of </head> Please add following code.

<style>
@media only screen and (max-width: 600px) {
header-drawer {
    margin-left: 0px !important;
}
}
</style>

 

laddisahsi_0-1697451680265.png

 

 

If this solution is worked, then please Like this and Mark this as accepted solution!


Laddi

-Shopify website development, Theme & App Development
-Contact me: WhatsApp


-Email Me
-If this solution is worked, then please Like this and Mark this as accepted solution!
Gee3
Excursionist
26 0 1

Thank you, it worked! 

 

Please also help me with the table on Domestic Delivery it is too large. The heading is also too large. 

 

Also, the description on the product page is too big.

 

laddisahsi
Shopify Partner
385 38 41

@Gee3 

Please use this css

@media only screen and (max-width: 600px) {
.accordion__content p {
    font-size: 12px !important;
}
}

 

laddisahsi_0-1697452330312.png



If this solution is worked, then please Like this and Mark this as accepted solution!


Laddi

-Shopify website development, Theme & App Development
-Contact me: WhatsApp


-Email Me
-If this solution is worked, then please Like this and Mark this as accepted solution!
Gee3
Excursionist
26 0 1

Thank you so much! 

 

Is there any way to reduce the size of the table on domestic delivery?

laddisahsi
Shopify Partner
385 38 41

@Gee3 
Inline width working 

Can't do anything

laddisahsi_0-1697452882475.png

 

If this solution is worked, then please Like this and Mark this as accepted solution!


Laddi

-Shopify website development, Theme & App Development
-Contact me: WhatsApp


-Email Me
-If this solution is worked, then please Like this and Mark this as accepted solution!
Gee3
Excursionist
26 0 1

Thank you for your help!

laddisahsi
Shopify Partner
385 38 41

@Gee3 


Can you please like and accept the solution?

-Shopify website development, Theme & App Development
-Contact me: WhatsApp


-Email Me
-If this solution is worked, then please Like this and Mark this as accepted solution!
Gee3
Excursionist
26 0 1

Apologies, one more request. 

 

Would you be able to resize the button in the header 'shop now'

laddisahsi
Shopify Partner
385 38 41

@Gee3 

@media only screen and (max-width: 600px) {
a.button.button--primary {
    min-width: 0rem !important;
}
}

 

use this css

laddisahsi_0-1697453618080.png

 



If this solution is worked, then please Like this and Mark this as accepted solution!


Laddi

-Shopify website development, Theme & App Development
-Contact me: WhatsApp


-Email Me
-If this solution is worked, then please Like this and Mark this as accepted solution!
Gee3
Excursionist
26 0 1

Thank you so much!