Software Update [AUG/2020]

#31
stryder Offline
Okay I had another look at the image and realised that it might not have been an old cache, what it might actually be is down to "Media Queries". Originally webpages would be build for standard browsers on pc's, however along came phones and they tend to have a lot smaller screens. So this meant webdevelopers had to work out how to build site to cover both PC's and phones. (Originally it would of been duplicating information into WAP pages, luckily things have moved on)

One technique is called "Responsive", it still means all the desktop clutter exists in the page, but there are various changes done at specific screen-sized intervals through media queries. I set some up to remove some of the elements that take up a lot of room so as to make things fit better on smaller screens. I set my step from Desktop to mobile at 420px's wide, however it could well be possible that your phone was just a little wider than 420px's so it was showing the desktop version without the mobile trimmings.

I've increased the "window" to 490px's, I'd assume the phone is smaller than that (but I honestly couldn't say). In any event if your screensize is smaller than that, it should show the chopped down version which hopefully will fit properly

Sorry for the breakage. I don't intend to do more development on the live site, I'll work on things elsewhere (lesson learned) now it's just getting it back to working.
Reply
#32
C C Offline
This mobile viewer below still shows thread pages being cut-off halfway or partially. Though perhaps(???) not for the home or opening page of the forum (literally difficult for me to tell).  But have no idea if it reflects anything of how an iPhone slash Safari browser is rendering things. Insane tool requires going through a CAPTCHA challenge every time you use it.

https://search.google.com/test/mobile-friendly

I PM'ed the member who was having the same problems as SS for some feedback. Tried some Firefox extensions that claimed to produce the mobile views of iPhone, but they seem to be completely useless -- just rendered an unaltered full screen appearance of a laptop or desktop.
Reply
#33
Syne Offline
The forum looks fine on my Android, using Opera, in both mobile and desktop mode.
Reply
#34
C C Offline
Report from the other Scivillage member:

"...the composition window for writing this message is about a half inch wide. But it's not dropping any characters off to the side. I definitely notice a difference. The composition window used to expand to the right, simultaneously expanding the previous messages' panes, but tending to truncate some of the rightmost text.

All the text is showing now at least. And the send message and preview options are solidly showing now.

Now after previewing, it's back to like it was last time. I have to write a bit more to get the send message button to come back on the bottom left. I hit preview but had a lot of truncation. So I hit a smiley, which brought the composition window back.
"

(Aug 30, 2020 07:35 PM)Syne Wrote: The forum looks fine on my Android, using Opera, in both mobile and desktop mode.

I'm using Opera right now. Probably the only time I've ever used the browser that comes with an OS or what the latter promotes was with a Linux distro (i.e., Firefox).
Reply
#35
stryder Offline
I can see there might be some issues with the Private Message system currently. I've not done anything to that yet, so that's the standard default template. I can see that when the width is about 320px's that the box you type in is tiny. I'll see what I can do about making that a little more useful for phones. (although I work on that off site, since it tends to cause all sorts of upsets in regards to browser caches etc.)

The main problem is the forum software and templates were originally made back sometime back before phones got so used, so they were never designed with phones in mind. It will take some time to bring them into line with something that works on both, however I can only use the emulated responsive testing as opposed to actual testing so only those using the actual devices can tell me when something's out of place.

I can see that the tables etc are going to need formatting. It seems the Index is pretty close to how it should be, The subforum thread list is still in tabled mode so it doesn't condense into a format that people can use and the actual posts on a thread still seem to have differences depending on browser. My desktop sees it fine, in fact I can't get it to see it the way that other people see it.

I'll keep chipping away at it until I hopefully solve the issue.



Just found yet another potential for why Seculars image looked like it did. In the update I did to the template I used inline-grid div elements with a value of "grid-template-columns: 150px auto;" the problem there is the 150px set the first column to that width and the auto was suppose to "flex" the other column into the remainder. It appears for some reason that although the 150px stayed put, it didn't flex the other column but instead misaligned it and overflowed it. I've changed the grid-template-columns to a new setting it's now "grid-template-columns: 1fr 11fr;" ... Thats 1/12th flexible row position for the first column, and the other column equals 11/12ths. This means that the 150px fixed limit has been removed and hopefully it will now flex properly for the browsers that couldn't handle the other way.
Reply
#36
stryder Offline
(Aug 30, 2020 04:49 PM)C C Wrote: This mobile viewer below still shows thread pages being cut-off halfway or partially. Though perhaps(???) not for the home or opening page of the forum (literally difficult for me to tell).  But have no idea if it reflects anything of how an iPhone slash Safari browser is rendering things. Insane tool requires going through a CAPTCHA challenge every time you use it.

https://search.google.com/test/mobile-friendly

I PM'ed the member who was having the same problems as SS for some feedback. Tried some Firefox extensions that claimed to produce the mobile views of iPhone, but they seem to be completely useless -- just rendered an unaltered full screen appearance of a laptop or desktop.


I found that if you search the site you get it using Googles Cache, which means if you are trying to make some adjustments and reload, they won't show if using the URL. however if you enter the raw HTML in the code area (rather than using the URL) you can bypass their Cache and see what the adjustment looks like.

It looks like using the flex rows format is the fix from this perspective (although I'm not sure if 4K screens can handle it well. I need to look at reworking the dataflow to use the screens fully) , however I've still got to work on handling table entries throughout the forum and develop some buttons for those navigation links for people with stubby fingers on phones (I'm generalising, I don't know if phoneusers have stubby fingers)
Reply
#37
stryder Offline
It's going to take a while to do but I'm currently looking on a complete forum re-skin so phones will be covered.  I'm also trying to integrate considerations for color-blind as well.

When done the number of subsequent colors that the forums use will be reduced (although opacity and shading will still increase the number shown), so the forums will indeed look a lot different. I'm going to keep the main site colouration as blue considering that the difference between colourblind people tends to have less of a leap in regards to blues.  (from blue to teal to turquoise) vs yellows to pinks or yellows to reds becoming all yellows etc. 

I will also try to make sure that if there is any indicators like "Forum has new posts" or Forum has no new posts" uses an inversion of monochrome/greyscale values.  So the "new posts" can be coloured, and the "no new posts" shows the inverted greyscale. (obviously will require the right background)

Furthermore the site will be using CSS var's, what this means?  Well it means that deep within the belly of the CSS beast there will be a number of lines within :root{}  those lines will look like "--mc-bg-dk-stat:#555555;"  those "vars" are going to be transplanted throughout the whole CSS and template so that changing that one instance it root will actually change all the places that use it to the new color. 

What this will mean is the ability to create locally customised "root" colors to replace on the site, so if something isn't colored right it can be fixed.  (being English and using the US version of colour interchangeably get awkward lol)

Incidentally for those of you colourblind there is a an app called Color Blind Pal you might want to look into if you've a smartphone, apparently it can reshade or hash what it sees through the finder, so you can see the world with better clarity.
Reply
#38
Syne Offline
(Sep 1, 2020 11:42 AM)stryder Wrote: "new posts"

This sort of text coloring is very hard to read for the color blind, even on desktop. Might be that the colors have too low of saturation to stand out from the background.
Reply
#39
stryder Offline
(Sep 1, 2020 05:28 PM)Syne Wrote:
(Sep 1, 2020 11:42 AM)stryder Wrote: "new posts"

This sort of text coloring is very hard to read for the color blind, even on desktop. Might be that the colors have too low of saturation to stand out from the background.

Indeed they would be too hard on them. The actual usage of that was to show more of the colours that could be user together. The actual usage is based on something I did with a square image, the corners were red and they migrated to yellow in the middle, so the effect was a bit like a cross. The usage of a spectrum of colors is the intention that on "new Posts" being present at least part of that spectrum will be recognisable by someone who's colour blind as an indicator.

Originally I used a greyscale version of the very same pattern to signify that there was no posts, but I realised that those with a monochrome condition won't be able to distinguish between the coloured variant or the greyscale. Which is why the greyscale version needs to "Inverse" or "polarise" itself to stand out as different.
(I apologise for the confusion in my original explaination)
Reply


Possibly Related Threads…
Thread Author Replies Views Last Post
  Software Update [AUG/2019] stryder 6 341 Aug 6, 2019 11:40 PM
Last Post: Syne
  Software Update [AUG/2018] stryder 11 1,967 Aug 30, 2018 04:29 AM
Last Post: stryder
  Software Update [OCT/2017] stryder 31 2,006 Dec 13, 2017 03:19 AM
Last Post: stryder
  Software Update [DEC/2017] stryder 0 333 Dec 1, 2017 04:36 PM
Last Post: stryder
Exclamation Software Update [APR/2017] stryder 2 484 Apr 8, 2017 03:14 PM
Last Post: elte
  Your software sucks magickal realist 6 1,154 Dec 27, 2016 03:13 AM
Last Post: Yazata
  Software Update [OCT/2016] stryder 3 549 Oct 30, 2016 03:35 PM
Last Post: stryder



Users browsing this thread: 1 Guest(s)