Asymmetrik/ngx-starter

<section class="container">
    <!-- PKI Authentication Strategy -->
    @if (pkiMode()) {
        <div class="signin-container mx-auto mt-5">
            <loading-spinner message="Signing In..." [hidden]="error()" />
            <div class="text-center text-danger" [hidden]="!error()">
                <p>Unable to authenticate:</p>
                <strong>{{ error() }}</strong>
            </div>
        </div>
    } @else {
        <form
            class="mx-auto mt-5 signin-container"
            role="form"
            autocomplete="off"
            novalidate
            #form="ngForm"
            (ngSubmit)="signin()"
        >
            <!-- Username/Password Authentication Strategy -->
            <h2 class="text-center">Sign In</h2>
            <div class="signin-form" autocomplete="off">
                <fieldset>
                    <legend></legend>
                    <div class="mb-3">
                        <label class="form-label" for="username">Username</label>
                        <input
                            class="form-control"
                            id="username"
                            name="username"
                            type="text"
                            autocomplete="username"
                            autofocus
                            placeholder="Username"
                            required
                            [(ngModel)]="username"
                            (keyup.enter)="signin()"
                        />
                    </div>
                    <div class="mb-3">
                        <label class="form-label" for="password">Password</label>
                        <input
                            class="form-control"
                            id="password"
                            name="password"
                            type="password"
                            autocomplete="current-password"
                            minlength="6"
                            placeholder="Password"
                            required
                            [(ngModel)]="password"
                            (keyup.enter)="signin()"
                        />
                    </div>
                    <div class="mb-3 text-center">
                        <button
                            class="btn btn-primary me-2"
                            type="submit"
                            [disabled]="!form.form.valid"
                        >
                            Sign In
                        </button>
                        <button class="btn btn-link" type="button" routerLink="/signup">
                            or Sign Up
                        </button>
                    </div>
                    <div class="text-center text-danger" [hidden]="!error()">
                        <strong>{{ error() }}</strong>
                    </div>
                </fieldset>
            </div>
        </form>
    }
</section>