Welcome to Family Payments

Sign in to open the dashboard. This sample accepts any username and a password of at least 4 characters.

Back to the dashboard

ASPX markup
<div class="container-xxl">
        <div class="authentication-wrapper authentication-basic container-p-y">
            <div class="authentication-inner">
                <div class="card">
                    <div class="card-body">
                        <div class="app-brand justify-content-center">
                            <a href="<%= ResolveUrl("~/Default.aspx") %>" class="app-brand-link gap-2">
                                <span class="app-brand-logo demo">
                                    <img src="<%= Branding.LogoUrl %>" alt="<%= Server.HtmlEncode(Branding.SiteName) %>" class="brand-logo" data-brand-light="<%= Branding.LogoUrl %>" data-brand-dark="<%= Branding.LogoDarkUrl %>" />
                                </span>
                                <span class="app-brand-text demo text-body fw-bold"><%= Server.HtmlEncode(Branding.SiteName) %></span>
                            </a>
                        </div>
                        <h4 class="mb-2">Welcome to <%= Server.HtmlEncode(Branding.SiteName) %></h4>
                        <p class="mb-4">Sign in to open the dashboard. This sample accepts any username and a password of at least 4 characters.</p>

                        <div class="mb-3">
                            <label class="form-label" for="<%= UserNameText.ClientID %>">Username</label>
                            <asp:TextBox ID="UserNameText" runat="server" CssClass="form-control" placeholder="Enter your username" autocomplete="username" />
                            <asp:RequiredFieldValidator runat="server" ControlToValidate="UserNameText" ErrorMessage="Username is required." Text="Username is required." Display="Dynamic" CssClass="text-danger d-block small mt-1" />
                        </div>
                        <div class="mb-3 form-password-toggle">
                            <label class="form-label" for="<%= PasswordText.ClientID %>">Password</label>
                            <div class="input-group input-group-merge">
                                <asp:TextBox ID="PasswordText" runat="server" TextMode="Password" CssClass="form-control" placeholder="············" autocomplete="current-password" />
                                <span class="input-group-text cursor-pointer"><i class="bx bx-hide"></i></span>
                            </div>
                            <asp:RequiredFieldValidator runat="server" ControlToValidate="PasswordText" ErrorMessage="Password is required." Text="Password is required." Display="Dynamic" CssClass="text-danger d-block small mt-1" />
                            <asp:RegularExpressionValidator runat="server" ControlToValidate="PasswordText" ValidationExpression=".{4,}" ErrorMessage="Use at least 4 characters." Text="Use at least 4 characters." Display="Dynamic" CssClass="text-danger d-block small mt-1" />
                        </div>
                        <div class="mb-3">
                            <asp:CheckBox ID="RememberCheck" runat="server" Text="Remember me on this browser" />
                        </div>
                        <div class="mb-3">
                            <asp:Button ID="SignInButton" runat="server" Text="Sign in" CssClass="btn btn-primary w-100" OnClick="SignInButton_Click" />
                        </div>
                        <p class="text-center mb-0">
                            <a href="<%= ResolveUrl("~/Default.aspx") %>">Back to the dashboard</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
VB.NET code-behind
' Code-behind ships compiled into the site assembly.
' Open the matching .aspx.vb file in the Visual Studio project to copy it.