This topic has 2 voices, contains 7 replies, and was last updated by  TB Support 2773 days ago.

Mobile: Header margin/menu padding/thumbnail blur/boxed style

ThemeBurn Support › Forums › OpenCart Themes › Shoppica OpenCart Theme › Mobile: Header margin/menu padding/thumbnail blur/boxed style

This topic has been marked as resolved.

Hi, have some questions about mobile version.

1) how to add margin between header and slider in mobile version, and do not change PC version.
Check pic. 3 (iphone 5) and pic. 4 (iphone 6 plus)

2) how to add padding in mobile menu when pointing the link?
Check pic. 1

3) image thumbnails are blured at some pages (check the mobile version).
category page: http://myvesper.ru/stingray-bracelets
– thumbnails of subcategory are blured
– thumbnails of items are blured

But thumbnail on the product page is OK.

I know that i should correctly set the image sizies in the theme builder, but have tried lots of variations and nothing was well done.
The image size of uploaded picture is 700x525px.

4) Can i make just the mobile site non-boxed?
The PC boxed version is ok, but on the mobile version it is so many unused space on the left and right.
 duo7gfkg
September 7, 2016 at 2:28 pm #50750

What about this auestions?
 duo7gfkg
September 9, 2016 at 2:38 pm #50804

why don`t you answer? You are writting in the other topics, but mine is set aside :(

 duo7gfkg
September 12, 2016 at 10:23 am #50877
You will need to register in order to post topics and read replies in the ThemeBurn.com support forums!

P.S. Bumping a topic is not a very good idea in order to get your problem solved. It just goes at end of the support queue as we resolve older problems first.

BR,
ThemeBurn team
 TB Support
September 13, 2016 at 12:40 am #50885

Hi, Thanks for that.

1) I have need to add margin just for mobiles. I have solved the problem with custom css


@media (max-width: 768px) {
  #header {
    padding-bottom: 30px !important;
  }
}

2) your method works but only with link, not with toggles

i managed the problem with this code


@media only screen and (max-width: 767px){
  .nav-responsive > li > a > span {
    padding-left: 14px !important;
  }
}

4) Works every where instead of home page. The right margin is remained. It could be seen when zoom out with fingers on touch screen
 duo7gfkg
September 15, 2016 at 6:32 pm #50966

Hi,

Here is some additional CSS that will remove the right margin:

@media (max-width: 768px) {
  html {
    overflow-x: hidden;
  }
}

BR,
ThemeBurn team
 TB Support
September 21, 2016 at 6:29 pm #51194

Thanks for help. It works good now.
 duo7gfkg
September 21, 2016 at 6:56 pm #51210

Glad we’ve helped.

BR,
ThemeBurn team
 TB Support
September 21, 2016 at 10:17 pm #51218
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.