How do I change the size of the social icons on mobile and desktop

Solved
Emurph35
Excursionist
36 0 13

Hi 

Please can some one help me with the resizing of the instagram icon. On mobile it appears to large, then on desktop it is far too small as per below Images:

74F14E62-7B6E-4B49-951B-4629C3A89414.png8453361F-3F5B-49B3-93AD-5B24B9AF906A.png

 

URL is https://now-lashes.myshopify.com/. Password is Thoffo 

 

Thank you

Pallavi
Shopify Expert
2354 394 508

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

 

@media only screen and (min-width: 750px)
.social-icons .icon {
width: 30px!important;
height: 30px!important;
}

.social-icons .icon {
width: 30px!important;
height: 30px!important;
}

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
dmwwebartisan
Shopify Partner
8395 1969 2649

This is an accepted solution.

@Emurph35 

Please add the following code at the bottom of your assets/theme.css file.

@media only screen and (min-width: 750px){
.social-icons .icon { width: 25px !important; height: 25px !important; }
}

@media only screen and (max-width: 749px){
.social-icons .icon { width: 30px !important; height: 30px !important; }
}

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes