WrenchBoard/WrenchBoardIonic2023
2
0
Fork 0
Code Issues Pull Requests Releases Activity

style login page

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2024-09-05 06:24:41 -04:00
parent 652cccbbc3
commit 650f7f2410
2 changed files with 46 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/login/login.page.html
+44 -21
View File
@@ -1,5 +1,5 @@
<ion-content class="ion-padding no-scroll">
<div class="start-pages">
<ion-content class="no-scroll" style="padding: 0;">
<div class="start-pages" >
<div class="page_logo">
<img alt="WrenchBoard" src="/assets/images/wrenchboard-line.png" />
</div>
@@ -40,29 +40,52 @@
<!-- </ion-row>-->
<!-- </ion-grid>-->
<!-- <div style="display: flex;">-->
<!-- <ion-label class="simp_lbl_tx" style="width: 50%;">Login or</ion-label>-->
<ion-label class="simp_lbl_tx">Login to continue</ion-label>
<ion-item lines="none">
<ion-icon slot="start" name="mail-outline"></ion-icon>
<ion-input (ionChange)="refreshBut()" type="email" placeholder="Email" maxlength="35" [(ngModel)]='username'></ion-input>
</ion-item>
<ion-item lines="none">
<ion-icon slot="start" name="lock-closed-outline"></ion-icon>
<ion-input (ionChange)="refreshBut()" type="password" placeholder="Password" maxlength="15" [(ngModel)]='password'></ion-input>
</ion-item>
<!-- <ion-label class="simp_lbl_tx" style="width: 50%; text-align: right;" ><div (click)="onRegister()">Sign up</div></ion-label>-->
<!-- </div>-->
<div style="padding: 10px; background-color: #F6F6FF; border-radius: 10px; box-shadow: 3px 3px #d3d3d3; margin-top: 10px; max-width: 450px; margin-left: auto; margin-right: auto;">
<ion-item lines="none">
<ion-icon slot="start" name="mail-outline"></ion-icon>
<ion-input
style="background-color: white; border-radius: 5px;"
(ionChange)="refreshBut()" type="email"
placeholder="Email"
maxlength="35"
[(ngModel)]='username'></ion-input>
</ion-item>
<ion-item lines="none">
<ion-icon slot="start" name="lock-closed-outline"></ion-icon>
<ion-input
style="background-color: white; border-radius: 5px;"
(ionChange)="refreshBut()"
type="password"
placeholder="Password"
maxlength="15"
[(ngModel)]='password'></ion-input>
</ion-item>
<div class="check" style="padding-left: 35px;">
<ion-checkbox mode="md" checked></ion-checkbox>
<ion-label>Remember me</ion-label>
</div>
<div style="margin-left: 55px;">
<ion-button
size="small"
shape="round"
expand="block"
(click)="startLogin()"
[disabled]="isDisabled"
>
Login
</ion-button>
</div>
<div class="check" style="padding-left: 35px;">
<ion-checkbox mode="md" checked></ion-checkbox>
<ion-label>Remember me</ion-label>
</div>
<ion-button shape="round" expand="block"
(click)="startLogin()"
[disabled]="isDisabled"
>
Login
</ion-button>
<!-- <ion-button shape="round">Round</ion-button>-->
<ion-label class="forgot_lbl" (click)="onForgot()">Forgot your password ?</ion-label>
@@ -92,7 +115,7 @@
</div>
<div class="bottom">
<ion-label class="last_lbl">Don't have an account? <span (click)="onRegister()">Register</span></ion-label>
<ion-label class="last_lbl">Don't have an account? <span (click)="onRegister()">Sign up</span></ion-label>
</div>
</div>
src/global.scss
+2 -2
View File
@@ -138,7 +138,7 @@ ion-modal.custom_modal_bottom {
.page_logo{
text-align: center;
margin-top: 30px;
margin-top: 40px;
// background-color: red;
}
@@ -237,7 +237,7 @@ ion-content{
.start-pages{
// background-color: #3dc2ff;
background-image: linear-gradient(white, aliceblue);
margin-top: 0px;
margin: 0px;
height: 100%;
width: 100%;
}