type

Description

sets the position of the Tabs control

Type

string

Values

"top"|"bottom"

Default

"top"

Example

<script>
    const tabs = [
        { id: 0, label: "Info", icon: "wxi-alert" },
        { id: 1, label: "About" },
        { id: 2, label: "Contact" },
        { id: 3, label: "", icon: "wxi-check" },
    ];

    let active = 2;
</script>

<div class="tabbar">
    {#if active === 0}
        <div class="body">Info</div>
    {:else if active === 1}
        <div class="body">About</div>
    {:else if active === 2}
        <div class="body">Contact</div>
    {:else}
        <div class="body">Check</div>
    {/if}
    <Tabs options={tabs} bind:value={active} type={'bottom'} />
</div>

Details

The property is used to ensure the correct styling of the bottom panel with tabs. It should be set, since the styling may differ depending on the used skin.

Related article: Setting the position of tabs

Related sample: Tabs