Fixes some styling, wording and validation

This commit is contained in:
Shannon
2016-04-12 18:59:39 +02:00
parent 1361e017a2
commit d424b13ac4
5 changed files with 52 additions and 32 deletions

View File

@@ -75,10 +75,7 @@
}
.login-overlay .switch-view {
margin-top: 10px;
a {
color: #fff;
}
margin-top: 10px;
}
@media (max-width: 565px) {
@@ -115,3 +112,9 @@
margin: auto;
color: @grayLight;
}
.login-overlay .text-error,
.login-overlay .text-info
{
font-weight:bold;
}

View File

@@ -7,29 +7,44 @@
});
}
function resetInputValidation() {
if ($scope.loginForm) {
$scope.loginForm.username.$setValidity('auth', true);
$scope.loginForm.password.$setValidity('auth', true);
}
if ($scope.requestPasswordResetForm) {
$scope.requestPasswordResetForm.email.$setValidity("auth", true);
}
if ($scope.setPasswordForm) {
$scope.setPasswordForm.password.$setValidity('auth', true);
$scope.setPasswordForm.confirmPassword.$setValidity('auth', true);
}
}
$scope.allowPasswordReset = Umbraco.Sys.ServerVariables.umbracoSettings.allowPasswordReset;
$scope.showLogin = function () {
$scope.errorMsg = "";
resetInputValidation();
$scope.view = "login";
setFieldFocus("loginForm", "username");
}
$scope.showRequestPasswordReset = function () {
$scope.errorMsg = "";
resetInputValidation();
$scope.view = "request-password-reset";
$scope.showEmailResetConfirmation = false;
setFieldFocus("requestPasswordResetForm", "email");
}
$scope.showSetPassword = function () {
$scope.errorMsg = "";
resetInputValidation();
$scope.view = "set-password";
setFieldFocus("setPasswordForm", "password");
}
var d = new Date();
var konamiGreetings = new Array("Suze Sunday", "Malibu Monday", "Tequila Tuesday", "Whiskey Wednesday", "Negroni Day", "Fernet Friday", "Sancerre Saturday");
var konamiMode = $cookies.konamiLogin;

View File

@@ -1,5 +1,5 @@
<div ng-controller="Umbraco.Dialogs.LoginController">
<div id="login" class="umb-modalcolumn" ng-class="{'show-validation': loginForm.$invalid}" ng-cloak konami-code="activateKonamiMode()">
<div id="login" class="umb-modalcolumn umb-dialog" ng-class="{'show-validation': loginForm.$invalid}" ng-cloak konami-code="activateKonamiMode()">
<div class="form">
<h1>{{greeting}}</h1>
@@ -12,7 +12,7 @@
<div class="external-logins" ng-if="externalLoginProviders.length > 0">
<div class="alert alert-error" ng-repeat="error in externalLoginInfo.errors">
<div class="text-error" ng-repeat="error in externalLoginInfo.errors">
<span>{{error}}</span>
</div>
@@ -46,15 +46,15 @@
<div class="control-group" ng-class="{error: loginForm.password.$invalid}">
<input type="password" ng-model="password" name="password" class="input-xlarge" localize="placeholder" placeholder="@placeholders_password" autocomplete="off" />
</div>
<div class="control-group" ng-show="loginForm.$invalid">
<div class="text-error">{{errorMsg}}</div>
</div>
<button type="submit" class="btn" val-trigger-change="#login .form input"><localize key="general_login">Login</localize></button>
<div class="control-group" ng-show="loginForm.$invalid">
<div class="alert alert-error">{{errorMsg}}</div>
</div>
<div class="switch-view" ng-show="allowPasswordReset">
<a href="#" prevent-default ng-click="showRequestPasswordReset()"><localize key="login_forgottenPassword">Forgotten password?</localize></a>
<a class="muted" href="#" prevent-default ng-click="showRequestPasswordReset()"><localize key="login_forgottenPassword">Forgotten password?</localize></a>
</div>
</form>
</div>
@@ -68,21 +68,21 @@
<div class="control-group" ng-class="{error: requestPasswordResetForm.email.$invalid}">
<input type="text" ng-model="email" name="email" class="input-xlarge" localize="placeholder" placeholder="@placeholders_email" />
</div>
<button type="submit" class="btn" val-trigger-change="#login .form input"><localize key="general_submit">Submit</localize></button>
<div class="control-group" ng-show="requestPasswordResetForm.$invalid">
<div class="alert alert-error">{{errorMsg}}</div>
<div class="text-error">{{errorMsg}}</div>
</div>
<div class="control-group" ng-show="showEmailResetConfirmation">
<div class="alert alert-success">
<div class="text-info">
<localize key="login_requestPasswordResetConfirmation">If your email address has been matched an email with password reset instructions has been sent.</localize>
</div>
</div>
<button type="submit" class="btn" val-trigger-change="#login .form input"><localize key="general_submit">Submit</localize></button>
<div class="switch-view">
<a href="#" prevent-default ng-click="showLogin()"><localize key="login_returnToLogin">Return to login form</localize></a>
<a class="muted" href="#" prevent-default ng-click="showLogin()"><localize key="login_returnToLogin">Return to login form</localize></a>
</div>
</form>
</div>
@@ -101,17 +101,19 @@
<div class="control-group" ng-class="{error: setPasswordForm.confirmPassword.$invalid}">
<input type="password" ng-model="confirmPassword" name="confirmPassword" class="input-xlarge" localize="placeholder" placeholder="@placeholders_confirmPassword" />
</div>
<button type="submit" class="btn" val-trigger-change="#login .form input"><localize key="general_submit">Submit</localize></button>
<div class="control-group" ng-show="setPasswordForm.$invalid">
<div class="alert alert-error">{{errorMsg}}</div>
<div class="text-error">{{errorMsg}}</div>
</div>
<p class="alert" ng-show="showSetPasswordConfirmation">
<localize key="login_setPasswordConfirmation">Your new password has been set and you may now use it to log in.</localize>
<p class="control-group" ng-show="showSetPasswordConfirmation">
<div class="text-info">
<localize key="login_setPasswordConfirmation">Your new password has been set and you may now use it to log in.</localize>
</div>
</p>
<button type="submit" class="btn" val-trigger-change="#login .form input"><localize key="general_submit">Submit</localize></button>
<div class="switch-view">
<a href="#" prevent-default ng-click="showLogin()"><localize key="login_returnToLogin">Return to login form</localize></a>
</div>
@@ -119,7 +121,7 @@
</div>
<div ng-show="view == 'password-reset-code-expired'">
<div class="alert alert-error">
<div class="text-error">
<localize key="login_resetCodeExpired">The link you have clicked on is invalid or has expired.</localize>
</div>
<div class="switch-view">

View File

@@ -663,8 +663,8 @@ To manage your website, simply open the Umbraco back office and start adding con
<key alias="timeout">Session timed out</key>
<key alias="bottomText"><![CDATA[<p style="text-align:right;">&copy; 2001 - %0% <br /><a href="http://umbraco.com" style="text-decoration: none" target="_blank">Umbraco.com</a></p> ]]></key>
<key alias="forgottenPassword">Forgotten password?</key>
<key alias="forgottenPasswordInstruction">Please enter your email address. If your account is located an email will be sent to you containing a link from which you can reset your password.</key>
<key alias="requestPasswordResetConfirmation">If your email address has been matched an email with password reset instructions has been sent.</key>
<key alias="forgottenPasswordInstruction">An email will be sent to the address specified with a link to reset your password</key>
<key alias="requestPasswordResetConfirmation">An email with password reset instructions will be sent to the specified address if it matched our records</key>
<key alias="returnToLogin">Return to login form</key>
<key alias="setPasswordInstruction">Please provide a new password.</key>
<key alias="setPasswordConfirmation">Your new password has been set and you may now use it to log in.</key>

View File

@@ -661,8 +661,8 @@ To manage your website, simply open the Umbraco back office and start adding con
<key alias="timeout">Session timed out</key>
<key alias="bottomText"><![CDATA[<p style="text-align:right;">&copy; 2001 - %0% <br /><a href="http://umbraco.com" style="text-decoration: none" target="_blank">Umbraco.com</a></p> ]]></key>
<key alias="forgottenPassword">Forgotten password?</key>
<key alias="forgottenPasswordInstruction">Please enter your email address. If your account is located an email will be sent to you containing a link from which you can reset your password.</key>
<key alias="requestPasswordResetConfirmation">If your email address has been matched an email with password reset instructions has been sent.</key>
<key alias="forgottenPasswordInstruction">An email will be sent to the address specified with a link to reset your password</key>
<key alias="requestPasswordResetConfirmation">An email with password reset instructions will be sent to the specified address if it matched our records</key>
<key alias="returnToLogin">Return to login form</key>
<key alias="setPasswordInstruction">Please provide a new password.</key>
<key alias="setPasswordConfirmation">Your new password has been set and you may now use it to log in.</key>