<template name="entrySignUp">
  <div id="entrySignUp" class="page entryPage" style="{{getOpacityWithCorner}}">

    <div class="content-scrollable">
      <div class="wrapper-auth">
        {{#if logoIsDisplayed}}
          <div id="entryAppLogo" class="entryLogo" style="background-image: url('{{logoUrl}}')"></div>
        {{/if}}

        <h1 id="signUpPageTitle" class="title-auth">Join.</h1>
        <div id="signUpPageMessage" class="subtitle-auth" style="{{getSignUpMessageColor}}">{{getSignUpMessage}}</div>

        <form id="entrySignUpForm">

          {{#if entryErrorMessages}}
            <div id="errorMessages" class="list-errors">
              {{#each entryErrorMessages}}
                <div class="alert alert-danger list-item">{{this}}</div>
              {{/each}}
            </div>
          {{/if}}

          <div class="input-symbol ">
            <input id="signUpPageFullNameInput" type="text" name="fullName" placeholder="Full Name" style="{{getFullNameStyling}}" />
            <i class="fa fa-user" title="Full Name"></i>
          </div>
          <br>
          <br>

          <div class="input-symbol">
            <input id="signUpPageEmailInput" type="email" name="email" placeholder="Email Address" style="{{getEmailStyling}}" />
            <i class="fa fa-envelope-o" title="Your Email"></i>
          </div>
          <br>
          <br>

          <div class="input-symbol ">
            <input id="signUpPagePasswordInput" type="password" name="password" placeholder="Password" style="{{getPasswordStyling}}" />
            <span class="fa fa-lock" title="Password"></span>
            <!-- <span class="icon-lock" title="Password"></span> -->
          </div>
          <br>
          <br>

          <div class="input-symbol">
            <input id="signUpPagePasswordConfirmInput" type="password" name="confirm" placeholder="Confirm Password" style="{{getConfirmPasswordStyling}}" />
            <span class="fa fa-lock" title="Confirm Password"></span>
            <!-- <span class="icon-lock" title="Confirm Password"></span> -->
          </div>
        </form>
          <br>
          <br>
          <button id="signUpPageJoinNowButton" type="submit" class="btn-primary btn-main btn-large" style="{{getButtonColor}}">Join Now</button>

          <br>
          <br>
          <button id="signUpPageSignInButton" class="btn-gray btn-main btn-large">Have an account? Sign in</button>

      </div>

      <!-- <a id="signUpPageSignInButton" href="{{pathFor 'entrySignIn'}}" class="link-auth-alt">Have an account? Sign in</a> -->
    </div>
  </div>
</template>
