katbin/lib/ketbin_web/templates/user_settings/edit.html.eex

	<h1 class="font-bold text-4xl text-amber pt-4 w-full text-center">Settings</h1>

<div class="flex w-full h-full justify-center items-center">
<%= form_for @email_changeset, Routes.user_settings_path(@conn, :update), [class: "flex flex-col h-full justify-center items-start m-auto"], fn f -> %>
	<h3 class="font-bold text-2xl text-amber pb-4">Change email</h3>

  <%= if @email_changeset.action do %>
    <div class="alert alert-danger">
      <p>Oops, something went wrong! Please check the errors below.</p>
    </div>
  <% end %>

  <%= hidden_input f, :action, name: "action", value: "update_email" %>

	<div class="flex flex-col w-full">
		<%= label f, :email %>
		<%= email_input f, :email, [class: "text-black px-2 py-1 outline-none", required: true] %>
		<%= error_tag f, :email %>
	</div>

	<div class="flex flex-col w-full">
		<%= label f, :current_password, for: "current_password_for_email" %>
		<%= password_input f, :current_password, [class: "text-black px-2 py-1 outline-none", required: true, name: "current_password", id: "current_password_for_email"]%>
		<%= error_tag f, :current_password %>
	</div>

  <div class="bg-amber mt-4 rounded-sm px-2 py-1">
    <%= submit "Change email" %>
  </div>
<% end %>


	<%= form_for @password_changeset, Routes.user_settings_path(@conn, :update), [class: "flex flex-col h-full justify-center items-start m-auto"], fn f -> %>
		<h3 class="font-bold text-2xl text-amber pb-4">Change password</h3>

		<%= if @password_changeset.action do %>
			<div class="alert alert-danger">
				<p>Oops, something went wrong! Please check the errors below.</p>
			</div>
		<% end %>

		<%= hidden_input f, :action, name: "action", value: "update_password" %>

		<div class="flex flex-col w-full">
			<%= label f, :password, "New password" %>
			<%= password_input f, :password, [class: "text-black px-2 py-1 outline-none", required: true] %>
			<%= error_tag f, :password %>
		</div>

		<div class="flex flex-col w-full">
			<%= label f, :password_confirmation, "Confirm new password" %>
			<%= password_input f, :password_confirmation, [class: "text-black px-2 py-1 outline-none", required: true] %>
			<%= error_tag f, :password_confirmation %>
		</div>

		<div class="flex flex-col w-full">
			<%= label f, :current_password, for: "current_password_for_password" %>
			<%= password_input f, :current_password, [class: "text-black px-2 py-1 outline-none", required: true, name: "current_password", id: "current_password_for_password"] %>
			<%= error_tag f, :current_password %>
		</div>

		<div class="bg-amber mt-4 rounded-sm px-2 py-1">
			<%= submit "Change password" %>
		</div>
	<% end %>
<div>