design test

This commit is contained in:
sunny 2018-04-11 19:51:50 +09:00
parent 450cc0c6d9
commit 96e27054b2
12 changed files with 88 additions and 116 deletions

View File

@ -1 +1,3 @@
<router-outlet></router-outlet>
<div class="login-body">
<router-outlet></router-outlet>
</div>

View File

@ -0,0 +1,33 @@
$image_path: "/assets/layout/images/" !default;
.auth_background {
background-image:url($image_path + 'login11.jpg');
margin: 0;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.auth_card {
position: relative;
margin: auto auto;
width: 500px;
}
$prefix: 'auth';
.#{$prefix} {
&-container {
background-image:url($image_path + 'login11.jpg');
min-height: 100%;
background-size: cover;
padding: 10px auto;
}
&-main {
position: relative;
margin: auto auto;
width: 500px;
}
}

View File

@ -1,12 +1 @@
<div fxLayout="column" fxFlexFill fxLayoutAlign="center center" style="background-image:url('../../../../../assets/images/login11.jpg');
margin-top: 10px;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover; ">
<div fxLayout="column" >
<div class=" mat-elevation-z4">
<of-member-signin></of-member-signin>
</div>
</div>
</div>
<of-member-signin></of-member-signin>

View File

@ -1,13 +1 @@
<div fxLayout="column" fxFlexFill fxLayoutAlign="center center" style="background-image:url('../../../../../assets/images/login11.jpg');
margin-top: 10px;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover; ">
<div fxLayout="column" >
<div class=" mat-elevation-z4">
<of-member-signup></of-member-signup>
</div>
</div>
</div>
<of-member-signup></of-member-signup>

Binary file not shown.

After

Width:  |  Height:  |  Size: 326 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

View File

@ -1 +1,29 @@
<div>reset-password</div>
<form [formGroup]="resetPassword" (ngSubmit)="sendResetPassword()">
<div class="card login-panel ui-fluid">
<div class="ui-g">
<div class="ui-g-12">
<!--img src="assets/layout/images/logo-ultima.svg" -->
<img src="assets/layout/images/overFlow_CI_blue_185.png">
</div>
<div class="ui-g-12">
<span class="md-inputfield">
<input type="email" id="email" autocomplete="off" placeholder="Please enter your email" formControlName="email" required class="ui-inputtext ui-corner-all ui-state-default ui-widget">
</span>
<div *ngIf="formErrors.email" class="help is-danger">
{{ formErrors.email }}
</div>
</div>
<div class="ui-g-12">
<button (click)="sendResetPassword()" type="submit" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
<span class="ui-button-icon-left ui-c fa fa-fw ui-icon-person"></span>
<span class="ui-button-text ui-c">Reset Password</span>
</button>
<a href="#" (click)="signinBtnClick()">Sign In</a>
|
<a href="#" (click)="signupBtnClick()">Sign Up</a>
</div>
</div>
</div>
</form>

View File

@ -1,40 +0,0 @@
$gray-lighter: #eceeef !default;
$image_path: "/assets/images/" !default;
$prefix: 'reset-password';
.#{$prefix} {
&-conainer {
min-height: 100%;
background-size: cover;
padding: 100px;
}
&-main {
position: relative;
margin: 0 auto;
width: 500px;
}
}
.full-width {
width: 100%;
}
.help {
}
.is-danger {
}
.button {
width:300px;
}
.redirect {
font-size: 14px;
margin-left: 10px;
color: #00AAAA;
}

View File

@ -2,7 +2,7 @@
<div class="card login-panel ui-fluid">
<div class="ui-g">
<div class="ui-g-12">
<img src="assets/layout/images/logo-ultima.svg">
<img src="assets/layout/images/overFlow_CI_blue_185.png">
</div>
<div class="ui-g-12">
<span class="md-inputfield">
@ -19,16 +19,9 @@
<span class="ui-button-icon-left ui-c fa fa-fw ui-icon-person"></span>
<span class="ui-button-text ui-c">Sign In</span>
</button>
<button type="button" (click)="resetPasswordBtnClick()" class="secondary ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
<span class="ui-button-icon-left ui-c fa fa-fw ui-icon-help"></span>
<span class="ui-button-text ui-c">Forgot Password</span>
</button>
<button type="button" (click)="signupBtnClick()" class="secondary ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
<span class="ui-button-icon-left ui-c fa fa-fw ui-icon-help"></span>
<span class="ui-button-text ui-c">Sign Up</span>
</button>
<a href="javascript:void(0)" (click)="resetPasswordBtnClick()">Forgot Password</a>
|
<a href="javascript:void(0)" (click)="signupBtnClick()">Sign Up</a>
</div>
</div>
</div>

View File

@ -2,7 +2,7 @@
<div class="card login-panel ui-fluid">
<div class="ui-g">
<div class="ui-g-12">
<img src="assets/layout/images/logo-ultima.svg">
<img src="assets/layout/images/overFlow_CI_blue_185.png">
</div>
<div class="ui-g-12">
<span class="md-inputfield">
@ -63,6 +63,8 @@
<span class="ui-button-icon-left ui-c fa fa-fw ui-icon-person"></span>
<span class="ui-button-text ui-c">Sign Up</span>
</button>
<a href="#">Sign In</a>
</div>
</div>
</div>

View File

@ -1,37 +0,0 @@
$gray-lighter: #eceeef !default;
$image_path: "/assets/images/" !default;
$prefix: 'signup';
.#{$prefix} {
&-conainer {
min-height: 100%;
background-size: cover;
padding: 100px;
}
&-main {
position: relative;
margin: 0 auto;
width: 500px;
}
}
.full-width {
width: 100%;
}
.help {
}
.is-danger {
}
.redirect {
font-size: 14px;
margin-left: 10px;
color: #00AAAA;
}

View File

@ -1 +1,15 @@
/* You can add global styles to this file, and also import other style files */
//auth style
.login-body {
//background: url("../images/login/login.png") top left no-repeat #f7f7f7;
background: url("/assets/layout/images/login11.jpg") top left no-repeat #f7f7f7 !important;
margin: -100px 0 0 0 !important;
padding: 100px 0 !important;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.login-body {
//background: url("../images/login/login2x.png") top left no-repeat #f7f7f7;
background: url("/assets/layout/images/login11.jpg") top left no-repeat #f7f7f7 !important;
}
}