vmario/docs
1
0
Fork 0
mirror of https://github.com/sismics/docs.git synced 2024-11-22 05:57:57 +01:00
Code Issues Packages Projects Releases Wiki Activity

login design refresh

Browse Source
This commit is contained in:
Benjamin Gamard 2018-03-01 17:10:48 +01:00
parent 4795d8f48c
commit b13c2ccd32
3 changed files with 85 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs-web/src/main/webapp/src/img/title.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

39
docs-web/src/main/webapp/src/partial/docs/login.html
View File

@ -8,12 +8,29 @@
.footer { .footer {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0;
right: 0;
border: none; border: none;
color: #fff; }
@media screen and (min-width: 768px) {
.footer {
width: 50%;
}
}
/* Smaller links everywhere on login */
a {
font-size: 90%;
color: #666;
} }
</style> </style>
<div class="row vertical-center login-box-container"> <div class="row vertical-center">
<div class="col-sm-offset-5 col-sm-2 col-xs-offset-1 col-xs-10 login-box"> <div class="col-sm-6 col-xs-12 login-box">
<div class="row">
<div class="col-sm-offset-4 col-sm-4 col-xs-offset-1 col-xs-10">
<img src="img/title.png" class="img-responsive" />
<form> <form>
<div class="form-group"> <div class="form-group">
<label class="sr-only" for="inputUsername">{{ 'login.username' | translate }}</label> <label class="sr-only" for="inputUsername">{{ 'login.username' | translate }}</label>
@ -34,19 +51,25 @@
<input class="form-control" type="text" id="inputCode" ng-attr-placeholder="{{ 'login.validation_code' | translate }}" ng-model="user.code" /> <input class="form-control" type="text" id="inputCode" ng-attr-placeholder="{{ 'login.validation_code' | translate }}" ng-model="user.code" />
</div> </div>
<div class="checkbox"> <div class="checkbox text-muted">
<label> <label>
<input type="checkbox" ng-model="user.remember" /> {{ 'login.remember_me' | translate }} <input type="checkbox" ng-model="user.remember" /> {{ 'login.remember_me' | translate }}
</label> </label>
</div> </div>
<button type="submit" class="btn btn-primary btn-block" ng-click="login()"> <div class="row">
<div class="col-md-6">
<button type="submit" class="btn btn-primary" ng-click="login()">
<span class="glyphicon glyphicon-ok"></span> {{ 'login.submit' | translate }} <span class="glyphicon glyphicon-ok"></span> {{ 'login.submit' | translate }}
</button> </button>
</div>
<div class="text-center well-sm btn-password-lost"> <div class="col-md-6 text-right btn-password-lost">
<div class="well-sm">
<a href ng-click="openPasswordLost()">{{ 'login.password_lost_btn' | translate }}</a> <a href ng-click="openPasswordLost()">{{ 'login.password_lost_btn' | translate }}</a>
</div> </div>
</div>
</div>
<p class="text-center" ng-if="app.guest_login">&nbsp;</p> <p class="text-center" ng-if="app.guest_login">&nbsp;</p>
@ -56,3 +79,7 @@
</form> </form>
</div> </div>
</div> </div>
</div>
<div class="login-img-container col-sm-6 hidden-xs"></div>
</div>

24
docs-web/src/main/webapp/src/style/main.less
View File

@ -413,22 +413,30 @@ input[readonly].share-link {
} }
// Login // Login
.login-box-container { .login-img-container {
background: url('../../api/theme/image/background') no-repeat center; background: url('../../api/theme/image/background') no-repeat center;
background-size: cover; background-size: cover;
height: 100%;
box-shadow: 0 0 0 1px rgba(136,152,170,.1), 0 15px 35px 0 rgba(49,49,93,.1), 0 5px 15px 0 rgba(0,0,0,.13);
} }
.login-box { .login-box {
background: rgba(255, 255, 255, 0.5);
padding: 20px;
.help-block, .checkbox {
color: white;
}
.btn-password-lost { .btn-password-lost {
padding-bottom: 0; padding-bottom: 0;
} }
form .row .col-md-6 {
padding: 0;
}
.btn-primary {
background-color: #2aabd2;
border-color: transparent;
}
.img-responsive {
margin-bottom: 30px;
}
} }
/* Styling for the ngProgress itself */ /* Styling for the ngProgress itself */