Skip to content

Commit

Permalink
1097 - Update Sign Up form UI (#1194)
Browse files Browse the repository at this point in the history
* Update sign up page

* Update sign up logo size
  • Loading branch information
Meri-MG authored Dec 11, 2024
1 parent ddb540e commit ce8ab91
Show file tree
Hide file tree
Showing 2 changed files with 75 additions and 63 deletions.
136 changes: 74 additions & 62 deletions app/views/devise/registrations/new.html.erb
Original file line number Diff line number Diff line change
@@ -1,73 +1,85 @@
<!--page heading-->
<header class="pt-5 pb-5">
<div class="container">
<div class="text-center">
<h1 class="section-heading text-uppercase underline">
Sign Up
</h1>
</div>
</div> <!--container-->
</header>
<section class="container d-flex flex-column">
<div class="row align-items-center justify-content-center g-0 min-vh-100">
<div class="col-lg-5 col-md-8 py-8 py-xl-0">
<!-- Card -->
<div class="card shadow">
<!-- Card body -->
<div class="card-body p-6">
<div class="mb-4">
<div class='d-flex justify-content-center'>
<div class='d-flex flex-column align-items-center mb-3'>
<% if Current.organization.avatar.attached? %>
<%= image_tag Current.organization.avatar, alt: current_organization_name, title: current_organization_name, class: 'rounded', height: 100, width: 100 %>
<% end %>
<h1 class='text-muted'><%= Current.tenant.name %></h1>
</div>
</div>
<h1 class="mb-1 fw-bold">Sign up</h1>
</div>

<section class="pb-5" id="registration_new">
<div class='container'>
<div class="row">
<div class="col-md-6 mx-auto card p-5">
<%= bootstrap_form_for(resource, as: resource_name,
url: registration_path(resource_name)) do |f| %>
<div>
<% if flash[:alert] %>
<div class="alert alert-danger" role="alert">
<%= alert %>
</div>
<% end%>
</div>
<%= bootstrap_form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>

<%= render "devise/shared/error_messages", resource: resource %>
<%= render "devise/shared/error_messages", resource: resource %>

<%# adopter_foster_account built in registrations controller #new %>
<%= f.fields_for :adopter_foster_account do |fields| %>
<%= fields.hidden_field :user_id %>
<% end %>
<%= f.fields_for :adopter_foster_account do |fields| %>
<%= fields.hidden_field :user_id %>
<% end %>

<div class="form-group mb-3 bigger">
<%= f.email_field :email,
autofocus: true,
required: true,
autocomplete: "email", class: 'form-control' %>
</div>
<div class="form-group mb-3 bigger">
<%= f.email_field :email,
autofocus: true,
required: true,
autocomplete: "email", class: 'form-control' %>
</div>

<div class="form-group mb-3 bigger">
<%= f.text_field :first_name, required: true, class: 'form-control' %>
</div>
<div class="form-group mb-3 bigger">
<%= f.text_field :first_name, required: true, class: 'form-control' %>
</div>

<div class="form-group mb-3 bigger">
<%= f.text_field :last_name, required: true, class: 'form-control' %>
</div>
<div class="form-group mb-3 bigger">
<%= f.text_field :last_name, required: true, class: 'form-control' %>
</div>

<div class="form-group mb-3 bigger">
<%= f.password_field :password,
required: true,
autocomplete: "new-password",
class: 'form-control' %>
<% if @minimum_password_length %>
<em>(<%= @minimum_password_length %> characters minimum)</em>
<% end %><br />
</div>
<div class="form-group mb-3 bigger">
<%= f.password_field :password,
required: true,
autocomplete: "new-password",
class: 'form-control' %>
<% if @minimum_password_length %>
<em>(<%= @minimum_password_length %> characters minimum)</em>
<% end %><br />
</div>

<div class="form-group mb-3 bigger">
<%= f.check_box :tos_agreement, required: true,
class: 'me-2', label: 'I agree to the' %>
<%= link_to 'Terms and Conditions', terms_and_conditions_path,
target: '_blank', class: 'text-decoration-none' %>
<span>& </span>
<%= link_to 'Privacy Policy', privacy_policy_path,
<div class="form-group mb-3 bigger">
<%= f.check_box :tos_agreement, required: true,
class: 'me-2', label: 'I agree to the' %>
<%= link_to 'Terms and Conditions', terms_and_conditions_path,
target: '_blank', class: 'text-decoration-none' %>
<span>& </span>
<%= link_to 'Privacy Policy', privacy_policy_path,
target: '_blank', class: 'text-decoration-none' %>
<span>& </span>
<%= link_to 'Cookie Policy', cookie_policy_path,
target: '_blank', class: 'text-decoration-none' %>
<span>& </span>
<%= link_to 'Cookie Policy', cookie_policy_path,
target: '_blank', class: 'text-decoration-none' %>
</div>
</div>

<div class="actions">
<%= f.submit "Create Account", class: 'btn btn-outline-dark mb-3 bigger',
data: { turbo: false } %>
</div>
<% end %>
<%= render "devise/shared/links" %>
</div><!--col-->
</div><!--row-->
</div><!--container-->
<div>
<div class="d-grid mb-3">
<%= f.submit "Create Account", class: 'btn btn-primary',
data: { turbo: false } %>
</div>
<%= render "devise/shared/links" %>
</div>
<% end %>
</div>
</div>
</div>
</div>
</section>
2 changes: 1 addition & 1 deletion app/views/devise/sessions/new.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<div class="mb-4">
<div class='d-flex justify-content-center'>
<div class='d-flex flex-column align-items-center mb-3'>
<%= image_tag "brand/pet-rescue.png", class: 'mb-0', alt: 'logo-icon', height: 100, width: 100 %>
<%= image_tag 'brand/pet-rescue.png', class: 'mb-0', alt: 'logo-icon', height: 100, width: 100 %>
<h1 class='text-muted'><%= Current.tenant.name %></h1>
</div>
</div>
Expand Down

0 comments on commit ce8ab91

Please sign in to comment.