Center login box

Discussions related to customizing hooks. Hooks are documented at http://bigprof.com/appgini/help/advanced-topics/hooks/
Post Reply
Moh Youba
Veteran Member
Posts: 102
Joined: 2017-03-12 09:31

Center login box

Post by Moh Youba » 2019-07-23 14:23

Hello

How to center the login box
login.jpg
login.jpg (32.3 KiB) Viewed 538 times
Thank you

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 264
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

Re: Center login box

Post by jsetzer » 2019-07-23 14:49

You can use jquery to...
  1. remove $j("#login_splash")
  2. add class "col-sm-offset-3" to $j(".container > .row > .col-sm-6")
  3. add class "col-lg-offset-4" to $j(".container > .row > .col-lg-4")
That should do the trick.

For example add the following code to hooks/header-extras.php:

Code: Select all

<script>
    $j(function() {
        if ($j("#login_splash").length) {
            $j("#login_splash").remove();
            $j(".container > .row > .col-sm-6").addClass("col-sm-offset-3");
            $j(".container > .row > .col-lg-4").addClass("col-lg-offset-4");
        }
    });
</script>
Is this what you need?

chrome_2019-07-23_16-48-14.png
chrome_2019-07-23_16-48-14.png (19.09 KiB) Viewed 536 times

Regards,
Jan

Moh Youba
Veteran Member
Posts: 102
Joined: 2017-03-12 09:31

Re: Center login box

Post by Moh Youba » 2019-07-24 11:29

Hi Jan
Once again thank you for your great support, it is exactly what I want.
Best regards,

User avatar
jsetzer
AppGini Super Hero
AppGini Super Hero
Posts: 264
Joined: 2018-07-06 06:03
Location: Kiel, Germany
Contact:

SOLVED: Center login box

Post by jsetzer » 2019-07-24 11:30

Great, glad to hear!

Best Regards,
Jan

Moh Youba
Veteran Member
Posts: 102
Joined: 2017-03-12 09:31

Re: Center login box

Post by Moh Youba » 2019-07-24 19:11

login_page.jpg
login_page.jpg (120.39 KiB) Viewed 495 times
working fine
Thanks !

User avatar
baudwalker
Veteran Member
Posts: 119
Joined: 2015-02-03 08:08
Location: Bellingen NSW Australia

Re: Center login box

Post by baudwalker » 2019-07-25 00:23

Great job Jan,
One thing is the menu I set up according to Ahmed's online course (see top image) is now pushed below the login (see bottom image)

Barry
Attachments
login screen.PNG
login screen.PNG (198.46 KiB) Viewed 484 times

onoehring
AppGini Super Hero
AppGini Super Hero
Posts: 325
Joined: 2019-05-21 22:42
Contact:

Re: Center login box

Post by onoehring » 2019-07-25 06:53

Hi baudwalker,

maybe this works when added after your additional text:

Code: Select all

<div style="clear:both;"></div>
I tried myself - this does not seem to work, but I am currious how it can be done.

PS: in Ahmeds video he is using appendTo in the jquery. I tried with prependTo - without the result we hope for.

Olaf

onoehring
AppGini Super Hero
AppGini Super Hero
Posts: 325
Joined: 2019-05-21 22:42
Contact:

Re: Center login box

Post by onoehring » 2019-07-25 07:15

Hi

I have a solution:
in Ahmends code make this change (prepend and new ID as well) (oh, my extra headline text has the ID info instead of the one in Ahmeds video):

Code: Select all

	<script>
		$j(function(){
			$j('#info').prependTo('#introtxt');			
		})
	</script>
change the code from jsetzer (above) to (2 new lines with new ID)

Code: Select all

<script>
    $j(function() {
        if ($j("#login_splash").length) {
            $j("#login_splash").remove();
            $j(".container > .row > .col-sm-6").addClass("col-sm-offset-3");
            $j(".container > .row > .col-lg-4").addClass("col-lg-offset-4");
			
			$j(".container > .row > .col-sm-6").attr('id', 'introtxt');
			$j(".container > .row > .col-lg-4").attr('id', 'introtxt');
        }
    });
</script>
At this time it looks like - but how can the headline text be wider now?
ec71.png
ec71.png (70.85 KiB) Viewed 471 times


Olaf

User avatar
baudwalker
Veteran Member
Posts: 119
Joined: 2015-02-03 08:08
Location: Bellingen NSW Australia

Re: Center login box

Post by baudwalker » 2019-07-25 08:16

still working on the problem :(

User avatar
baudwalker
Veteran Member
Posts: 119
Joined: 2015-02-03 08:08
Location: Bellingen NSW Australia

Re: Center login box

Post by baudwalker » 2019-07-25 08:36

Thank you Olaf it works well... and thank you also Jan

Barry

Post Reply