Files
WrenchBoardIonic2023/src/app/pages/register/register.page.html
T
CHIEFSOFT\ameye 26d07c5578 fix html layout
2025-05-25 13:30:36 -04:00

220 lines
7.7 KiB
HTML

<ion-content class="no-scroll" style="padding: 0">
<div class="start-pages">
<div class="page_logo" style="padding-top: 15px">
<img alt="WrenchBoard" src="/assets/images/wrenchboard-line.png" />
</div>
<div class="boxed_contents">
<div class="ion-padding space">
<div *ngIf="signup_state==1; then startBlock"></div>
<div *ngIf="signup_state==2; then secondBlock"></div>
<ng-template #startBlock>
<div>
<div class="login_box">
<ion-label
style="padding-top: 2px; padding-bottom: 10px"
class="simp_lbl"
>Get Started</ion-label
>
<ion-item lines="none" style="margin-bottom: 10px">
<ion-icon slot="start" name="flag-outline"></ion-icon>
<ion-select
style="width: 100%; padding-left: 10px"
class="login_entry"
(ionChange)="verReg()"
label="Select Country"
placeholder="Select Country"
[(ngModel)]="country"
>
<ion-select-option
*ngFor="let item of signupCountry"
value="{{item.code}}"
>{{item.country}}</ion-select-option
>
</ion-select>
</ion-item>
<ion-item lines="none" style="margin-bottom: 10px">
<ion-icon slot="start" name="person-outline"></ion-icon>
<ion-input
class="login_entry"
maxlength="25"
(ionChange)="verReg()"
type="firstname"
placeholder="Firstname"
[(ngModel)]="firstname"
></ion-input>
</ion-item>
<ion-item lines="none" style="margin-bottom: 10px">
<ion-icon slot="start" name="person-outline"></ion-icon>
<ion-input
class="login_entry"
maxlength="25"
(ionChange)="verReg()"
type="lastname"
placeholder="Lastname"
[(ngModel)]="lastname"
></ion-input>
</ion-item>
<ion-item lines="none" style="margin-bottom: 10px">
<ion-icon slot="start" name="mail-outline"></ion-icon>
<ion-input
class="login_entry"
(ionChange)="verReg()"
type="username"
maxlength="35"
placeholder="Email (Your Username)"
[(ngModel)]="username"
></ion-input>
</ion-item>
<ion-item lines="none" style="margin-bottom: 0px">
<ion-icon slot="start" name="lock-closed-outline"></ion-icon>
<ion-input
class="login_entry"
(ionChange)="verReg()"
type="password"
placeholder="Password (8 chars. minimum)"
maxlength="15"
[(ngModel)]="password"
></ion-input>
</ion-item>
<ion-item
lines="none"
style="margin-bottom: 10px; padding-left: 50px"
>
<div>.</div>
</ion-item>
<ion-button
expand="block"
[disabled]="isDisabled"
(click)="onFillProfile()"
>
Register
</ion-button>
</div>
<div *ngIf="showSocial == true ">
<ion-label class="or">Or Continue With</ion-label>
<div class="button">
<ion-buttons>
<ion-button>
<ion-icon name="logo-facebook"></ion-icon>
</ion-button>
</ion-buttons>
<ion-buttons>
<ion-button>
<ion-icon name="logo-google"></ion-icon>
</ion-button>
</ion-buttons>
<ion-buttons>
<ion-button>
<ion-icon name="logo-twitter"></ion-icon>
</ion-button>
</ion-buttons>
</div>
</div>
</div>
</ng-template>
<ng-template #secondBlock>
<div>
<ion-label class="simp_lbl">Complete Account</ion-label>
<div class="login_box">
<ion-grid style="margin-top: 15px">
<ion-row>
<ion-col size="3" class="side_lb">Country</ion-col>
<ion-col size="9">{{signup_country}}</ion-col>
</ion-row>
<ion-row>
<ion-col size="3" class="side_lb">Username</ion-col>
<ion-col size="9">{{signup_username}}</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-label
class="or"
style="
width: 100%;
background-color: #f5eff4;
color: red;
font-weight: bolder;
height: 45px;
margin: 5px;
padding: 10px;
border-radius: 10px;
"
>Enter Confirmation Received In Email</ion-label
>
</ion-col>
</ion-row>
<ion-row>
<ion-col size="4" class="side_lb">
Verification Code :
</ion-col>
<ion-col size="8">
<!-- <ion-icon slot="start" name="mail-outline"></ion-icon>-->
<ion-input
type="text"
autocomplete="false"
class="login_entry"
(ionChange)="verReg2()"
placeholder="Random text"
maxlength="8"
[(ngModel)]="random_text"
></ion-input>
</ion-col>
</ion-row>
<ion-row>
<ion-col size="4" class="side_lb">Password</ion-col>
<ion-col size="8">
<ion-icon
slot="start"
name="lock-closed-outline"
></ion-icon>
<ion-input
type="password"
class="login_entry"
(ionChange)="verReg2()"
placeholder="Password"
maxlength="15"
[(ngModel)]="password"
></ion-input>
</ion-col>
</ion-row>
<ion-row>
<ion-col size="4"></ion-col>
<ion-col size="8" style="text-align: right">
<ion-button
expand="block"
[disabled]="isDisabled2"
(click)="onCompleteProfile()"
>
Complete Signup
</ion-button>
</ion-col>
<!-- <ion-col size="2"></ion-col>-->
</ion-row>
</ion-grid>
</div>
</div>
</ng-template>
<div class="bottom">
<ion-label class="last_lbl"
>Already have an account?
<span (click)="onLogin()">Login</span></ion-label
>
</div>
</div>
</div>
</div>
</ion-content>