Solved

Can't find specific block of code in shopify CSS file (theme.css.liquid)

MissMallen
Visitor
1 0 1

Hey. I am looking to change something in the CSS file (theme.css.liquid), but in the thousands of lines of code and the different searches I've tried, I haven't been able to find the specific block of code I need.

In Inspect Element in my browser, it looks like this:

.site-nav__link, .mobile-nav__link--top-level { text-transform: uppercase; letter-spacing: 0.2em; }

I want to change something in here, but I can't find this in the CSS file.
Does anyone know how to find it so I can add some lines of code? Thanks in advance for all replies.

Accepted Solution (1)

dmwwebartisan
Shopify Partner
12280 2546 3694

This is an accepted solution.

@MissMallen 

If you want to add lines in the same css class then at the bottom of your css file add the same class again ( don't need to find)

.site-nav__link, .mobile-nav__link--top-level {
Add your lines here...
}

 

Note: If you want to change with existing properties or values then do the following. For example, you would like to change letter spacing from 0.2em to 0.3em. It should be like the following.

.site-nav__link, .mobile-nav__link--top-level { 
letter-spacing: 0.3em !important;
}

"Important" here if you overwrite existing line's values.

Hope this helps.

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 | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Reply 1 (1)

dmwwebartisan
Shopify Partner
12280 2546 3694

This is an accepted solution.

@MissMallen 

If you want to add lines in the same css class then at the bottom of your css file add the same class again ( don't need to find)

.site-nav__link, .mobile-nav__link--top-level {
Add your lines here...
}

 

Note: If you want to change with existing properties or values then do the following. For example, you would like to change letter spacing from 0.2em to 0.3em. It should be like the following.

.site-nav__link, .mobile-nav__link--top-level { 
letter-spacing: 0.3em !important;
}

"Important" here if you overwrite existing line's values.

Hope this helps.

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 | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app