Hi everyone!

I'm trying to customize the layout of the website www.fumatto.com for smartphone...
In the desktop mode my customer asked me for some edits, like the sidebar always showed with text, so I modified the custom.css with this:

#sidebar {
max-width: 160px !important;
box-shadow: none;
background-color:#FFF !important;
}


.background-div {padding-left:160px}


.background-div .moduletable, .base .moduletable {
padding-left: 160px;

}

but I have problems with mobile layout....

My customer wants to keep the sidebar open but smaller (small text small buttons) but i have no controls in administrator for mobile layouts...i should write some code in css just for mobile like:

@media only screen and (orientation:portrait) and (min-width:150px) {
something....
}

how should i do?


thank you

Not sure its that easy

Are you wanting the text in the menu links to display?

Cheers
Paul

sidebar not collapsed, text showed and a static image instead of fullscreen video (because resizing that exist does not work well)

I'll ask a developer but I think this be beyond on our level of support I'm afraid

I think this would require the purchase of a support block if its possible

I'll get back to you but given the holidays it will probably be next week

Cheers
Paul

hiii paul, do we got some news? can we do some test?
I don't think it is that hard to do, just if "mobile" don't collapse sidebar and show "static image.jpg" as background...

Hi

Unfortunately given the holidays and illness (me) we are a little behind

I will try and ask tonight but I think this is more complicated than just css

Cheers
Paul

ok no problem think about your health and let me know when you can

I've added this to our task list so you should here back by Friday
As Anthony is away at the moment

Cheers
Paul

no problem, really, take your time

Thanks

Hi Marco,
In the template settings you can add 0 for the collapse width. This means that the sidebar will never collapse if you also ensure that collapse is disabled for all of the panels.

Then to target the links in the sidebar you can do something like this:

@media screen and (max-width:620px) {
#sidebar li a {font-size:90%}
}

Obviously change the max width value to where you want that to kick in and the font-size to the value that makes sense for your design.

Does that do what you need?
Thanks

Hi Anthony,

this is EXACTLY what I asked for!
nice!

To fit better and to get best proportions, I modified as follow:

@media screen and (max-width:620px) {
#sidebar li a {font-size:100%}
#sidebar {
max-width: 100px !important;
}
.background-div {padding-left:100px}
}

because the background was shifted to the right of some px. now looks well.

The last two things are (i will attach two screenshots from my iphone6):

Why the video background have two black bars up and down ? and it does not play too. Can we change the background with a static image in a specific folder ? (i'm talking always as mobile user)

and why the contact fields looks justified on the right? can we move some % on the left?

Hi Marco,

I don't have access to that device - do you see the same issues on the demo site version?

bambootheme.com/showcase/mar14/

Cheers
Paul

Cheers

You can resize the window of your browser to Simulate a Mobile device, take a look to the screenshot took with firefox now on my pc

I'm wondering if the video itself might be the issue

Have you tried using the video from the demo site?



Cheers
Paul

the demo site has the same problem, iI tried resizing the browser window.

It has the two black bars up and down, but it is less disturbing because the video it's not white as mine!
mine is white, done just for the website.

Anyway I don't really care about the video on mobile, I can just put there a static image, even to save mobile data traffic.

The site seems to be offline at the moment

it was online for me, it is just you?

if you have problem you can check it here
www.downforeveryoneorjustme.com

maybe your IP was blocked for some reason, if you can't see the website again, please let me know your public IP I will put in whitelist

I'll check with the team as I still get "This web page is not available"
See if they have problems with it

Cheers
Paul

I guess your IP was banned for some reason, I can ask to unblock but I need to know what it is.
If you prefer you can send me a private message or an email.