Responsive Design for XenForo 1.1 [Paid] [Deleted]

K I found out what it was. It was some extra padding in my style properties of message layout.
 
How come when choosing styles, the description disappears when viewing on a mobile device or when the window is minimized on the computer?
 
I see the opposite on your forum: when viewing on desktop styles list is messed up because of this css rule
Code: 
.chooserColumns.twoColumns li {
    width: 19.4%;
}
but on mobile version it works correctly
 
Question. I use XenFacil's Footer Pie and the Google Adsense addon. On my mobile devices the sidebar button displays between the Google Adsense and the footer and the bottom of the forum lists. Also, on my iPhone I am getting a row of facebook/twitter icons across the top of the Footer Pie addon if I use the "Use Customizable Style" option in Footer Pie. If I disable that there are no facebook/twitter images shown (nor are there if I totally disable Responsive Design). Any suggestions on how to get it to not display on the iPhone and possibly move the sidebar to the bottom below Footer Pie?
Site is at http://twowheeldemon.com
 
Arty said:
To fix icons add this to responsive_extra.css
Code: 
body .footerXfSite { background-image: none; }
Sidebar can't be moved below it.
Click to expand...
Good deal... sidebar wasn't a deal breaker, but those stupid icons were. :p
Once more... THANKS!
 
Sorry if this has been asked previously.. I did skim over all 25 pages so far but didn't see anything specific. At any rate ive been having this issue since i first installed this plugin.. I have the [xfr] User Albums plugin installed with the option to show "Random images before forum list" however the responsive framework seems to push all the images (3) to the left and really makes the forum look unprofessional.. Any way to get these blocks back to center?

Id also be interested in the extra CSS required to make this block disappear altogether when the responsive framework kicks in.. I consider that block clutter on a mobile device.
 
Try adding this to extra.css
Code: 
#UserAlbums_LatestImages_Before .thumbnailHolder { max-width: auto; }
and this to responsive_extra.css
Code: 
#UserAlbums_LatestImages_Before { display: none; }
 
Arty said:
Try adding this to extra.css
Code: 
#UserAlbums_LatestImages_Before .thumbnailHolder { max-width: auto; }
Click to expand...
Hmm, the Responsive extra CSS did what it was supposed to do but, unfortunately the quoted CSS didn't make any changes that i noticed? The thumbnails are still left justified.
 
After lots of troubleshooting I would like to create a child theme of my non-responsive default theme and make that theme responsive so that it can be used with the Mobile Style Switch instead of XFMobileStop. The only problem I have at the moment is the navigation menu. It's too long. Is there a way to shorten the menu so that links are side to side instead of one row each?
 
On mobile devices or on desktop? On mobile devices menu is replaced with dropdown menu that is exact copy of normal menu and you can't really prevent items from being shown there.
 
Oh yeah.

I'll look into that after my brain rests. Is there a way to disable an addon or template in your theme when the size of the browser gets minimized at a certain point? For instance, The 8thos Bar works even when minimized.
 
Find unique class name or id used by that add-on, force display:none for it in responsive_extra.css.
 
  • Like
Reactions: DRE
Hi Arty,

I think I had this issue before, but couldn't find the fix in this thread.

How do I get the logo to align properly?. I think I had to add something to responsive extra.css?
 

Attachments

  • image.webp
    image.webp
    36.8 KB · Views: 9
You must log in or register to reply here.

Similar threads

craigForo
  • Question Question
XF 1.5 Responsive design for mobile devices
Replies
5
Views
557
rdn
R
Miner
Style Metro Theme is back - Responsive design!
Replies
15
Views
4K
Miner
Miner
Back
Top Bottom