public/src/js/modules/login/login.html/login.html

   1 <div id="login" class="flex-scrollable" layout="column" ms-scroll>
   2   <div id="login-form-wrapper" layout="column" layout-align="center center">
   3     <div id="login-form" class="md-whiteframe-8dp">
   4       <img
   5         ng-src="{{vm.baseUrl}}api/settings/1/logo_login"
   6         alt="logo_login"
   7         class="logo_login"
   8       />
   9       <!-- <img src="assets/images/logos/login.png" alt="motion_logo_login" /> -->
  10
  11       <div class="md-subhead padding-top-45" translate="LOGIN.TITLE">
  12         Log in to your account
  13       </div>
  14
  15       <form name="loginForm" novalidate ng-if="!vm.progressLogin">
  16         <md-input-container class="md-block" md-no-float>
  17           <input
  18             type="input"
  19             name="name"
  20             ng-model="vm.form.name"
  21             autofocus
  22             aria-label="username"
  23             translate
  24             translate-attr-placeholder="LOGIN.USERNAME"
  25             required
  26           />
  27           <div ng-messages="loginForm.name.$error" role="alert" multiple>
  28             <div ng-message="required">
  29               <span translate="LOGIN.ERRORS.USERNAME_REQUIRED"
  30                 >Username field is required</span
  31               >
  32             </div>
  33           </div>
  34         </md-input-container>
  35
  36         <md-input-container class="md-block" md-no-float>
  37           <input
  38             type="password"
  39             name="password"
  40             ng-model="vm.form.password"
  41             aria-label="password"
  42             translate
  43             translate-attr-placeholder="LOGIN.PASSWORD"
  44             required
  45           />
  46           <div ng-messages="loginForm.password.$error" role="alert" multiple>
  47             <div ng-message="required">
  48               <span translate="LOGIN.ERRORS.PASSWORD_REQUIRED"
  49                 >Password field is required</span
  50               >
  51             </div>
  52           </div>
  53         </md-input-container>
  54
  55         <div
  56           class="remember-forgot-password"
  57           layout="row"
  58           layout-xs="column"
  59           layout-align="end center"
  60         >
  61           <!-- <md-checkbox class="remember-me" ng-model="data.cb1" aria-label="Remember Me">
  62                         <span translate="LOGIN.REMEMBER_ME">Remember Me</span>
  63                     </md-checkbox> -->
  64           <a
  65             ui-sref="app.forgot"
  66             class="forgot-password md-accent-color"
  67             style="cursor: pointer"
  68             translate="LOGIN.FORGOT_PASSWORD"
  69             >Forgot Password?</a
  70           >
  71         </div>
  72
  73         <b
  74           layout="row"
  75           layout-align="center center"
  76           class="md-padding"
  77           ng-if="vm.message"
  78         >
  79           <font color="red">{{vm.message}}</font>
  80         </b>
  81         <md-button
  82           type="submit"
  83           ng-click="vm.login()"
  84           class="md-raised md-accent submit-button"
  85           aria-label="LOGIN"
  86           translate="LOGIN.LOG_IN"
  87           translate-attr-aria-label="LOGIN.LOG_IN"
  88         >
  89           LOG IN
  90         </md-button>
  91       </form>
  92
  93       <md-progress-circular
  94         ng-if="vm.progressLogin"
  95         md-diameter="96"
  96       ></md-progress-circular>
  97
  98       <div ng-if="vm.googleSsoEnabled" class="separator">
  99         <span class="text" translate="LOGIN.OR">OR</span>
 100       </div>
 101
 102       <md-button
 103         ng-if="vm.googleSsoEnabled"
 104         ng-click="vm.loginOauth('google')"
 105         class="md-raised google"
 106       >
 107         <div layout="row" layout-align="center center">
 108           <span>
 109             <md-icon md-font-icon="fab fa-google" class="s16"></md-icon>
 110             <span translate="LOGIN.WITH_GOOGLE">Log in with Google</span>
 111           </span>
 112         </div>
 113       </md-button>
 114     </div>
 115   </div>
 116 </div>