Byte4/acebook-byte4

<div class="card border-dark mb-3 float-right signup-sheet">
  <div class="card-header"><p class ="h4">Create an account</p>
    It's free but not forever...
  </div>
  <%= form_for(resource, as: resource_name, url: registration_path(resource_name),html: { }) do |f| %>
  <div class="card-body text-dark" id= "sign-up-sheet">
    <h5 class="card-title text-muted">First Name</h5>
    <div class="field">
      <%= f.text_field :first_name, autofocus: true, autocomplete: "first_name", required: true, class: "form-control" %>
    </div>
    <h5 class="card-title text-muted">Last Name</h5>
    <div class="field">
      <%= f.text_field :last_name, autocomplete: "last_name", required: true, class: "form-control"  %>
    </div>
    <h5 class="card-title">Profile picture</h5>
    <div class="field">
      <%= f.file_field :avatar %>
    <h5 class="card-title">About Me</h5>
    <div class="field">
      <%= f.text_area :about_me, autocomplete: "about_me", required: true, class: "form-control"  %>
    </div>
    <h5 class="card-title text-muted">Email</h5>
    <div class="field">
      <%= f.email_field :email, autocomplete: "email", required: true, class: "form-control" %>
    </div>
    <h5 class="card-title text-muted">Password</h5>
    <div class="field">
      <% if @minimum_password_length %>
      <em>(<%= @minimum_password_length %> characters minimum)</em>
      <% end %><br />
      <%= f.password_field :password, autocomplete: "off", class: "form-control" %>
    </div>
    <h5 class="card-title text-muted">Password confirmation</h5>
    <div class="field">
      <%= f.password_field :password_confirmation, autocomplete: "off", class: "form-control" %>
    </div>
    <div class="action">
      <%= f.submit "Sign up", class: "btn btn-primary" %>
    </div>
    <%= render "users/shared/links" %>
  </div>
</div>
<% end %>