evodata/app/views.old/devise/registrations/edit.html.erb

182 lines
9.4 KiB
Plaintext

<div class="w-full">
<div class="flex justify-between items-center">
<h1 class="font-bold text-4xl">Edit <%= resource_name.to_s.humanize %></h1>
<%= link_to "Back", :back, class: "rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium" %>
</div>
<div class="py-5 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<!-- We've used 3xl here, but feel free to try other max-widths based on your needs -->
<div class="max-w-3xl mx-auto shadow overflow-hidden border-b border-gray-200 sm:rounded-lg">
<div class="px-4 py-5 bg-white space-y-8 divide-y divide-gray-200">
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
<div class="space-y-8 divide-y divide-gray-200 sm:space-y-5">
<div>
<%= render "devise/shared/error_messages", resource: resource %>
<div>
<h3 class="text-lg leading-6 font-medium text-gray-900">
Profile
</h3>
</div>
<div class="mt-6 sm:mt-5 space-y-6 sm:space-y-5">
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<%= f.label :email, class: "block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2" %>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<div class="max-w-lg flex rounded-md shadow-sm">
<%= f.email_field :email, autofocus: false, autocomplete: "email", class: "flex-1 block w-full focus:ring-indigo-500 focus:border-indigo-500 min-w-0 rounded-none rounded-r-md sm:text-sm border-gray-300", placeholder: "foo@example.com" %>
</div>
<% if true or devise_mapping.confirmable? && resource.pending_reconfirmation? %>
<p class="mt-2 text-sm text-gray-500">Currently waiting confirmation for: <%= resource.email %></p>
<% end %>
</div>
</div>
</div>
<div class="space-y-6 sm:space-y-5">
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="first-name" class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2">
First name
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<input type="text" name="first-name" id="first-name" autocomplete="given-name" class="max-w-lg block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md">
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="last-name" class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2">
Last name
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<input type="text" name="last-name" id="last-name" autocomplete="family-name" class="max-w-lg block w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md">
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="email" class="block text-sm font-medium text-gray-700 sm:mt-px sm:pt-2">
Email address
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<input id="email" name="email" type="email" autocomplete="email" class="block max-w-lg w-full shadow-sm focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md">
</div>
</div>
</div>
</div>
</div>
<div class="pt-5">
<div class="flex justify-end">
<button type="button" class="bg-white py-2 px-4 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
Cancel
</button>
<button type="submit" class="ml-3 inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
Save
</button>
</div>
</div>
<% end %>
</div>
</div>
</div>
<div class="py-6 md:grid md:grid-cols-3 md:gap-6">
<div class="md:col-span-1">
<div class="px-4 sm:px-0">
<h3 class="text-lg font-medium leading-6 text-gray-900">Profile</h3>
<p class="mt-1 text-sm text-gray-600">
This information will be displayed publicly so be careful what you share.
</p>
</div>
</div>
<div class="mt-5 md:mt-0 md:col-span-2">
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
<div class="shadow sm:rounded-md sm:overflow-hidden">
<div class="px-4 py-5 bg-white space-y-6 sm:p-6">
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<%= render "devise/shared/error_messages", resource: resource %>
</div>
</div>
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<%= f.label :email, class: "block text-sm font-medium text-gray-700" %>
<div class="mt-1 flex rounded-md shadow-sm">
<%= f.email_field :email, autofocus: false, autocomplete: "email", class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-r-md sm:text-sm border-gray-300", placeholder: "foo@example.com" %>
</div>
</div>
</div>
<% if true or devise_mapping.confirmable? && resource.pending_reconfirmation? %>
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
Currently waiting confirmation for: <%= resource.email %>
</div>
</div>
<% end %>
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<%= f.label :display_name, class: "block text-sm font-medium text-gray-700" %>
<div class="mt-1 flex rounded-md shadow-sm">
<%= f.text_field :display_name, autocomplete: "name", class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-r-md sm:text-sm border-gray-300" %>
</div>
</div>
</div>
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<div class="flex justify-between">
<%= f.label :password, class: "block text-sm font-medium text-gray-700" %>
<span class="text-sm text-gray-500">(leave blank if you don't want to change it)</span>
</div>
<div class="mt-1 flex rounded-md shadow-sm">
<%= f.password_field :password, autocomplete: "new-password", class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-r-md sm:text-sm border-gray-300" %>
</div>
<% if @minimum_password_length %>
<p class="mt-2 text-sm text-gray-500">
<em><%= @minimum_password_length %> characters minimum</em>
</p>
<% end %>
</div>
</div>
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<%= f.label :password_confirmation, class: "block text-sm font-medium text-gray-700" %>
<div class="mt-1 flex rounded-md shadow-sm">
<%= f.password_field :password_confirmation, autocomplete: "new-password", class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-r-md sm:text-sm border-gray-300" %>
</div>
</div>
</div>
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<div class="flex justify-between">
<%= f.label :current_password, class: "block text-sm font-medium text-gray-700" %>
<span class="text-sm text-gray-500">(we need your current password to confirm your changes)</span>
</div>
<div class="mt-1 flex rounded-md shadow-sm">
<%= f.password_field :current_password, autocomplete: "current-password", class: "focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-r-md sm:text-sm border-gray-300" %>
</div>
</div>
</div>
</div>
<div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
<button type="submit" class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
Save
</button>
</div>
</div>
<% end %>
</div>
</div>
</div>