Fixed: Pb of wrapping login page

New: Use placeholder
This commit is contained in:
Laurent Destailleur 2014-12-08 02:41:21 +01:00
parent ef73201b3e
commit 4d7f3cb741
3 changed files with 85 additions and 41 deletions

View File

@ -46,9 +46,10 @@ $(document).ready(function () {
</script> </script>
<?php } ?> <?php } ?>
<div align="center"> <center>
<div class="login_vertical_align"> <div class="login_vertical_align">
<form id="login" name="login" method="post" action="<?php echo $php_self; ?>"> <form id="login" name="login" method="post" action="<?php echo $php_self; ?>">
<input type="hidden" name="token" value="<?php echo $_SESSION['newtoken']; ?>" /> <input type="hidden" name="token" value="<?php echo $_SESSION['newtoken']; ?>" />
<input type="hidden" name="loginfunction" value="loginfunction" /> <input type="hidden" name="loginfunction" value="loginfunction" />
@ -66,33 +67,39 @@ $(document).ready(function () {
<input type="hidden" name="dol_no_mouse_hover" id="dol_no_mouse_hover" value="<?php echo $dol_no_mouse_hover; ?>" /> <input type="hidden" name="dol_no_mouse_hover" id="dol_no_mouse_hover" value="<?php echo $dol_no_mouse_hover; ?>" />
<input type="hidden" name="dol_use_jmobile" id="dol_use_jmobile" value="<?php echo $dol_use_jmobile; ?>" /> <input type="hidden" name="dol_use_jmobile" id="dol_use_jmobile" value="<?php echo $dol_use_jmobile; ?>" />
<div class="login_table"> <table class="login_table_title center" summary="<?php echo dol_escape_htmltag($title); ?>">
<div id="login_line1">
<!-- Logo -->
<div class="center"><img alt="Logo" title="" src="<?php echo $urllogo; ?>" id="img_logo" /></div>
<table align="center" class="login_table_title" summary="<?php echo dol_escape_htmltag($title); ?>">
<tr class="vmenu"><td align="center"><?php echo dol_escape_htmltag($title); ?></td></tr> <tr class="vmenu"><td align="center"><?php echo dol_escape_htmltag($title); ?></td></tr>
</table> </table>
<br> <br>
<table class="left" summary="Login pass"> <div class="login_table">
<div id="login_line1">
<div id="login_left">
<img alt="Logo" title="" src="<?php echo $urllogo; ?>" id="img_logo" />
</div>
<div id="login_right">
<table class="left centpercent" summary="Login pass">
<!-- Login --> <!-- Login -->
<tr> <tr>
<td valign="middle" class="loginfield"><strong><label for="username"><?php echo $langs->trans('Login'); ?></label></strong></td>
<td valign="middle" class="nowrap"> <td valign="middle" class="nowrap">
<span class="span-icon-user"> <span class="span-icon-user">
<input type="text" id="username" name="username" class="flat input-icon-user" size="15" maxlength="40" value="<?php echo dol_escape_htmltag($login); ?>" tabindex="1" autofocus="autofocus" /> <input type="text" id="username" placeholder="<?php echo $langs->trans("Login"); ?>" name="username" class="flat input-icon-user" size="15" value="<?php echo dol_escape_htmltag($login); ?>" tabindex="1" autofocus="autofocus" />
</span> </span>
</td> </td>
</tr> </tr>
<!-- Password --> <!-- Password -->
<tr><td valign="middle" class="loginfield nowrap"><strong><label for="password"><?php echo $langs->trans('Password'); ?></label></strong></td> <tr>
<td valign="middle" class="nowrap"> <td valign="middle" class="nowrap">
<span class="span-icon-password"> <span class="span-icon-password">
<input id="password" name="password" class="flat input-icon-password" type="password" size="15" maxlength="30" value="<?php echo dol_escape_htmltag($password); ?>" tabindex="2" autocomplete="off" /> <input id="password" placeholder="<?php echo $langs->trans("Password"); ?>" name="password" class="flat input-icon-password" type="password" size="15" value="<?php echo dol_escape_htmltag($password); ?>" tabindex="2" autocomplete="off" />
</span> </span>
</td></tr> </td></tr>
<?php <?php
@ -110,18 +117,18 @@ if (! empty($hookmanager->resArray['options'])) {
if ($captcha) { if ($captcha) {
// TODO: provide accessible captha variants // TODO: provide accessible captha variants
?> ?>
<!-- Captcha --> <!-- Captcha -->
<tr><td valign="middle" class="loginfield nowrap"><label for="securitycode"><b><?php echo $langs->trans('SecurityCode'); ?></b></label></td> <tr>
<td valign="top" class="nowrap none" align="left"> <td valign="top" class="nowrap none" align="left">
<table class="login_table_securitycode" style="width: 100px;"><tr> <table class="login_table_securitycode" style="width: 100px;"><tr>
<td> <td>
<span class="span-icon-security"> <span class="span-icon-security">
<input id="securitycode" class="flat input-icon-security" type="text" size="6" maxlength="5" name="code" tabindex="4" /> <input id="securitycode" placeholder="<?php echo $langs->trans("SecurityCode"); ?>" class="flat input-icon-security" type="text" size="12" maxlength="5" name="code" tabindex="3" />
</span> </span>
</td> </td>
<td><img src="<?php echo DOL_URL_ROOT ?>/core/antispamimage.php" border="0" width="80" height="32" id="img_securitycode" /></td> <td><img src="<?php echo DOL_URL_ROOT ?>/core/antispamimage.php" border="0" width="80" height="32" id="img_securitycode" /></td>
<td><a href="<?php echo $php_self; ?>"><?php echo $captcha_refresh; ?></a></td> <td><a href="<?php echo $php_self; ?>" tabindex="4"><?php echo $captcha_refresh; ?></a></td>
</tr></table> </tr></table>
</td></tr> </td></tr>
@ -130,6 +137,12 @@ if (! empty($hookmanager->resArray['options'])) {
</div> <!-- end div left --> </div> <!-- end div left -->
</div>
<div id="login_line2" style="clear: both"> <div id="login_line2" style="clear: both">
<!-- Button Connection --> <!-- Button Connection -->
@ -145,7 +158,7 @@ if ($forgetpasslink || $helpcenterlink)
if ($dol_use_jmobile) $moreparam.=(strpos($moreparam,'?')===false?'?':'&').'dol_use_jmobile='.$dol_use_jmobile; if ($dol_use_jmobile) $moreparam.=(strpos($moreparam,'?')===false?'?':'&').'dol_use_jmobile='.$dol_use_jmobile;
echo '<br>'; echo '<br>';
echo '<div class="center" style="margin-top: 4px;">'; echo '<div align="center" style="margin-top: 4px;">';
if ($forgetpasslink) { if ($forgetpasslink) {
echo '<a class="alogin" href="'.DOL_URL_ROOT.'/user/passwordforgotten.php'.$moreparam.'">('; echo '<a class="alogin" href="'.DOL_URL_ROOT.'/user/passwordforgotten.php'.$moreparam.'">(';
echo $langs->trans('PasswordForgotten'); echo $langs->trans('PasswordForgotten');
@ -172,7 +185,7 @@ if (isset($conf->file->main_authentication) && preg_match('/openid/',$conf->file
//if (! empty($conf->global->MAIN_OPENIDURL_PERUSER)) $url= //if (! empty($conf->global->MAIN_OPENIDURL_PERUSER)) $url=
echo '<br>'; echo '<br>';
echo '<div class="center" style="margin-top: 4px;">'; echo '<div align="center" style="margin-top: 4px;">';
$url=$conf->global->MAIN_AUTHENTICATION_OPENID_URL; $url=$conf->global->MAIN_AUTHENTICATION_OPENID_URL;
if (! empty($url)) print '<a class="alogin" href="'.$url.'">'.$langs->trans("LoginUsingOpenID").'</a>'; if (! empty($url)) print '<a class="alogin" href="'.$url.'">'.$langs->trans("LoginUsingOpenID").'</a>';
@ -185,14 +198,18 @@ if (isset($conf->file->main_authentication) && preg_match('/openid/',$conf->file
echo '</div>'; echo '</div>';
} }
?> ?>
</div> </div>
</div>
</div> </div>
</form> </form>
<?php if (! empty($_SESSION['dol_loginmesg'])) <?php if (! empty($_SESSION['dol_loginmesg']))
{ {
?> ?>
@ -206,17 +223,21 @@ if (isset($conf->file->main_authentication) && preg_match('/openid/',$conf->file
<?php if ($main_home) <?php if ($main_home)
{ {
?> ?>
<!-- main_home message --> <div class="center" class="login_main_home" style="max-width: 80%">
<div class="login_main_home center" style="max-width: 80%"><?php echo $main_home; ?></div> <?php echo $main_home; ?>
<br> </div><br>
<?php <?php
} }
?> ?>
<!-- authentication mode = <?php echo $main_authentication ?> --> <!-- authentication mode = <?php echo $main_authentication ?> -->
<!-- cookie name used for this session = <?php echo $session_name ?> --> <!-- cookie name used for this session = <?php echo $session_name ?> -->
<!-- urlfrom in this session = <?php echo isset($_SESSION["urlfrom"])?$_SESSION["urlfrom"]:''; ?> --> <!-- urlfrom in this session = <?php echo isset($_SESSION["urlfrom"])?$_SESSION["urlfrom"]:''; ?> -->
<!-- Common footer is not used for login page, this is same than footer but inside login tpl --> <!-- Common footer is not used for login page, this is same than footer but inside login tpl -->
<?php if (! empty($conf->global->MAIN_HTML_FOOTER)) print $conf->global->MAIN_HTML_FOOTER; ?> <?php if (! empty($conf->global->MAIN_HTML_FOOTER)) print $conf->global->MAIN_HTML_FOOTER; ?>
<?php <?php
// Google Analytics (need Google module) // Google Analytics (need Google module)
if (! empty($conf->google->enabled) && ! empty($conf->global->MAIN_GOOGLE_AN_ID)) if (! empty($conf->google->enabled) && ! empty($conf->global->MAIN_GOOGLE_AN_ID))
@ -246,7 +267,7 @@ if (! empty($conf->google->enabled) && ! empty($conf->global->MAIN_GOOGLE_AD_CLI
if (empty($conf->dol_use_jmobile)) if (empty($conf->dol_use_jmobile))
{ {
?> ?>
<div class="center"><br> <div align="center"><br>
<script type="text/javascript"><!-- <script type="text/javascript"><!--
google_ad_client = "<?php echo $conf->global->MAIN_GOOGLE_AD_CLIENT ?>"; google_ad_client = "<?php echo $conf->global->MAIN_GOOGLE_AD_CLIENT ?>";
google_ad_slot = "<?php echo $conf->global->MAIN_GOOGLE_AD_SLOT ?>"; google_ad_slot = "<?php echo $conf->global->MAIN_GOOGLE_AD_SLOT ?>";
@ -262,8 +283,11 @@ if (! empty($conf->google->enabled) && ! empty($conf->global->MAIN_GOOGLE_AD_CLI
} }
} }
?> ?>
</div> </div>
</div> </center> <!-- end of center -->
</body> </body>
</html> </html>

View File

@ -44,7 +44,8 @@ $(document).ready(function () {
<?php } ?> <?php } ?>
<div align="center" class="login_vertical_align"> <center>
<div class="login_vertical_align">
<form id="login" name="login" method="post" action="<?php echo $php_self; ?>"> <form id="login" name="login" method="post" action="<?php echo $php_self; ?>">
@ -52,7 +53,7 @@ $(document).ready(function () {
<input type="hidden" name="action" value="buildnewpassword"> <input type="hidden" name="action" value="buildnewpassword">
<table class="login_table_title center" summary="<?php echo dol_escape_htmltag($title); ?>"> <table class="login_table_title center" summary="<?php echo dol_escape_htmltag($title); ?>">
<tr class="vmenu"><td class="center"><?php echo $title; ?></td></tr> <tr class="vmenu"><td align="center"><?php echo $title; ?></td></tr>
</table> </table>
<br> <br>
@ -60,16 +61,23 @@ $(document).ready(function () {
<div id="login_line1"> <div id="login_line1">
<div id="login_left"> <div id="login_left">
<img alt="Logo" title="" src="<?php echo $urllogo; ?>" id="img_logo" />
</div>
<div id="login_right">
<table class="left" summary="Login pass"> <table class="left" summary="Login pass">
<!-- Login --> <!-- Login -->
<tr> <tr>
<td valign="bottom" class="loginfield nowrap"><strong><label for="username"><?php echo $langs->trans('Login'); ?></label></strong></td>
<td valign="bottom" class="nowrap"> <td valign="bottom" class="nowrap">
<span class="span-icon-user"> <span class="span-icon-user">
<input type="text" <?php echo $disabled; ?> id="username" name="username" class="flat input-icon-user" size="15" maxlength="40" value="<?php echo dol_escape_htmltag($login); ?>" tabindex="1" /> <input type="text" placeholder="<?php echo $langs->trans("Login"); ?>" <?php echo $disabled; ?> id="username" name="username" class="flat input-icon-user" size="15" value="<?php echo dol_escape_htmltag($login); ?>" tabindex="1" />
</span> </span>
</td> </td>
</tr> </tr>
@ -88,17 +96,17 @@ if (! empty($hookmanager->resArray['options'])) {
<?php if ($captcha) { ?> <?php if ($captcha) { ?>
<!-- Captcha --> <!-- Captcha -->
<tr><td valign="middle" class="loginfield nowrap"><strong><label for="securitycode"><?php echo $langs->trans('SecurityCode'); ?></label></strong></td> <tr>
<td valign="top" class="nowrap none" align="left"> <td valign="top" class="nowrap none" align="left">
<table class="login_table_securitycode" style="width: 100px;"><tr> <table class="login_table_securitycode" style="width: 100px;"><tr>
<td> <td>
<span class="span-icon-security"> <span class="span-icon-security">
<input id="securitycode" class="flat input-icon-security" type="text" size="6" maxlength="5" name="code" tabindex="4" /> <input id="securitycode" placeholder="<?php echo $langs->trans("SecurityCode"); ?>" class="flat input-icon-security" type="text" size="12" maxlength="5" name="code" tabindex="3" />
</span> </span>
</td> </td>
<td><img src="<?php echo DOL_URL_ROOT ?>/core/antispamimage.php" border="0" width="80" height="32" id="img_securitycode" /></td> <td><img src="<?php echo DOL_URL_ROOT ?>/core/antispamimage.php" border="0" width="80" height="32" id="img_securitycode" /></td>
<td><a href="<?php echo $php_self; ?>"><?php echo $captcha_refresh; ?></a></td> <td><a href="<?php echo $php_self; ?>" tabindex="4"><?php echo $captcha_refresh; ?></a></td>
</tr></table> </tr></table>
</td></tr> </td></tr>
@ -108,11 +116,9 @@ if (! empty($hookmanager->resArray['options'])) {
</div> <!-- end div left --> </div> <!-- end div left -->
<div id="login_right">
<img alt="Logo" title="" src="<?php echo $urllogo; ?>" id="img_logo" />
</div>
</div> </div>
<div id="login_line2" style="clear: both"> <div id="login_line2" style="clear: both">
@ -121,7 +127,7 @@ if (! empty($hookmanager->resArray['options'])) {
<br><input id="password" type="submit" <?php echo $disabled; ?> class="button" name="password" value="<?php echo $langs->trans('SendNewPassword'); ?>" tabindex="4" /> <br><input id="password" type="submit" <?php echo $disabled; ?> class="button" name="password" value="<?php echo $langs->trans('SendNewPassword'); ?>" tabindex="4" />
<br> <br>
<div class="center" style="margin-top: 4px;"> <div align="center" style="margin-top: 4px;">
<?php <?php
$moreparam=''; $moreparam='';
if (! empty($conf->dol_hide_topmenu)) $moreparam.=(strpos($moreparam,'?')===false?'?':'&').'dol_hide_topmenu='.$conf->dol_hide_topmenu; if (! empty($conf->dol_hide_topmenu)) $moreparam.=(strpos($moreparam,'?')===false?'?':'&').'dol_hide_topmenu='.$conf->dol_hide_topmenu;
@ -146,7 +152,7 @@ if (! empty($hookmanager->resArray['options'])) {
<?php echo $langs->trans('SendNewPasswordDesc'); ?> <?php echo $langs->trans('SendNewPasswordDesc'); ?>
</font> </font>
<?php }else{ ?> <?php }else{ ?>
<div class="warning center"> <div class="warning" align="center">
<?php echo $langs->trans('AuthenticationDoesNotAllowSendNewPassword', $mode); ?> <?php echo $langs->trans('AuthenticationDoesNotAllowSendNewPassword', $mode); ?>
</div> </div>
<?php } ?> <?php } ?>
@ -163,8 +169,9 @@ if (! empty($hookmanager->resArray['options'])) {
</div> </div>
</center> <!-- end of center -->
</body> </body>
</html> </html>
<!-- END PHP TEMPLATE --> <!-- END PHP TEMPLATE -->

View File

@ -849,7 +849,7 @@ form#login {
vertical-align: middle; vertical-align: middle;
} }
.login_table_title { .login_table_title {
max-width: 320px; max-width: 560px;
color: #888888; color: #888888;
text-shadow: 1px 1px 1px #FFF; text-shadow: 1px 1px 1px #FFF;
} }
@ -863,7 +863,7 @@ form#login {
padding-right:6px; padding-right:6px;
padding-top:12px; padding-top:12px;
padding-bottom:12px; padding-bottom:12px;
max-width: 320px; max-width: 560px;
background-color: #FFFFFF; background-color: #FFFFFF;
@ -891,6 +891,8 @@ div#login_left, div#login_right {
display: inline-block; display: inline-block;
min-width: 245px; min-width: 245px;
padding-top: 10px; padding-top: 10px;
padding-left: 16px;
padding-right: 16px;
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
} }
@ -964,6 +966,17 @@ img.login, img.printer, img.entity {
font-weight: bold; font-weight: bold;
} }
.span-icon-user {
background: url(<?php echo dol_buildpath($path.'/theme/'.$theme.'/img/object_user.png',1); ?>) no-repeat scroll 7px 7px;
}
.span-icon-password {
background-image: url(<?php echo dol_buildpath($path.'/theme/'.$theme.'/img/lock.png',1); ?>);
background-repeat: no-repeat;
}
.span-icon-user input, .span-icon-password input {
margin-right: 30px;
width: 98%;
}
/* ============================================================================== */ /* ============================================================================== */
/* Menu gauche */ /* Menu gauche */