MOTION THEME - Side Menu drawer - How to change text styling?

Solved
lion_no
Explorer
58 6 19

Trying to figure out how to change the design on the side menu drawer, and it seems like all settings under "Typography" are ignored when using the "Drawer" option.

This is how it currently looks like:

lion_no_0-1634732137176.png

 

I'd like to change the font, text size, letter spacing, line height of this text - as it doesn't appear to be an option in the GUI.
(Might need a separate option for mobile and desktop)

Additionally, if possible (since there's lots of room on the top of the menu, add logo to it?

Here's a preview link
 https://t8n43rstgq4tsegu-50647859379.shopifypreview.com/

Accepted Solution (1)
suyash1
Shopify Partner
8328 1032 1366

This is an accepted solution.

@lion_no- add all this css

@media only screen and (min-width:590px){
.mobile-nav__item .mobile-nav__faux-link, .mobile-nav__item a:not(.megamenu__promo-link) {
    font-size: 20px;}
}

 

suyash1_0-1634780395100.png

 

 

You are welcome to contact me - suyash.patankar@gmail.com, My timezone is GMT+5:30,to build shopify pages use pagefly

Support me 🙂

View solution in original post

Replies 9 (9)
dmwwebartisan
Shopify Partner
12215 2537 3661

@lion_no 

This is code customization work Contact to your theme developer OR support.

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
lion_no
Explorer
58 6 19

@dmwwebartisan I can understand that the logo might be a code customization work, but the text styling / formatting shouldn't be anything more than a code adjustment the theme.css.liquid as far as I understand? 

suyash1
Shopify Partner
8328 1032 1366

@lion_no- if you have multiple changes then you can contact me on my email and we can make changes one by one

You are welcome to contact me - suyash.patankar@gmail.com, My timezone is GMT+5:30,to build shopify pages use pagefly

Support me 🙂
lion_no
Explorer
58 6 19

@suyash1 

Changing font size is most likely enough, the rest of the options are a example of missing functions.

suyash1
Shopify Partner
8328 1032 1366

@lion_no- to change font size, please add this css to the very end of your theme.css file and check, this current code will reduce font size

@media only screen and (min-width:590px){
.mobile-nav__item .mobile-nav__faux-link{font-size: 20px;}
}
You are welcome to contact me - suyash.patankar@gmail.com, My timezone is GMT+5:30,to build shopify pages use pagefly

Support me 🙂
lion_no
Explorer
58 6 19

@suyash1 thanks, but unfortunately it didn't work for all of it 😕

lion_no_1-1634756205104.png


Both subcategories and "ACCOUNT" is still using the large font

suyash1
Shopify Partner
8328 1032 1366

This is an accepted solution.

@lion_no- add all this css

@media only screen and (min-width:590px){
.mobile-nav__item .mobile-nav__faux-link, .mobile-nav__item a:not(.megamenu__promo-link) {
    font-size: 20px;}
}

 

suyash1_0-1634780395100.png

 

 

You are welcome to contact me - suyash.patankar@gmail.com, My timezone is GMT+5:30,to build shopify pages use pagefly

Support me 🙂
lion_no
Explorer
58 6 19

That worked perfectly, thank you @suyash1! 🙂

suyash1
Shopify Partner
8328 1032 1366

@lion_no- welcome

You are welcome to contact me - suyash.patankar@gmail.com, My timezone is GMT+5:30,to build shopify pages use pagefly

Support me 🙂