More Odd behavior when it comes to responsive mode

Started by deansmar, July 01, 2026, 03:58:59 AM

Previous topic - Next topic

Chen Zhen


Try out RC9 ..

I fixed the cat & title bars which should function properly on Desktop & mobile.
This includes Dave's themes which showed some problems due to how their CSS dealt with links inside cat & title bars.


deansmar

Eventually I have managed to log in..
I have downloaded the RC10 version and will test it tomorrow..

Chen Zhen

I replaced it with RC11 because RC10 caused issues with SMTP emails.
Both RC9 & RC10 had the same code (altered) causing a problem which has now been removed.

deansmar

finaly loged in again..

RC11 downloaded and played with.. installed on my online Test site

from the responsive side and also the Desktop version it all looks pritty good..

i think there are a few problems on the responsive side..
1. the Board News block has overflow/display problems, removing the display: flex; it then displays OK.
2. i like the new version of the Calendar, but i think the boarders are to thick and the gap can be removed.
   
how does the "currentcolor" work..  i would have thought it picks up the theme colors, but this stays black on all the themes i have tested..

on the Desktop version in the Admin / Block List i think there are still problems with the Widths of tables..

keep up the good work..  :D

Chen Zhen


RC12 is now available

Changes:

- calendar has lighter borders
- gap for days header reduced
- fixed block list (desktop view)
- added unique background gradient for some css containers



currentColor should use the color of the parent container.
You can look it up via your search engine for more details.

The block list was messed up so I changed things up a bit to fix it.
I gave it a unique rippled page look which I'm not sure if it will be kept but at least it displays correctly.

I didn't focus on changing anything for the board news block but something I edited may have fixed it because when I went to look at it in responsive mode (simulating a 5" width), it appeard OK to me.

 

deansmar

#20
thanks for the hard work.. appriciated.. :D  :)    i will have a look later and report back..

one thing i noticed yesterday evening..
on the RC11 desktop version, the footer now has a element set to width 100% which goes outside the boarders
disableing the width element everthing is okay..

**also in the Admin -> Ehportal -> Add block
**the hole of the block table disapears of the screen..! well maybe not that bad, but it probably needs looking at..
**edit: after a quick look in RC12 this problem is solved

non of this was not there in RC6

Dave

Quote from: deansmar on August 18, 2026, 07:49:01 AMthanks for the hard work.. appriciated.. :D  :)    i will have a look later and report back..

one thing i noticed yesterday evening..
on the RC11 desktop version, the footer now has a element set to width 100% which goes outside the boarders
disableing the width element everthing is okay..

**also in the Admin -> Ehportal -> Add block
**the hole of the block table disapears of the screen..! well maybe not that bad, but it probably needs looking at..
**edit: after a quick look in RC12 this problem is solved

non of this was not there in RC6

I'm not trying to solve anything here just an observation, but have you tried using different browsers to see if they all have the same issues? I check Brave, Firefox and Chrome and on a very rare occasion I'll try Edge.

Just a thought
If you want play quizzes or games click below

deansmar

But of course Dave..  :D
I always check against other browsers..
It's just strange that the width is hardwired to the footer div..
And this problem was not there in RC6

Nothing is in the theme index.template.php or theme css

You can have a look at my online test site, with what ever browser you like..
and see the footer problem..

But it might not be a portal problem.. as the default theme is okay..
So it points me to a CripZone theme problem..  ;)

Dave

Quote from: deansmar on August 18, 2026, 11:19:00 AMBut of course Dave..  :D
I always check against other browsers..
It's just strange that the width is hardwired to the footer div..
And this problem was not there in RC6

Nothing is in the theme index.template.php or theme css

You can have a look at my online test site, with what ever browser you like..
and see the footer problem..

But it might not be a portal problem.. as the default theme is okay..
So it points me to a CripZone theme problem..  ;)

I had to ask as you didn't mention alternative browsers.

Which Theme?
If you want play quizzes or games click below

Chen Zhen

Quote from: deansmar on August 18, 2026, 11:19:00 AMBut of course Dave..  :D
I always check against other browsers..
It's just strange that the width is hardwired to the footer div..
And this problem was not there in RC6

Nothing is in the theme index.template.php or theme css

You can have a look at my online test site, with what ever browser you like..
and see the footer problem..

But it might not be a portal problem.. as the default theme is okay..
So it points me to a CripZone theme problem..  ;)

The "#footer" shouldn't be within the "#footerfix" div but it appears to be that way on the whitebox theme that you're using on your website. Since that's a Crip theme, perhaps Dave & Skhilled can take a look & adjust Crip's themes not to do that. If you look at the default theme & many other SMF 2.1 themes, the "#footer" div is by itself at the end of the "body". I can likely adjust the CSS with *:not("#footer") to not apply whatever is causing that issue for the footer.

Chen Zhen

#25
Most of those themes have the footer within the border of the entire forum so I suppose it's by design.
Bluemoonshine is the exception as it's got the footer as the last div.

I will have a look and come up with something.

Does this issue only occur for mobile/responsive display?

Chen Zhen


Tiny Portal's got the mobile CSS working great no matter what theme I throw at it.  ;D
EhPortal works fine for most theme's based off of the default but not so much for most of those Crip themes & I suspect some others.
This is going to be a lot of work  ::)

Dave

Quote from: Chen Zhen on August 19, 2026, 03:50:13 AM
Quote from: deansmar on August 18, 2026, 11:19:00 AMBut of course Dave..  :D
I always check against other browsers..
It's just strange that the width is hardwired to the footer div..
And this problem was not there in RC6

Nothing is in the theme index.template.php or theme css

You can have a look at my online test site, with what ever browser you like..
and see the footer problem..

But it might not be a portal problem.. as the default theme is okay..
So it points me to a CripZone theme problem..  ;)

The "#footer" shouldn't be within the "#footerfix" div but it appears to be that way on the whitebox theme that you're using on your website. Since that's a Crip theme, perhaps Dave & Skhilled can take a look & adjust Crip's themes not to do that. If you look at the default theme & many other SMF 2.1 themes, the "#footer" div is by itself at the end of the "body". I can likely adjust the CSS with *:not("#footer") to not apply whatever is causing that issue for the footer.


I'll mention this on the theme site and see if we can't change it. I'm going to quote your text above Chen so the guys can see what you're saying
If you want play quizzes or games click below

deansmar

#28
Finaly i have managed to logIn.. i keep getting net:err_cert_authority_invalid

here are some of the work arrounds that i have found, that work..

mobile/responsive display
Using a Galaxy S25: 146,9 x 70,5 mm | 6,2 inch Display diagonal
146,9 x 70,5 mm = 5,78 x 2,78 inch to simulate the responsive display
Also a real Mobile Galaxy A40  144,4 x 69,2  mm = 5.69 x 2.72 inches

The only things that is causing any problems in mobile/responsive display is;

1. Board News Block
Display breaking up in colums
With the following changes in the ep_responsive.min.css  it then displays okay..!
.sp_block_title_article_fix .middletext {
// display: flex;
font-size: 80%;  //88%

2. Recent Attachments Block
Was not showing full width..
With the following changes in the ep_responsive.min.css it then displays okay..!
#sp_footer {
width: inherit;
#sp_footer .ehPortal_cell {
display: block;  //flex;

Apart from that, I think the Responsive mode/display works a treat.. 😊
--------------------------------------

Desktop Display

1. No matter where the #FooterFix ends, I moved it to before the #Footer the Problem remains
Deleting the #footer entry, in the below mentioned code, the inline (hard coded) style disappears.

Subs-PortalResponsive
Around Line 224
function ehPortalAddResponsiveClasses() {
$(".ehPortal_cell").css("width", "100%");
$(".ehPortal_row").css("min-width","100%");
$("#footer").css("width","100%");
$(".postinfo").css("font-size","smaller");
$(".modified").css("font-size","xx-small"); }

The width then needs to be added to the ep_responsive.min.css
#footer {
width: inherit;  or 100%;
both work on the Default curve theme, and Crip themes

2. currentColor is obviously not picking up the theme color's that's a pitty ..!

border: 0.125rem ridge currentColor;
it does not matter if the keyword currentColor is there or not.. 
the border remains black.. no matter which theme is selected..!

border: 0.125rem ridge lightblue;
entering a color keyword changes the border color.

3. Admin -> Ehportal -> Article -> Article List & Page List
The headers probably need to be looked at..!

4. Admin -> Ehportal -> Block List -> Edit Block -> Custom Permissions
The headers probably need to be looked at..!


i have alreaedy made all these changes, on my online Test Site so you can see it working..

deansmar

Quote from: Chen Zhen on August 19, 2026, 04:16:31 AMDoes this issue only occur for mobile/responsive display?


it only occurs on the desktop display

see the above post for the solution.. Desktop fault 1.