Page 1 of 1
AppGini Login Quickie: prepend icons for username and password
Posted: 2020-02-22 12:14
by jsetzer
Hi,
if you want to have icons before username and password, have a look here:
Result
- LpjodKmUVR.png (6.44 KiB) Viewed 37635 times
Copy&Paste-Code
Code: Select all
<!-- file: hooks/header-extras.php -->
<script>
prependIcons();
function prependIcons() { $j(function() { prependIcon('username', 'user'); prependIcon('password', 'lock'); }); }
function prependIcon(name, icon = "cog") { var f = $j("#" + name); var fg = f.closest(".form-group"); fg.prepend(jQuery('<div class="input-group"/>').prepend($j('<div class="input-group-addon">').append($j("<i/>").addClass('glyphicon glyphicon-' + icon))).append(f)); fg.prepend($j('label[for="' + name + '"]')); }
</script>
- ImK73sv9lf.png (6.23 KiB) Viewed 37635 times
Best,
Jan
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-02-22 17:27
by D Oliveira
nice touch
implemented! thank you jan
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-04-13 13:25
by kanklovitch
Nice, I like it!
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-04-25 22:39
by kerelov
Very good!
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-04-27 04:03
by jsetzer
Thank you!
PS: next version (April 2020) of AppGini Helper JavaScript Library will contain a single function call for this:
new AppGiniLoginView().fix();
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-05-03 01:07
by sathukorala
When can we have the next version (April 2020) of AppGini Helper JavaScript Library?
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-05-03 05:31
by jsetzer
viewtopic.php?f=13&t=3329#p13261
April-2020 release is available for download since last Thursday, April 30th.
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-05-03 09:20
by sathukorala
Thanks, Jan. When will we see the documentation updated for the new release?
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-05-03 09:25
by sathukorala
jsetzer wrote: ↑2020-04-27 04:03
Thank you!
PS: next version (April 2020) of AppGini Helper JavaScript Library will contain a single function call for this:
new AppGiniLoginView().fix();
The single function has an alignment bug it seems. Long code is fine only the single function call
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-05-03 12:57
by jsetzer
I am going to have a look on Monday
Re: AppGini Login Quickie: prepend icons for username and password
Posted: 2020-05-03 15:22
by jsetzer
sathukorala wrote: ↑2020-05-03 09:25
The single function has an alignment bug it seems. Long code is fine only the single function call
Hi,
- Could you please tell us what alignment bugs you see
- It would be helpful if your bugreports would contain screenshots and some more information
- Always ensure your browser has loaded latest version and not cached outdated version of JS and CSS
- Always ensure that there is no other javascript bug which stops execution of code
This code works in testing environment with latest version 2020-04 of AppGini Helper Javascript Library and I cannot see any alignment problem:
Code: Select all
<!-- file: hooks/header-extras.php -->
<!-- ... your includes ... -->
<script>
new AppGiniLoginView().fix();
</script>
- chrome_gyiw3mWUF5.png (86.88 KiB) Viewed 34373 times
Default without fix
- Zhydug2BGo.png (140.28 KiB) Viewed 34373 times