<form name="signupForm" data-ng-class="{'was-validated': validated}" novalidate>
  <div class="row">
    <div class="col-md-12">
      <div class="title" data-translate>Sign up</div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12 form-group">
      <label>
        <span data-translate>Site</span>
        <span class="text-danger" data-uib-tooltip="{{'This field is mandatory' | translate}}">*</span>
      </label>
      <div class="input-group">
        <input name="subdomain" class="form-control" data-ng-model="signup.subdomain" type="text"
               data-ng-pattern="/^[a-z0-9]+$/" data-subdomainvalidator required >
        <span class="input-group-append"><span class="input-group-text">.{{public.node.rootdomain}}</span></span>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6 form-group">
      <label data-translate>Name</label>
      <span class="text-danger" data-uib-tooltip="{{'This field is mandatory' | translate}}">*</span>
      <input name="name" class="form-control" data-ng-model="signup.name" type="text" required>
    </div>
    <div class="col-md-6 form-group">
      <label data-translate>Surname</label>
      <span class="text-danger" data-uib-tooltip="{{'This field is mandatory' | translate}}">*</span>
      <input name="surname" class="form-control" data-ng-model="signup.surname" type="text" required>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6 form-group">
      <label>
        <span data-translate>Email address</span>
        <span class="text-danger" data-uib-tooltip="{{'This field is mandatory' | translate}}">*</span>
      </label>
      <input name="mail_address" class="form-control" data-ng-model="signup.email"
             data-ng-pattern="CONSTANTS.email_regexp" type="email"
             data-ng-class="{'is-invalid': validated && signupForm.mail_address.$error.pattern}"
             required>
      <div class="text-danger" data-ng-show="signupForm.mail_address.$error.pattern">
        <span data-translate>Invalid email address</span>
      </div>
    </div>
    <div class="col-md-6 form-group">
      <label>
        <span data-translate>Email address</span> <span>(</span><span data-translate>Confirmation</span><span>)</span>
        <span class="text-danger" data-uib-tooltip="{{'This field is mandatory' | translate}}">*</span>
      </label>
      <input name="email" class="form-control" data-ng-model="confirmation_email"
             data-disable-ccp type="email"
             data-ng-class="{'is-invalid': validated && signup.email !== confirmation_email}"
             required>
      <div class="text-danger" data-ng-show="validated && signupForm.mail_address.$valid && signup.email !== confirmation_email">
        <span data-translate>Invalid confirmation</span>
      </div>
    </div>
  </div>
  <div data-ng-include="'views/signup/tos.html'"></div>
  <div class="row">
    <div class="col-md-12">
      <button class="ButtonNext btn btn-primary" data-ng-click="(validated = true) && !signupForm.$invalid && complete()">
        <i class="fa-solid fa-check"></i>
        <span data-translate>Proceed</span>
      </button>
    </div>
  </div>
</form>
