Skip to content

Commit

Permalink
fix issues #73
Browse files Browse the repository at this point in the history 
update login form
  • Loading branch information
@64j
64j committed Jul 20, 2017
1 parent c469b0e commit 3ac1ef3
Show file tree
Hide file tree
Showing 2 changed files with 54 additions and 74 deletions.
3 changes: 2 additions & 1 deletion manager/includes/accesscontrol.inc.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@
$modx->setPlaceholder('login_message', $_lang["login_message"]);
$modx->setPlaceholder('manager_theme_url', MODX_MANAGER_URL . 'media/style/' . $modx->config['manager_theme'] . '/');
$modx->setPlaceholder('year', date('Y'));
$modx->setPlaceholder('manager_theme_style', (isset($_COOKIE['MODX_themeColor']) ? $_COOKIE['MODX_themeColor'] : ''));

// andrazk 20070416 - notify user of install/update
if(isset($_GET['installGoingOn'])) {
Expand Down Expand Up @@ -188,4 +189,4 @@
, session_id(), $modx->getLoginUserID(), $_SESSION['mgrShortname'], $lasthittime, (string) $action, $itemid == null ? var_export(null, true) : $itemid);
$modx->db->query($sql);
}
}
}
125 changes: 52 additions & 73 deletions manager/media/style/default/login.tpl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,85 +6,63 @@
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width">
<link rel="icon" type="image/ico" href="media/style/[(manager_theme)]/images/favicon.ico" />
<style type="text/css">
html { font-size: 16px; height: 100% }
body { margin: 0; padding: 0 1rem; height: 100%; font-family: sans-serif; font-size: 0.8rem; line-height: 1.5; color: #666; background-color: #F2F2F2; }
html, body, #mx_loginbox { height: 100%; }
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
a { color: #999; text-decoration: underline; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; }
a:hover { color: #444; text-decoration: none }
p { margin: 0; }
img { display: inline-block; max-width: 100% }
.text-center { text-align: center }
.clear { clear: both; width: 100%; }
#mx_loginbox { height: auto; min-height: 100%; width: 19rem; margin: 0 auto; padding-top: 7%; }
#mx_loginbox::before, #mx_loginbox::after { content: ""; display: table; width: 100% }
.logo { display: inline-block; width: 100%; padding-bottom: 1rem }
fieldset { display: block; margin: 0 0 2rem; padding: 1.5rem; background-color: #fff; border: none; border-radius: 0.15rem; box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1); }
label { display: block; font-size: 0.8rem; margin: 0 0 0.375rem; }
input.text, input[type=text] { font-family: inherit; border: 1px solid rgba(0, 0, 0, 0.1); background-color: #fff; margin: 0 0 1rem; padding: 0 0.5rem; width: 100%; height: 2.2rem; line-height: 2.2rem; font-size: 1.2rem; border-radius: 0.15rem; box-shadow: 0 0 5px rgba(188, 188, 188, 0.15); outline: none; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; }
input.text:focus, input[type=text]:focus { border-color: #5b9bda }
input.checkbox { margin: 0.5rem 0 0 0.25rem; display: inline-block; width: 1rem; height: 1rem; vertical-align: text-bottom }
label.remtext, .caption { display: inline-block; font-size: 0.75rem; color: #999 }
#submitButton, #FMP-email_button { display: block; width: 100%; padding: 0 1rem; margin: 0; min-width: 6rem; height: 2.2rem; line-height: 2.2rem; outline: none; font-size: 0.8rem; color: #fff; cursor: pointer; background-color: #32AB9A; border: none; border-radius: 0.15rem; box-shadow: 0 0 5px rgba(188, 188, 188, 0.15); -webkit-transition-duration: 0.15s; transition-duration: 0.15s; }
#submitButton:hover, #FMP-email_button:hover { background-color: #35baa8; }
#submitButton:active, #FMP-email_button:active { background-color: #32AB9A; }
#FMP-email_button { margin-top: 0 }
.loginCaptcha { display: block; padding: 0.7rem 0 0.5rem; }
.caption { display: block }
.form-footer { }
#onManagerLoginFormRender > a:first-child, #onManagerLoginFormRender > label:first-child { display: inline-block; padding-top: 1rem; }
.loginCaptcha img { height: 60px }
.gpl { float: right; color: #B2B2B2; margin: -2em 0.5em 0.5em; font-size: 0.85em; }
.gpl a, .loginLicense a { color: #B2B2B2; }
/* animate */
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }
.animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; }
.scaleX { -webkit-animation: scaleX 3s ease-in-out infinite; animation: scaleX 3s ease-in-out infinite; }
@keyframes scaleX {
50% { -webkit-transform: scaleX(0.9); transform: scaleX(0.9) }
100% { -webkit-transform: scaleX(1); transform: scaleX(1) }
}
.zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
@-webkit-keyframes zoomIn {
0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); }
50% { opacity: 1; }
}
@keyframes zoomIn {
0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); }
50% { opacity: 1; }
<link rel="stylesheet" type="text/css" href="media/style/[(manager_theme)]/style.css" />
<style>
html, body { min-height: 100%; height: 100%; }
.page { height: 100%; padding-top: 7%; }
.loginbox { width: 90%; max-width: 25rem; margin: 0 auto; }
.copyrights { position: absolute; left: 0; right: 0; bottom: 0; padding: .5rem 1rem; font-size: .675rem; color: #aaa; text-align: right }
.copyrights a { color: #777 }
#submitButton { float: right; }
#FMP-email_label { color: #818a91 }
#FMP-email { margin-bottom: 1rem }
#FMP-email_button { float: right; }
/* mainloader */
#mainloader { position: absolute; z-index: 50000; top: 0; left: 0; width: 100%; height: 100%; text-align: center; vertical-align: middle; padding: 15% 0 0 0; background-color: rgba(255, 255, 255, 0.64); opacity: 0; visibility: hidden; -webkit-transition-duration: 0.3s; transition-duration: 0.3s }
#mainloader.show { opacity: 0.75; visibility: visible; -webkit-transition-duration: 0.1s; transition-duration: 0.1s }
#mainloader::before { content: ""; display: block; position: absolute; z-index: 1; left: 50%; top: 30%; width: 120px; height: 120px; margin: -60px 0 0 -60px; border-radius: 50%; animation: rotate 2s linear infinite; box-shadow: 5px 5px 0 0 rgb(234, 132, 82), 14px -7px 0 0 rgba(111, 163, 219, 0.7), -7px 11px 0 0 rgba(112, 193, 92, 0.74), -11px -7px 0 0 rgba(147, 205, 99, 0.78); }
@keyframes rotate {
to { transform: rotate(360deg) }
}
</style>
</head>
<body>
<div id="mx_loginbox">
<form method="post" name="loginfrm" id="loginfrm" action="processors/login.processor.php">
[+OnManagerLoginFormPrerender+]
<fieldset>
<div class="text-center">
<body class="[+manager_theme_style+]">
<div class="page">
<div class="tab-page loginbox">
<form method="post" name="loginfrm" id="loginfrm" class="container container-body" action="processors/login.processor.php">
[+OnManagerLoginFormPrerender+]
<div class="form-group text-center">
<a class="logo" href="../" title="[(site_name)]">
<img src="media/style/[(manager_theme)]/images/misc/login-logo.png" alt="[(site_name)]" id="logo" />
</a>
</div>
<label for="username">[+username+]</label>
<input type="text" class="text" name="username" id="username" tabindex="1" value="[+uid+]" />
<label for="password">[+password+]</label>
<input type="password" class="text" name="password" id="password" tabindex="2" value="" />
<p class="caption">[+login_captcha_message+]</p>
<p>[+captcha_image+]</p>
[+captcha_input+]
<div class="clear"></div>
<div class="form-footer">
<button type="submit" name="submitButton" class="login" id="submitButton">[+login_button+]</button>
<div class="form-group">
<label for="username" class="text-muted">[+username+]</label>
<input type="text" class="form-control" name="username" id="username" tabindex="1" value="[+uid+]" />
</div>
<div class="form-group">
<label for="password" class="text-muted">[+password+]</label>
<input type="password" class="form-control" name="password" id="password" tabindex="2" value="" />
</div>
<div class="clearfix">
<div class="caption">[+login_captcha_message+]</div>
<p>[+captcha_image+]</p>
[+captcha_input+]
</div>
<div class="form-group">
<label for="rememberme" class="text-muted">
<input type="checkbox" id="rememberme" name="rememberme" value="1" class="checkbox" [+remember_me+] /> [+remember_username+]</label>
<button type="submit" name="submitButton" class="btn btn-success float-xs-right" id="submitButton">[+login_button+]</button>
</div>
[+OnManagerLoginFormRender+]
</fieldset>
</form>
</form>
</div>
<div class="copyrights">
<p class="loginLicense"></p>
<div class="gpl">&copy; 2005-2017 by the <a href="http://evo.im/" target="_blank">EVO</a>. <strong>EVO</strong>&trade; is licensed under the GPL.</div>
</div>
</div>
<p class="loginLicense"></p>
<div class="gpl">&copy; 2005-2017 by the <a href="http://evo.im/" target="_blank">EVO</a>. <strong>EVO</strong>&trade; is licensed under the GPL.</div>
</body>
<div id="mainloader"></div>
<script type="text/javascript">
/* <![CDATA[ */
if(window.frames.length) {
Expand All @@ -97,7 +75,7 @@
form.username.focus()
}
form.onsubmit = function(e) {
form.submitButton.classList.add('scaleX');
document.getElementById('mainloader').classList.add('show');
var xhr = new XMLHttpRequest();
xhr.open('POST', 'processors/login.processor.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;');
Expand All @@ -109,14 +87,15 @@
} else {
var cimg = document.getElementById('captcha_image');
if(cimg) cimg.src = 'includes/veriword.php?rand=' + Math.random();
form.submitButton.classList.remove('scaleX');
document.getElementById('mainloader').classList.remove('show');
alert(this.response);
}
}
};
xhr.send('ajax=1&username=' + encodeURIComponent(form.username.value) + '&password=' + encodeURIComponent(form.password.value) + (form.captcha_code ? '&captcha_code=' + encodeURIComponent(form.captcha_code.value) : ''));
xhr.send('ajax=1&username=' + encodeURIComponent(form.username.value) + '&password=' + encodeURIComponent(form.password.value) + (form.captcha_code ? '&captcha_code=' + encodeURIComponent(form.captcha_code.value) : '') + '&rememberme=' + form.rememberme.value);
e.preventDefault();
}
/* ]]> */
</script>
</html>
</body>
</html>

0 comments on commit 3ac1ef3

Please sign in to comment.