Making a site UN- Responsive


(Jimmy Chainey) #1

Hi Everyone.

Is there aa way of stopping the SPLIT theme from being responsive to different browser widths? I just want it to be set to full view - rather than shrinking and changing the nav bar and general format as it looks poor.

Any ideas on how I would code this in? @Oscar @yuzool - feel like this is one for you guys!!


(Robert Ziebol 🖖🏼) #2

Short answer, no. Long answer, if a theme is made to be responsive, no bit of css (at least none that I know of) will make it static.


(Brad Halstead) #3

@JimmyChainey

Beyond my area of expertise, but simply changing the body tag to be a fixed width won’t do it. There is a lot of CSS in the Theme to make it responsive and do it’s magic. The Theme would require extensive reworking to make it fixed width only.

I’m sure that @yuzool would gladly do it should you file a request through the support system, but that would fall under custom work and be billable.

Just Read @zeebe’s response (thanks Robert). I would have to concur unless @oscar has some severe magic up his sleeve :slight_smile:

Brad


(Jannis from inStacks Software) #4

Is there a reason you want to do that?


(Oscar Schmid) #5

I also asked me/you.
Choose another theme (for example HV Foton) or a not responsive theme.
The full view of what, of the header or the content?
With Split you have always the full view (of the header, but not of the content, that’s right) and on small screens it does not make sense to have a not responsive nav bar.

No, no magic here :wink:


(Jimmy Chainey) #6

I think you are right @Oscar… I have had a change of heart!

I think I just need to make the site work for both mobile and pc viewing. This is where I may need your help, I am trying to figure out how to get the responsive mobile nav bar to align text to the right, so that the Logo is visable? And then have the logo ‘on top’ of all the other layers so that it can be seen.

Any Ideas on how I format the mobile/responsive nav bar?? I have attached some images to help :slight_smile:



(Jimmy Chainey) #7

It just looks really bad on mobile viewing.

I have sent another reply on my thread which explains my reasons and there may be a solution if any of you guys can help?


(Oscar Schmid) #8

With this code you have the logo “on-top”

.main-nav ul.is-visible { z-index:-100; }

But the menu text centered or right, I don’t have a solution, until now.


(Stuart) #9

Hi,

.main-nav {
    text-align: right;
}

Should do it for both ‘right’ and ‘center’. Center looks best though, in my view. OP wanted this so that the logo is visible, I think? Would need to see an example (not a screen capture, a URL) of the logo not being visible in responsive menu to say anything about that.


(Oscar Schmid) #10

Thanks!
Right is not very nice, but center do it perfect.

The logo is with my code “visible”, now. It was hidden behind the smartphone menu.


(Jimmy Chainey) #11

I agree - you and @kryten are absolutely amazing. Thanks for all your help!

Center looks excellent, as does having the logo visable!


(Jimmy Chainey) #12

@Oscar @kryten - it’s a little weird that you cant just do

.main-nav {
background-opacity: 50%;
}

would have thought that would change the opacity and make it a bit see through? What am i doing wrong?


(Oscar Schmid) #13

With this code, your smartphone menu is with opacity.
You can change the values. Attention, the menu text has the same opacity … and now, you can see title and slogan!

ul.is-visible { opacity: 0.6; }


(Michael Frankland) #14

Amazing what you lot get up to - very impressed :slight_smile:
@Turtle @kryten @Oscar @JimmyChainey