For mobile users, I have just added a "first beta" Advanced Forum Statistics to the home page on mobile using CSS overflow:auto; so you can swipe if you need to see more. Google Search Console mobile usability says this page is "mobile friendly" so perhaps this will be useful for some of our mobile users:
1 Like
Added some basic Bootstrap classes to the mobile stats:
Normal mode:
Landscape mode:
Scrolling / swiping left and right with normal phone swiping gestures on mobile.....
Note: I may convert this very old legacy HTML code from table elements to div elements sometime in the future and, at that time, will change the layout for the three sections from a horizontal row of three tables in a table row to vertical stack of three div elements.
2 Likes
Thanks Akshay,
I added that little swipe gesture icon as an afterthought when I was finishing up the formatting.
The stats seems to add a lot to the mobile home page, for sure.
One issue I noticed while posting screenshot now. I had to switch to desktop view to see advanced options to add attachments.
Probably iframe modal would be nice.
1 Like
Good idea.
I will put that on the TODO list to port the attachment uploading modal from the desktop to mobile.
I also plan more CSS formatting changes to mobile and other mobile code optimizations.
Thanks again, Akshay!
Hi if you wrap forums like operating systems, top forums inside bootstrap panels ( card class in bootstrap 4 ) would look even better.
1 Like
Good idea!
I was thinking along the same line this morning.
Do you have a favorite Bootstrap class or will any card class do?
Normal simple card header, and body would be nice or in future we can allow user to set preference like primary, warning, success etc classes to cards.
Here is link collapsable card
Card collapse tricks!
Probably status of card can be stored in local storage, so that user visits next time, previous status of card can be restored ( whether card was expanded or not in specific forum)
1 Like
I like the idea of converting various content blocks to Bootstrap card classes.
Will work on this as I have time.
Good idea, Akshay!
Hey Akshay,
Did not implement anything fancy yet, because all the mobile CSS needs to be redesigned (and the inline CSS moved to external files, etc.)
However, in the meantime, I did wrap a bunch of content with the most basic Bootstrap card classes and adjusted some margins, rounded out some title blocks with the rounded class, etc.
When I did the original mobile CSS, I was in a huge time crunch and had not implemented a single Bootstrap class at the time, so we need to go back and redesign all the mobile CSS with Bootstrap, and clean up the CSS mess on mobile.
I agree that, in the meantime, mod_pagespeed helps.
Thanks Again!
1 Like
Happy to know that pagespeed helping, I understand rewriting theme would take time, also testing on cross browser and devices. I think bootstrap affix plug-in can be used to top header navigation to hide the forum title say user scrolls more than 30px or height of navigation bar.
Here is demo : Bootply snippet - Bootstrap Top Header, Affix Nav, Bottom Footer
Hi Akshay,
I think it is a matter of personal choice to toggle-hide the mobile header or not based on scroll position so will not be addressing or changing this anytime soon.
Honestly, I do not see this is a priority at this time and have a lot more important things I need to do.
Also, the link you provided did not provide any useful information that I could see. There was no code to download and so I did not find anything of interest at that link, to be totally honest (maybe because I viewed it on my desktop). Anyway, I have no idea what that site is or what that link is supposed to show me; other than it it has a big "sign up form" on the bottom... .
Since you have access to the source code and Chrome dev tools, and you know how to use them, it would have been helpful if you had of provided a piece of Javascript instead and said "could try this JS code to hide the navbar based on scroll position"...... that would have been helpful in this case
I always think this approach is better regarding formatting suggestions for site..... just provide the suggestion "in working easy to cut-and-paste into our site code".... which saves me a lot of time. I am pretty sure you can do that Right?
Please keep in mind I am not trying to be demotivating by my reply above; but if you get into the habit of posting "Neo please do this" and "Neo please do that" without providing working code, I will reply like this over and over; as there is not shortage of ideas; but what I need is people to open their web dev tools, look at the source, and provide working code (CSS, Javascript, jQuery) and not just "Neo, please do this and that" suggestions for the site.
Thanks for understanding!
1 Like
Moderator comments were removed during original forum migration.
This is now obsolete now that we have moved to Discourse.
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.