@page "/footers"

<h3>Footer</h3>

<h4>Displayed at the bottom of the page, with a back to top button</h4>

<p>When using <code>Footer</code> components, pay attention to the setting of the style sheet <code>position</code> attribute</p>

<DemoBlock Title="Basic usage" Introduction="Pass the ID of the scroll bar component to the footer component" Name="Normal">
    <div id="scroll" class="overflow-auto border border-secondary p-3" style="max-height: 180px; border-radius: 4px; position: relative;">
        <div style="height: 200px">
            <p>The Footer component is displayed at the bottom, and the page will automatically scroll back to the top when you click to return to the top</p>
            <p>This example passes the component client ID</p>
        </div>
        <Footer Text="Bootstrap Blazor" Target="#scroll" style="margin: -1rem;" />
    </div>
</DemoBlock>

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

// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/

namespace BootstrapBlazor.Shared.Samples;

/// <summary>
/// 
/// </summary>
public sealed partial class Footers
{
    /// <summary>
    /// 
    /// </summary>
    [Inject]
    [NotNull]
    public IStringLocalizer<Footers>? Localizer { get; set; }

    private IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
    {
            // TODO: 移动到数据库中
            new AttributeItem() {
                Name = "Text",
                Description = Localizer["Desc1"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem() {
                Name = "Target",
                Description = Localizer["Desc2"],
                Type = "string",
                ValueList = " — ",
                DefaultValue = " — "
            }
    };
}