{{template "header" .}}
{{template "navbar" .}}

<div class="container">
<h2>Profile</h2>
{{template "alarm" .}}
<div class="row">
<div class="col-3 mx-auto">
<div class="card">
<div class="card-header">Edit profile</div>
<div class="card-b">
<p><img src="/avatar/{{.User.Id}}" onerror="this.src='/static/default.jpg'; this.onerror=null;" width="128" height="128" alt="Avatar" class="mx-auto"></p>
<form method="post" action="/profile/edit" enctype="multipart/form-data">
{{template "csrf" .}}
<div class="form-group"><label for="disp_name">Display name</label><input type="text" class="w-100" id="disp_name" name="display_name" value="{{.User.EffectiveDisplayName}}"></div>
<div class="form-group"><label for="avatar">Avatar</label><input type="file" class="w-100" id="avatar" name="avatar" accept="image/png,image/jpeg"></div>
<div class="text-center"><button type="submit">Save</button></div>
</form>
<p class="text-center"><a href="/profile">Back to profile</a></p>
</div>
</div>
</div>
</div>
</div>

{{template "footer" .}}