@page "/signature-pad"
@inject IStringLocalizer<SignaturePads> Localizer

<h3>@Localizer["Title"]</h3>

<PackageTips Name="BootstrapBlazor.SignaturePad" />

<DemoBlock Title="@Localizer["BaseUsageText"]" Introduction="@Localizer["BaseUsageIntro"]" Name="Normal">
    <Pre>&lt;SignaturePad OnResult="OnResult" /&gt;</Pre>
    <div class="row">
        <div class="col-12 col-sm-6">
            <div class="form-label mt-3">@Localizer["SignText"]</div>
            <SignaturePad OnResult="OnResult" />
        </div>
        <div class="col-12 col-sm-6">
            @if (Result != null)
            {
                <div class="form-label">@Localizer["ResultText"]</div>
                <img src="@Result" style="height: 240px; width: auto;" />
                <div class="form-label">@Localizer["ResultBase64Text"]</div>
                <textarea class="form-control" rows="4" @bind="Result" />
            }
        </div>
    </div>
</DemoBlock>

<DemoBlock Title="@Localizer["ButtonCssStyleText"]" Introduction="@Localizer["ButtonCssStyleIntro"]" Name="ButtonCssStyle">
    <Pre>&lt;SignaturePad OnResult="OnResult" BtnCssClass="btn btn-outline-success" /&gt;</Pre>
    <div class="form-label mt-3">@Localizer["SignText"]</div>
    <SignaturePad OnResult="OnResult2" BtnCssClass="btn btn-outline-success" />
</DemoBlock>

<DemoBlock Title="@Localizer["CustomButtonText"]" Introduction="@Localizer["CustomButtonIntro"]" Name="CustomButton">
    <Pre>&lt;SignaturePad OnResult="OnResult" SignAboveLabel="Sign above" UndoBtnTitle="Undo" SaveBase64BtnTitle="OK" ChangeColorBtnTitle="Change color" ClearBtnTitle="Clear" /&gt;</Pre>
    <SignaturePad OnResult="OnResult3" SignAboveLabel="Sign above" UndoBtnTitle="Undo" SaveBase64BtnTitle="OK" ChangeColorBtnTitle="Change color" ClearBtnTitle="Clear" />
</DemoBlock>

<DemoBlock Title="@Localizer["ResponsiveInterfaceText"]" Introduction="@Localizer["TipsResponsive"]" Name="ResponsiveInterface">
    <a class="btn btn-primary" type="button" href="signature-responsive">@Localizer["ResponsiveInterfaceText"]</a>
</DemoBlock>

<Tips>
    <p>@((MarkupString)Localizer["Tips"].Value)</p>
</Tips>

<AttributeTable Items="@GetAttributes()" />
