{% extends "layouts/default.html" %}
{% block title%}Edit your accout settings.{%endblock%}
{% block content %}
<div class="be-main">
    <h2>Edit Account</h2>


    <form class="be-gui-form"
	  action="/user/edit"
	  method="post">
	<input type="hidden"
	       name="AUTHENTICITY-TOKEN"
	       value="{{token}}">
	<label>Display Name</label>
	<input type="text"
	       name="DISPLAY-NAME"
	       value="{{user.display-name}}">
	<label>New Password</label>
	<input type="password"
	       name="NEW-PASSWORD">
	<label>New Password Check</label>
	<input type="password"
	       name="PASSWORD-CHECK">
	<button class="be-gui-button"
		title="Click to update your account details"
		type="submit">
	    <img alt="Update Account Details"
		 src="/images/icons/save.png">
	    Save Changes
	</button>
    </form>

    <h2>Delete Account</h2>
    <p class="be-gui-form-hint">
	Warning: This cannot be undone. Enter '{{user.username}}' in
	the text box before clicking 'Delete Account' to confirm deletion.
    </p>
    <form class="be-gui-form"
	  action="/user/delete"
	  method="post">
	<input required
	       type="hidden"
	       name="AUTHENTICITY-TOKEN"
	       value="{{token}}">
	<input required
	       type="text"
	       name="DELETE-ACCOUNT-CHECK"
	       placeholder="Enter your '{{user.username}}' here to confirm deletion...">
	<button class="be-gui-button"
		title="Click to update your account details"
		type="submit">
	    <img alt="Update Account Details"
		 src="/images/icons/delete-account.png">
	    Delete Account
	</button>
    </form>

</div>
{% endblock %}