@page
@model JustShortIt.Pages.LoginModel

<div class="columns is-centered my-6 px-4">
    <form class="column is-one-third-desktop is-half-tablet is-full-mobile" method="post">
        <h1 class="title is-2">Login</h1>

        <div class="field">
            <label class="label" asp-for="UserModel!.Username">Username</label>
            <div class="control">
                <input required class="input" type="text" asp-for="UserModel!.Username"/>
            </div>
            <span class="help is-danger" asp-validation-for="UserModel!.Username"></span>
        </div>
        <div class="field">
            <label class="label" asp-for="UserModel!.Password">Password</label>
            <div class="control">
                <input required class="input" type="password" asp-for="UserModel!.Password"/>
            </div>
            <span class="help is-danger" asp-validation-for="UserModel!.Password"></span>
        </div>

        <div class="has-text-danger" asp-validation-summary="ModelOnly" class="text-danger"></div>

        <div class="field is-grouped is-grouped-right">
            <div class="control">
                <button class="button is-primary" type="submit">Login</button>
            </div>
        </div>
    </form>
</div>