How can I adjust social media icon size in the Dawn theme?

Solved

How can I adjust social media icon size in the Dawn theme?

timbowes
Tourist
13 1 3

I have looked at multiple answers and really struggle to understand we are wanting to change our facebook and insta logos to a bigger size is says to go to asset and ->/component-list-social.css-> but this isn't showing up in my coding any help would be greatly appreciated

Accepted Solution (1)

PageFly-Victor
Shopify Partner
7865 1785 3101

This is an accepted solution.

Hi @timbowes ,

 

This is Victor from PageFly - Landing Page Builder App.

 

You can try this code by following these steps: 

  • Go to Online Store->Theme->Edit code
  • Asset->theme.css 
  • Paste the below code at the bottom of the file

 

.social-media-links.flex.items-center.px-2 svg {

   width: 32px !important;
   height: 25px !important;
}

 

 

PageFlyVictor_0-1671074939237.png

 

Hope my solution works perfectly for you!

Regards,

Victor | PageFly

View solution in original post

Replies 5 (5)

GemPages
Shopify Partner
5625 1261 1243

Hello @timbowes ,

 

It's GemPages support team and glad to support you today.

 

Could you please share your store URL ( with the password if your store password is enabled ) then I can see and suggest something for you?

 

Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
timbowes
Tourist
13 1 3
KetanKumar
Shopify Partner
37094 3645 12053

@timbowes 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

.social-media-links {
    padding: 0px 20px;
}
.social-media-links svg {
    width: 24px;
    height: 24px;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on [email protected] regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
GemPages
Shopify Partner
5625 1261 1243

Hello @timbowes ,

 

I would like to give you the recommendation to support you so kindly follow the steps below:

 

1. Go to Online Store > Theme > Edit code of your current theme

GemPages_0-1671078610518.png


2. Open your theme.liquid theme file


3. Paste the below code before </head>

<style>
.sf-topbar .sf__topbar-inner .social-media-links svg {
  width: 22px;
  height: 22px;
}
</style>

 

For example,

GemPages_1-1671078769403.png

 

If you require any further information, feel free to contact me.

 

Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

PageFly-Victor
Shopify Partner
7865 1785 3101

This is an accepted solution.

Hi @timbowes ,

 

This is Victor from PageFly - Landing Page Builder App.

 

You can try this code by following these steps: 

  • Go to Online Store->Theme->Edit code
  • Asset->theme.css 
  • Paste the below code at the bottom of the file

 

.social-media-links.flex.items-center.px-2 svg {

   width: 32px !important;
   height: 25px !important;
}

 

 

PageFlyVictor_0-1671074939237.png

 

Hope my solution works perfectly for you!

Regards,

Victor | PageFly