Shopify themes, liquid, logos, and UX
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.
Solved! Go to the solution
This is an accepted solution.
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!
This is an accepted solution.
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!
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024