Responsive Design for XenForo 1.1 [Paid] [Deleted]

[Arty]

Also apply changes from this post to scale logo: http://xenforo.com/community/threads/responsive-design-paid.39994/page-4#post-438863

and add this to responsive_extra.css to hide social tabs and style's sidebar toggle

#gfnst-2, .sidebar_toggle_container { display: none !important; }

 

[Arty]

Just realised that the ads didn't disable themselves, because I'm using bd rotating ads, and digital point ad positioning.

Put ads code inside some div, add class name to that div and use that class name to hide it same way as I showed for other elements.

 

[oman]

Put ads code inside some div, add class name to that div and use that class name to hide it same way as I showed for other elements.

By div, do you mean one of those templates like "ad_etc_etc"? Then where does the .classname go? At the end or the beginning?

 

[Arty]

In wherever you are putting ads. Your current code is like this:

<script> some stuff </script>
<script> more stuff </script>

add <div class="ad-block"> before it and </div> after it like this:

<div class="ad-block">
<script> some stuff </script>
<script> more stuff </script>
</div>

then add this to responsive_extra.css to hide block in responsive design:

.ad-block { display: none; }

 

[oman]

Ah, that makes sense. Let me try it.

 

[oman]

Acomplished!

Thank you for your support!

 

[oman]

On my forum, I've got a few posts with youtube videos. If you are on a mobile device, and view a post with one, it can break out of the boundaries. How can I make it so the youtube videos just re size on mobile devices. Tablets seem to be fine.

 

[Arty]

On my forum, I've got a few posts with youtube videos. If you are on a mobile device, and view a post with one, it can break out of the boundaries. How can I make it so the youtube videos just re size on mobile devices. Tablets seem to be fine.

Unfortunately I haven't solved that problem yet.

 

[oman]

Hi Arty,

Is there a way to allow users to toggle responsive on and off?

 

[Arty]

No. CSS does not change based on visitor id, so its not possible to show different rules for different users.

 

[Anthony Parsons]

Is there a way to allow users to toggle responsive on and off?

Actually, there is. Create a parent and child of your style. The parent (top level) is normal, then for its child, enable the add-on to make it responsive. That is simple and easy. Make all your changes to the parent, that way the child style always mimics, except it's responsive.

User 'toggle' by selecting one style, or the other.

 

[oman]

Actually, there is. Create a parent and child of your style. The parent (top level) is normal, then for its child, enable the add-on to make it responsive. That is simple and easy. Make all your changes to the parent, that way the child style always mimics, except it's responsive.

User 'toggle' by selecting one style, or the other.

Thanks!, did it.

 

[Andy.N]

Arty
Using flexile style i notice that the new post ribbon on the right seems to push the right margin a bit

 

[Arty]

You need to change right margin for it. Go to style properties -> responsive design: message layout -> new indicator (outer) -> set right margin to -5px

 

[agison]

My Admin/Mod Bar have more items than normal, this bar is not responsive so mobile version have issue with it.
Could you please help me make this reponsive?

 

[Arty]

It should split links into 2-3 lines unless you have nowrap somewhere. Inspect your moderator panel container, look for element that has white-space:nowrap in it and change it to white-space:normal;

 

[agison]

It should split links into 2-3 lines unless you have nowrap somewhere. Inspect your moderator panel container, look for element that has white-space:nowrap in it and change it to white-space:normal;

Thank you.
Next issue:

Scroll feature of Jump menu popup (on breadcrumb) doesn't work on Android OS.
iOS is fine.

 

[Arty]

I have tested it on all browsers on Android phone, it works fine.

There is no logical reason for it not to work.

 

[agison]

Tested again on your forum & quantnet.com with my Google Nexus 7 (Chrome). Both have same issue.
When I scroll down on forum list, it doesn't. The page on the background will be scrolled.

 

[Arty]

It scrolls only when it has something to scroll to. When it reaches last forum, it scrolls background. That's the default behavior in most browsers.

I think fake scrollbar might be confusing you. Most mobile browsers don't show scrollbars, so I had to fake one to show users that there is something to scroll to. It it always shown at start of forums list and doesn't move.

You can disable it in style properties -> responsive design: overlays -> uncheck "show fake scrollbar".