Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Larger (more visible) logo and more space for long email address on the top of the site, ONLY in the MOBILE VERSION.

Featured Lock Resolved Task
Hello, I would need to know how to increase the size of the site's logo in the mobile version and increase the space, in the upper right, to insert an email address longer than the default one. The result I would like to get is the one shown in the picture. Thank you for your precious information.
Larger (more visible) logo only in the Mobile version.

RevibeBigLogoMobile.jpg

Attachments (1)

  • RevibeBigLogoMobile.jpg
    RevibeBigLogoMobile.jpg 294.5 KB

4 Answers

Sifat - Staff

More than a month ago #Permalink
Hi,
Thanks for your queries.
1) Sorry there is no default feature to change the logo width in mobile view. Since they are generated automatically. Also if you increase the width of the logo the height will increase as well. You can check this css to check.

@media only screen and (max-width: 425px) {
#sp-logo .logo {
width: 200px !important;
}
}


2) If you use a larger email address then the address will go in bottom line. You can use this css to get them in same line.

@media only screen and (max-width: 425px) {
.sp-contact-email {
display: flex !important;
align-items: center !important;
}
}



-Best Regards

promaster

More than a month ago #Permalink
Hello, I understood how to make the logo of the site bigger and therefore more visible in the mobile version. In the layout of the template you must set the class "col-xs-8" on the logo setting to have a width of 66.66% and the "colxs-4" class to have a width of 33.33% on the position of the template where the mobile menu will appear.
That's all!

BigLogoMobile.png

Attachments (1)

  • BigLogoMobile.png
    BigLogoMobile.png 80.1 KB

promaster

More than a month ago #Permalink
Hello, I also understood how to increase the space to allocate emails longer than the default one.
By setting the css classes "col-sx-5" and "col-sx-7" for mobile devices respectively, you get a width of 41.66% for social icons and 58.33% for email addresses, but if you want they can also choose the classes that best fit the width of your email address.
Thanks a lot for the collaboration!

longEmail_01.jpg

Attachments (1)

  • longEmail_01.jpg
    longEmail_01.jpg 179 KB

Sifat - Staff

More than a month ago #Permalink
Great to know you've solved your issue.

-Best Regards


There are no replies made for this post yet.
However, you are not allowed to reply to this post.

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 105
Sifat

Sifat

Total Accepted Answers: 104
Toufiq

Toufiq

Total Accepted Answers: 37
Pavel

Pavel

Total Accepted Answers: 4
J

johnny

Total Accepted Answers: 3

100+

Templates

200,000+

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us