Juan Rodriguez
3feaa5d88f
Reload with turbolinks, error messages, confirm password validation Login and Signup modals
39 lines
2.5 KiB
Plaintext
39 lines
2.5 KiB
Plaintext
<%= form_with model: User.new, url: users_path(@user), data: { action: 'ajax:success->users#onSignupSuccess ajax:error->users#onError' }, class: "inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full" do |f| %>
|
|
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
|
<div class="flex-1 mt-3 text-center sm:mt-0 sm:mx-4 sm:text-left">
|
|
<h3 class="text-xl leading-6 font-medium text-gray-900" id="modal-title">
|
|
Sign Up
|
|
</h3>
|
|
<div class="flex-col mt-4">
|
|
<div class="my-2">
|
|
<label for="username" class="block text-sm font-medium text-gray-700">
|
|
Username
|
|
</label>
|
|
<%= f.text_field :username, class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-md sm:text-sm border-gray-300" %>
|
|
</div>
|
|
<div class="my-2">
|
|
<label for="password" class="block text-sm font-medium text-gray-700">
|
|
Password
|
|
</label>
|
|
<div class="mt-1 flex rounded-md shadow-sm">
|
|
<%= f.password_field :password, class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-md sm:text-sm border-gray-300" %>
|
|
</div>
|
|
</div>
|
|
<div class="my-2">
|
|
<label for="confirm_password" class="block text-sm font-medium text-gray-700">
|
|
Confirm password
|
|
</label>
|
|
<div class="mt-1 flex rounded-md shadow-sm">
|
|
<%= f.password_field :confirm_password, class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-md sm:text-sm border-gray-300" %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
|
<%= f.submit "Sign Up", class: "mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm" %>
|
|
<button data-action="click->users#closeSignupModal" type="button" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">
|
|
Cancel
|
|
</button>
|
|
</div>
|
|
<%end%> |