{% extends "layout.html" %}
{% block content %}
<div class="content-section">
	<div class="media">
		<img class="rounded-circle account-img" src="{{ image_file }}">
		<div class="media-body">
			<h2 class="account-heading" style="color: {{ theme.orange }};">{{ current_user.username }}</h2>
            <p class="text-secondary"> 
            Name : kerem yollu  <br> 
            Address : Meireackerstasse 10 / 8610 Uster / Schweiz <br> 
            Email:{{ current_user.email }}
            </p>
		</div>
	</div>
	<form method="POST" action="" enctype="multipart/form-data">
		{{ form.hidden_tag() }}
		<fieldset class="form-group">
			<legend class="border-bottom mb-4"> Account Info </legend>
			<div class="form-group" style=" {{ theme.userInputFormWitdh }}">
				{{ form.username.label(class="form-control-label") }}
				{% if form.username.errors %}
				{{ form.username(class="form-control form-control-lg is-invalid") }}
				<div class="invalid-feedback">
					{% for error in form.username.errors %}
					<span>{{ error }}</span>
					{% endfor %}
				</div>
				{% else %}
				{{ form.username(class="form-control form-control-lg") }}
				{% endif %}
			</div>
			<div class="form-group" style=" {{ theme.userInputFormWitdh }}">
				{{ form.email.label(class="form-control-label") }}
				{% if form.email.errors %}
				{{ form.email(class="form-control form-control-lg is-invalid") }}
				<div class="invalid-feedback">
					{% for error in form.email.errors %}
					<span>{{ error }}</span>
					{% endfor %}
				</div>
				{% else %}
				{{ form.email(class="form-control form-control-lg") }}
				{% endif %}
			</div>
			</br>
			<div class="form-group">
				{{ form.picture.label() }} </br>
				{{ form.picture(class="form-control-file") }}</br>
				{% if form.picture.errors %}
					{% for error in form.picture.errors %}
						<span class="text-danger">{{ error }}</span></br>
					{% endfor %}
				{% endif %}
			</div>
			</br>
		</fieldset>
		<div class="form-group">
			{{ form.submit(class="btn btn-outline-info") }}
		</div>
	</form>
</div>
{% endblock content %}