<div class="box wide">
  <%= form_with model: @new_user, url: signup_path do |f| %>
    <p>
    To create a new account, enter your e-mail address and a password.
    Your e-mail address will never be shown to users and will only be used
    if you need to reset your password, or to receive optional new-message
    alerts.  Your username can be changed later.
    </p>

    <%= errors_for(@new_user) %>

    <% if not Rails.application.open_signups? %>
        <%= f.hidden_field "invitation_code", :value => @invitation.code, :name => :invitation_code %>
      <p>
      <%= f.label :invitation, "Invited By:", :class => "required" %>
      <span class="d">
        <%= link_to @invitation.user.username, user_path(@invitation.user), target: '_blank' %>
      </span>
      </p>
    <% end %>

    <p>
    <%= f.label :username, "Username:", :class => "required" %>
    <%= f.text_field :username, :size => 30 %>
    <span class="hint">
      <tt><%= User.username_regex_s %></tt>
    </span>
    <br />

    <%= f.label :email, "E-mail Address:", :class => "required" %>
    <%= f.email_field :email, :size => 30, :inputmode => "email" %>
    <span class="hint">
      <a href="http://www.gravatar.com/" target="_blank">Gravatar</a>'ized
    </span>
    <br />

    <%= f.label :password, "Password:", :class => "required" %>
    <%= f.password_field :password, :size => 30, :autocomplete => "off" %>
    <br />

    <%= f.label :password_confirmation, "Password (again):",
      :class => "required" %>
    <%= f.password_field :password_confirmation, :size => 30,
      :autocomplete => "off" %>
    <br />
    </p>

    <p>
    Want to tell us about yourself?  It's optional, but it will be visible in
    your public profile and can be changed at any time.
    </p>

    <p>
    <div class="boxline">
      <%= f.label :about, "About:", :class => "required" %>
      <%= f.text_area :about, :size => "100x5", :style => "width: 600px;" %>
    </div>

    <div class="box">
      <div class="boxline markdown_help_toggler"
        style="margin-left: 9em; width: 600px;">
        <div class="markdown_help_label">
          Markdown formatting available
        </div>

        <div style="clear: both;"></div>

        <%= render :partial => "global/markdownhelp" %>
      </div>
    </div>

    <p>
    <%= f.submit "Signup" %>
    </p>
  <% end %>
</div>
