blueprints/common/eliot-ui/frontend-src/src/app/signup/signup.component.html

   1 <!-- <div> -->
   2     <div id="particles-js"></div>
   3     <script src="http://www.jsdelivr.com/#!particles-js"></script>
   4 <div class="bg-image">
   5     <mat-card class="signup-card">
   6         <mat-card-header>
   7             <mat-card-title>ELIOT Portal Signup</mat-card-title>
   8         </mat-card-header>
   9         <mat-card-content>
  10             <form [formGroup]="signupForm" (ngSubmit)="onFormSubmit()">
  11                 <mat-form-field class="login-full-width">
  12                     <input matInput placeholder="Username" formControlName="username" name="username" required>
  13                 </mat-form-field>
  14                 <mat-form-field class="login-full-width">
  15                     <input matInput placeholder="Password" formControlName="password" [type]="hide ? 'password' : 'text'"
  16                     required >
  17                     <mat-icon matSuffix (click)="hide = !hide">{{hide ? 'visibility_off':'visibility'}}</mat-icon>
  18                 </mat-form-field>
  19                 <mat-form-field class="login-full-width">
  20                     <input matInput placeholder="First Name" formControlName="firstname" name="firstname" required>
  21                 </mat-form-field>
  22                 <mat-form-field class="login-full-width">
  23                     <input matInput placeholder="Last Name" formControlName="lastname" name="lastname" required>
  24                 </mat-form-field>
  25                 <mat-form-field class="login-full-width">
  26                     <input matInput placeholder="Email" formControlName="email" name="email" required>
  27                 </mat-form-field>
  28                 <mat-form-field class="login-full-width">
  29                     <input matInput placeholder="ROLE: ADMIN / DEVELOPER" formControlName="email" name="email" required>
  30                 </mat-form-field>
  31
  32                 <button mat-raised-button color="primary" matTooltip="click to register to ELIOT Portal"
  33                 matTooltipPosition="right">Sign-up</button>
  34             </form>
  35         </mat-card-content>
  36         <mat-card-actions>
  37             <button mat-raised-button routerLink="/login" color="primary" matTooltip="click to login to ELIOT Portal"
  38             matTooltipPosition="right">Login</button>
  39         </mat-card-actions>
  40
  41     </mat-card>
  42 </div>
  43 <!-- </div> -->