zitadel/internal/ui/login/static/templates/login.html

{{template "main-top" .}}

<div class="head">
    {{if .Linking}}
        <h1>{{t "Login.TitleLinking"}}</h1>
        <p>{{t "Login.DescriptionLinking"}}</p>
    {{else}}
        <h1>{{t "Login.Title"}}</h1>
        <p>{{t "Login.Description"}}</p>
    {{end}}
</div>


<form action="{{ loginNameUrl }}" method="POST">

    {{ .CSRF }}

    <input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />

    {{if .LoginPolicy.AllowUsernamePassword }}
    <div class="fields">
        <div class="field">
            <label class="label" for="loginName">{{t "Login.Loginname"}}</label>
            <input class="input" type="text" id="loginName" name="loginName" placeholder="{{t "Login.LoginnamePlaceHolder"}}" value="{{ .LoginName }}" autocomplete="username" autofocus required>
        </div>
    </div>
    {{end}}

    {{template "error-message" .}}

    <div class="actions">
        <button class="primary" id="submit-button" type="submit">{{t "Actions.Next"}}</button>
        {{if .LoginPolicy.AllowRegister}}
            <button class="secondary" name="register" value="true" formnovalidate>{{t "Actions.Register"}}</button>
        {{end}}
    </div>

    {{if hasExternalLogin }}
        <div class="actions idp-providers">
            <p>{{t "Login.ExternalLogin"}}</p>

            {{ $reqid := .AuthReqID}}
            {{range $provider := .IDPProviders}}
                <a href="{{ externalIDPAuthURL $reqid $provider.IDPConfigID}}" class="button secondary idp-provider {{idpProviderClass $provider.StylingType}}">
                    <span class="logo"></span>
                    <span class="provider-name">{{$provider.Name}}</span>
                </a>
            {{end}}
        </div>
    {{end}}
</form>


<script src="{{ resourceUrl "scripts/form_submit.js" }}"></script>
<script src="{{ resourceUrl "scripts/default_form_validation.js" }}"></script>

{{template "main-bottom" .}}