@page
@model IndexModel
@{
    ViewData["Title"] = "Profile";
    ViewData["ActivePage"] = ManageNavPages.Index;
}

<h3>@ViewData["Title"]</h3>
<div class="row">
    <div class="col-md-6">
        <form id="profile-form" method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-floating">
                <input asp-for="Username" class="form-control" disabled />
                <label asp-for="Username" class="form-label"></label>
            </div>
            <div class="form-floating" style="margin-top: 2rem">
                <input asp-for="Input.PhoneNumber" class="form-control" />
                <label asp-for="Input.PhoneNumber" class="form-label"></label>
                <span asp-validation-for="Input.PhoneNumber" class="text-danger"></span>
            </div>
            <div class="form-floating" style="margin-top: 2rem">
                <input asp-for="Input.ProfilePictureUrl" class="form-control" />
                <label asp-for="Input.ProfilePictureUrl" class="form-label"></label>
                <span asp-validation-for="Input.ProfilePictureUrl" class="text-danger"></span>
            </div>
            <div class="form-floating" style="margin-top: 2rem">
                <input asp-for="Input.WebsiteUrl" class="form-control" />
                <label asp-for="Input.WebsiteUrl" class="form-label"></label>
                <span asp-validation-for="Input.WebsiteUrl" class="text-danger"></span>
            </div>
            <div class="form-floating" style="margin-top: 2rem">
                <textarea asp-for="Input.Bio" class="form-control"></textarea>
                <label asp-for="Input.Bio" class="form-label"></label>
                <span asp-validation-for="Input.Bio" class="text-danger"></span>
            </div>
            <button id="update-profile-button" type="submit" class="w-100 btn btn-lg btn-primary" style="margin-top: 2rem">Save</button>
        </form>
    </div>
    <div class="col-md-6">
        <img class="rounded-circle me-1" src="@Model.Input.ProfilePictureUrl" height="400" width="400" />
    </div>
</div>

@section Scripts {
    <partial name="_ValidationScriptsPartial" />
}
