|
@@ -37,118 +37,118 @@
|
|
<div class="gap-20" fxFlex.lt-md="100" fxFlex.gt-sm="80">
|
|
<div class="gap-20" fxFlex.lt-md="100" fxFlex.gt-sm="80">
|
|
<div fxLayout="row" fxLayoutAlign="start start" class="gap-20">
|
|
<div fxLayout="row" fxLayoutAlign="start start" class="gap-20">
|
|
<div
|
|
<div
|
|
|
|
+ class="form-input"
|
|
fxLayout="column"
|
|
fxLayout="column"
|
|
fxLayoutAlign="start stretch"
|
|
fxLayoutAlign="start stretch"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.gt-sm="50"
|
|
fxFlex.gt-sm="50"
|
|
>
|
|
>
|
|
- <mat-label>Choose a date</mat-label>
|
|
|
|
- <mat-form-field appearance="outline">
|
|
|
|
- <input matInput [matDatepicker]="picker" />
|
|
|
|
- <mat-datepicker-toggle
|
|
|
|
- matIconSuffix
|
|
|
|
- [for]="picker"
|
|
|
|
- ></mat-datepicker-toggle>
|
|
|
|
- <mat-datepicker #picker></mat-datepicker>
|
|
|
|
- </mat-form-field>
|
|
|
|
|
|
+ <label for="birth_date" class="plr-30">
|
|
|
|
+ <img
|
|
|
|
+ src="assets/images/birthday-cake-candle-pie-svgrepo-com.svg"
|
|
|
|
+ alt=""
|
|
|
|
+ title=""
|
|
|
|
+ />
|
|
|
|
+ <span>Birth Date<span class="red">*</span></span>
|
|
|
|
+ </label>
|
|
|
|
+ <input type="date" id="birth_date" placeholder="Select Date" />
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div
|
|
<div
|
|
|
|
+ class="form-input"
|
|
fxLayout="column"
|
|
fxLayout="column"
|
|
fxLayoutAlign="start stretch"
|
|
fxLayoutAlign="start stretch"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.gt-sm="50"
|
|
fxFlex.gt-sm="50"
|
|
>
|
|
>
|
|
- <mat-label>ID Number</mat-label>
|
|
|
|
-
|
|
|
|
- <mat-form-field
|
|
|
|
- appearance="outline"
|
|
|
|
- fxFlex.lt-md="100"
|
|
|
|
- fxFlex.gt-sm="50"
|
|
|
|
- >
|
|
|
|
- <input matInput />
|
|
|
|
- </mat-form-field>
|
|
|
|
|
|
+ <label for="tax_no" class="plr-30">
|
|
|
|
+ <img src="assets/images/id-card-svgrepo-com.svg" alt="" title="" />
|
|
|
|
+ <span>ID Number <span class="red">*</span></span>
|
|
|
|
+ </label>
|
|
|
|
+ <input type="text" id="tax_no" placeholder="ID Number" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
- <div fxLayout="row" fxLayoutAlign="start start" class="gap-20">
|
|
|
|
|
|
+ <div fxLayout="row" fxLayoutAlign="start start" class="gap-20 mt-2">
|
|
<div
|
|
<div
|
|
|
|
+ class="form-input"
|
|
fxLayout="column"
|
|
fxLayout="column"
|
|
fxLayoutAlign="start stretch"
|
|
fxLayoutAlign="start stretch"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.gt-sm="50"
|
|
fxFlex.gt-sm="50"
|
|
>
|
|
>
|
|
- <mat-label>Email</mat-label>
|
|
|
|
-
|
|
|
|
- <mat-form-field
|
|
|
|
- appearance="outline"
|
|
|
|
- fxFlex.lt-md="100"
|
|
|
|
- fxFlex.gt-sm="50"
|
|
|
|
- >
|
|
|
|
- <input type="email" matInput placeholder="Ex. pat@example.com" />
|
|
|
|
- </mat-form-field>
|
|
|
|
|
|
+ <label for="email">
|
|
|
|
+ <img src="assets/images/email-9-svgrepo-com" alt="" title="" />
|
|
|
|
+ <span>Email<span class="red">*</span></span>
|
|
|
|
+ </label>
|
|
|
|
+ <input type="email" id="email" placeholder="Enter your email" />
|
|
</div>
|
|
</div>
|
|
<div
|
|
<div
|
|
|
|
+ class="form-input"
|
|
fxLayout="column"
|
|
fxLayout="column"
|
|
fxLayoutAlign="start stretch"
|
|
fxLayoutAlign="start stretch"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.gt-sm="50"
|
|
fxFlex.gt-sm="50"
|
|
>
|
|
>
|
|
- <mat-label>Passport Number</mat-label>
|
|
|
|
-
|
|
|
|
- <mat-form-field
|
|
|
|
- appearance="outline"
|
|
|
|
- fxFlex.lt-md="100"
|
|
|
|
- fxFlex.gt-sm="50"
|
|
|
|
- >
|
|
|
|
- <input matInput />
|
|
|
|
- </mat-form-field>
|
|
|
|
|
|
+ <label for="passprt">
|
|
|
|
+ <img
|
|
|
|
+ src="../../../../assets/images/passport-svgrepo-com.svg"
|
|
|
|
+ alt=""
|
|
|
|
+ title=""
|
|
|
|
+ />
|
|
|
|
+ <span>Passport Number <span class="red">*</span></span>
|
|
|
|
+ </label>
|
|
|
|
+ <input type="text" id="postal" placeholder="Passport Number" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
- <div fxLayout="row" fxLayoutAlign="start start" class="gap-20">
|
|
|
|
|
|
+ <div fxLayout="row" fxLayoutAlign="start start" class="gap-20 mt-2">
|
|
<div
|
|
<div
|
|
|
|
+ class="form-input"
|
|
fxLayout="column"
|
|
fxLayout="column"
|
|
fxLayoutAlign="start stretch"
|
|
fxLayoutAlign="start stretch"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.gt-sm="50"
|
|
fxFlex.gt-sm="50"
|
|
>
|
|
>
|
|
- <mat-label>Mobile Number</mat-label>
|
|
|
|
- <mat-form-field
|
|
|
|
- appearance="outline"
|
|
|
|
- fxFlex.lt-md="100"
|
|
|
|
- fxFlex.gt-sm="50"
|
|
|
|
- >
|
|
|
|
- <input matInput />
|
|
|
|
- </mat-form-field>
|
|
|
|
|
|
+ <label for="mobile_number">
|
|
|
|
+ <img
|
|
|
|
+ src="assets/images/mobile-horizontal-svgrepo-com.svg"
|
|
|
|
+ alt=""
|
|
|
|
+ title=""
|
|
|
|
+ />
|
|
|
|
+ <span>Mobile Number <span class="red">*</span></span>
|
|
|
|
+ </label>
|
|
|
|
+ <input type="text" id="mobile_number" placeholder="Mobile Number" />
|
|
</div>
|
|
</div>
|
|
<div
|
|
<div
|
|
|
|
+ class="form-input"
|
|
fxLayout="column"
|
|
fxLayout="column"
|
|
fxLayoutAlign="start stretch"
|
|
fxLayoutAlign="start stretch"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.lt-md="100"
|
|
fxFlex.gt-sm="50"
|
|
fxFlex.gt-sm="50"
|
|
>
|
|
>
|
|
- <mat-label>tax declaration</mat-label>
|
|
|
|
-
|
|
|
|
- <div class="gap-20" fxLayout="row" fxLayoutAlign="center center">
|
|
|
|
- <mat-form-field
|
|
|
|
- appearance="outline"
|
|
|
|
- fxFlex.lt-md="100"
|
|
|
|
- fxFlex.gt-sm="50"
|
|
|
|
- >
|
|
|
|
- <mat-label>tax declaration number</mat-label>
|
|
|
|
- <input matInput />
|
|
|
|
- </mat-form-field>
|
|
|
|
-
|
|
|
|
- <mat-form-field
|
|
|
|
- appearance="outline"
|
|
|
|
- fxFlex.lt-md="100"
|
|
|
|
- fxFlex.gt-sm="50"
|
|
|
|
- >
|
|
|
|
- <mat-label>Income tax value</mat-label>
|
|
|
|
- <input matInput />
|
|
|
|
- </mat-form-field>
|
|
|
|
- <button class="save-changes btn calc">0.0</button>
|
|
|
|
|
|
+ <label for="tax_decoration">
|
|
|
|
+ <img
|
|
|
|
+ src="../../../../assets/images/tax-fee-svgrepo-com.svg"
|
|
|
|
+ alt=""
|
|
|
|
+ title=""
|
|
|
|
+ />
|
|
|
|
+ <span>Tax Decoration <span class="red">*</span></span>
|
|
|
|
+ </label>
|
|
|
|
+ <div fxLayout="row wrap" fxLayoutAlign="start center" class="gap-10">
|
|
|
|
+ <input
|
|
|
|
+ type="text"
|
|
|
|
+ id="tax_decoration_number"
|
|
|
|
+ placeholder="number"
|
|
|
|
+ class="decoration"
|
|
|
|
+ />
|
|
|
|
+ <input
|
|
|
|
+ type="text"
|
|
|
|
+ id="tax_decoration_value"
|
|
|
|
+ placeholder="value"
|
|
|
|
+ class="decoration"
|
|
|
|
+ />
|
|
|
|
+ <input type="text" class="calc" placeholder="0.0" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|