NetTalk Central

Author Topic: Login window not centered  (Read 6161 times)

jking

  • Sr. Member
  • ****
  • Posts: 419
    • View Profile
    • Email
Login window not centered
« on: March 05, 2024, 08:50:13 AM »
Hi Bruce,

     I updated to NT 14.19.  Now my login form is left justified, see attached.  I have the Form Div set at: ' nt-fix-center login-form-width'.

     Nothing else has changed in my app.  I simply re-compiled after updating to NT 14.19.  With NT 14.13 the login form was centered. 

     I have spent more than an hour trying to fix this without success.  All my NT 14.13 apps now have the login form left justified as does the example app Web3.  Anything change with CSS formatting since NT 14.13?

Thanks,

Jeff
« Last Edit: March 05, 2024, 11:04:04 PM by Bruce »

jking

  • Sr. Member
  • ****
  • Posts: 419
    • View Profile
    • Email
Re: Re: Save form as user selects tabs?
« Reply #1 on: March 05, 2024, 10:52:45 AM »
Hello all,

     I think I have a fix.  I added an item to my custom css;

                margin: 0 auto;

This has centered the Login Form like before.

Jeff King

Bruce

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 11250
    • View Profile
Re: Re: Save form as user selects tabs?
« Reply #2 on: March 05, 2024, 11:02:38 PM »
what css class did you add that into?

jking

  • Sr. Member
  • ****
  • Posts: 419
    • View Profile
    • Email
Re: Login window not centered
« Reply #3 on: March 06, 2024, 09:00:51 AM »
Hi Bruce,

     I added it to the login-form-width as seen here:


.login-form-width{
   width: 350px;
   line-height: 1.0em;
   margin: 0 auto;
}

Seems to work as needed.

Thanks,

Jeff

Richard I

  • Sr. Member
  • ****
  • Posts: 398
    • View Profile
    • Email
Re: Login window not centered
« Reply #4 on: March 21, 2024, 09:44:09 PM »
Hi
I anticipated that NT 14.20 might correct the centering issue but no, it appears not
So I followed the post by Jeff King and done this-

I have added to my rji-custom.css
.login-form-width{
   width: 300px;
   line-height: 1.0em;
   margin: 0 auto; !Important
}

Added my custom.css into This WebServer Settings Styles Files
into CSS Style Files
'rji-custom.css'-Browser: All

and ran Gzipall for good measure
I have in the Login FormAction CSSClasses

Form Div ' nt-fix-center nt-width-300px'   - the default
and in the Outer Div ' login-form-width'

No Change  - still left justified.
reverted to  ' nt-fix-center login-form-width'
From  ' nt-fix-center nt-width-300px'

no change in centering but with ' nt-fix-center login-form-width' the form spanned the entire page
 
Where to from here please?
Thanks
Richard

jking

  • Sr. Member
  • ****
  • Posts: 419
    • View Profile
    • Email
Re: Login window not centered
« Reply #5 on: March 28, 2024, 09:46:18 AM »
Hi Richard,

     I'm working on some NT 14.20 apps today and noticed the same.  Try pressing CTRL-F5, this clears the browser cache and resets things.  Working here to center the login screen.

Jeff

Richard I

  • Sr. Member
  • ****
  • Posts: 398
    • View Profile
    • Email
Re: Login window not centered
« Reply #6 on: March 28, 2024, 01:26:48 PM »
Thanks Jeff,
No Joy with Control F5
I have replaced in the Form Div  ' nt-fix-center nt-width-300px'
 with
' nt-fix-center login-form-width'

and added my custom Css file into ThisWebServer Settings ->Styles ->Files as
'rji-custom.css'-Browser:All
Ran Gzipall

For completeness ,this is my custom CSS
.login-form-width{
   width: 300px; !important;
   line-height: 1.0em;
   margin: 0 auto;
}

On Running the login form spans the page as per attachment.....
Cheers
Richard

Jane

  • Sr. Member
  • ****
  • Posts: 372
  • Expert on nothing with opinions on everything.
    • View Profile
    • Email
Re: Login window not centered
« Reply #7 on: March 28, 2024, 03:13:42 PM »
Richard,

I don't think login-form-width exists by default.

That looks like a class name that Jeff created as shown in the second pic in his original post (where he adds it after a space to the FormDiv settings for his procedure).
Once it's attached to something, then the CSS class can attach itself.

Do you have that class name in your template?

Jane

jking

  • Sr. Member
  • ****
  • Posts: 419
    • View Profile
    • Email
Re: Login window not centered
« Reply #8 on: March 28, 2024, 04:08:50 PM »
Richard,

     Jane is correct, see the attached image to see where I added my custom class in the login form template.

Jeff

Richard I

  • Sr. Member
  • ****
  • Posts: 398
    • View Profile
    • Email
Re: Login window not centered
« Reply #9 on: March 28, 2024, 07:26:22 PM »
Yes I do thanks....

Richard I

  • Sr. Member
  • ****
  • Posts: 398
    • View Profile
    • Email
Re: Login window not centered
« Reply #10 on: March 28, 2024, 07:45:23 PM »
thanks
In the login Tab properties
All fields from Labels to Suppress are set as Default
is that correct?
I attach my Custom CSS in case.......

Cheers
Richard

jking

  • Sr. Member
  • ****
  • Posts: 419
    • View Profile
    • Email
Re: Login window not centered
« Reply #11 on: March 29, 2024, 08:00:24 AM »
Richard,

     Yes, that is correct...I have mine set the same.  However, post a screen shot of the CSS Classes tab so we can see where you have called your custom class.  See the screen shot from my previous post as a sample.

Jeff

Richard I

  • Sr. Member
  • ****
  • Posts: 398
    • View Profile
    • Email
Re: Login window not centered
« Reply #12 on: March 29, 2024, 11:10:52 AM »
Two Screen shots Jeff

Bruce

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 11250
    • View Profile
Re: Login window not centered
« Reply #13 on: April 17, 2024, 01:44:31 AM »
I've tweaked the styles for 14.21 to restore the old behavior.

Richard I

  • Sr. Member
  • ****
  • Posts: 398
    • View Profile
    • Email
Re: Solved - Login window not centered
« Reply #14 on: April 17, 2024, 03:01:07 PM »
Thanks Bruce,

I solved the issue last night-
In my Custom.css file in the login-form-width I had cleverly included !Important
on one of the early lines
I removed that and recompiled  - solved  ! Now login form nicely centered

Cheers
Richard