Increase size of logo on mobile version

Technical Q&A
,
1

How can I increase the size of my logo on mobile only. I like the placement but need the logo larger.

IMG_3986
IMG_39861179×2556 304 KB

2

Hey @HyperactiveDesigns

You can either add this code in the Custom CSS option of the Header from theme editor.

@media screen and (max-width: 767px) {
.header-logo__image {
    height: 60px !important;
    width: 130px !important;
}
}

OR

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </body> tag
<style>
@media screen and (max-width: 767px) {
.header-logo__image {
    height: 60px !important;
    width: 130px !important;
}
}
</style>

RESULT:

image
image372×663 65.7 KB

Hope that helps! If it did, a Like and Marking it as Solution goes a long way and helps others find the fix faster too.

Best,
Moeed