  <div class="" id="loginModal">
    <div class="modal-header">
      <img ng-src="{{logoBlack.custom_asset_file_attributes.attachment_url}}" alt="{{logo.custom_asset_file_attributes.attachment}}" class="modal-logo"/>
      <h1 translate translate-default="Login">
        {{ 'app.public.common.connection' }}
      </h1>
    </div>
    <div class="modal-body">
      <uib-alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">{{alert.msg}}</uib-alert>

      <div class="panel panel-default bg-light">
        <div class="panel-body">
          <form name="loginForm" class="form-horizontal" ng-keydown="loginForm.$valid && $event.which == 13 && login()">
            <div class="form-group" ng-class="{'has-error': emailError}">
              <div class="col-sm-12">
                <div class="input-group">
                  <span class="input-group-addon">
                    <i class="fa fa-envelope"></i>
                  </span>
                  <input type="email"
                         name="email"
                         class="form-control"
                         ng-model="user.email"
                         required="required"
                         ng-blur="emailError = !!loginForm.email.$error.email"
                         ng-focus="emailError = false"
                         translate-attr="{ placeholder: 'app.public.common.your_email_address' }" />
                </div>
              </div>
            </div>

            <div class="form-group">
              <div class="col-sm-12">
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-key"></i></span>
                  <input type="password"
                         name="password"
                         class="form-control"
                         ng-model="user.password"
                         required="required"
                         translate-attr="{ placeholder: 'app.public.common.your_password' }"
                         ng-minlength="8"/>
                </div>
                <a href="#" ng-click="openResetPassword($event)" class="text-xs" translate translate-default="Forgotten password">{{ 'app.public.common.password_forgotten' }}</a>
                <span ng-if="confirmationRequired">
                  <br><a href="#" ng-click="openConfirmationNewModal($event)" class="text-xs" translate translate-default="Confirm account">{{ 'app.public.common.confirm_my_account' }}</a>
                </span>
                <div class="alert alert-warning m-t-sm m-b-none text-xs p-sm" ng-show='isCapsLockOn' role="alert">
                  <i class="fa fa-warning"></i>
                  {{ 'app.public.common.caps_lock_is_on' | translate }}
                </div>
              </div>
            </div>

          </form>

        </div>
        <div class="panel-footer no-padder">
          <button class="btn btn-valid btn-warning btn-block p-l btn-lg text-u-c r-b" ng-click="login()" ng-disabled="loginForm.$invalid" translate translate-default="OK">{{ 'app.shared.buttons.confirm' }}</button>
        </div>
      </div>
      <p class="text-center font-sbold">
        <span translate translate-default="Not registered?">{{ 'app.public.common.not_registered_to_the_fablab' }}</span>
        <br/>
        <a href="#" ng-click="openSignup($event)" class="text-u-l" translate translate-default="Create an account">{{ 'app.public.common.create_an_account' }}</a></br>
      </p>
    </div>

  </div>
