Change Logo Text Size on Mobile

arcentoni

Hey there!

I'm not using an uploaded logo image since I like the way the basic text logo displays in general. However, when I tried to institute a hamburger menu on mobile, my text logo is just too wide for the hamburger menu to fit on the right side of it. I would love to be able to shrink the text at my discretion until I can fit the hamburger menu nicely to the right of it. Any tips from the wizards on here?

http://adriancentoni.smugmug.com

Hikin' Mike

Add this to your Theme's Site-wide CSS section and edit the font-size to suit:

/**
* Reduce Logo Size on Mobile
************************************************/   
@media (max-width:736px) {

  .sm-user-ui .sm-page-widget-logo .sm-page-widget-logo-text.sm-page-widget-logo-s {font-size: 24px;}

}

arcentoni

Amazing! Thank you!

jonnomarshall

Hi Mike, I have tried this CSS on my own homepage as I would like a large text logo on tghe desktop site, and a scaled version of the same on the mobile site, but I cant get it to work - it doesnt seem to have any effect. Can you help please? Many thanks John. My site is www.jonnomarshall.ie