[tabs] vertical variant

[mauritskorse]

Vertical tabs with tabpanel on the right (or left side).

Currently I have done it like this.

<flux:tab.group class="flex flex-row gap-8">
    <flux:tabs class="flex-col !border-b-0 pr-4 border-r">
        <flux:tab name="profile" icon="user" class="!border-b-0 border-l-[2px]">Profile</flux:tab>
        <flux:tab name="settings" icon="cog-6-tooth" class="!border-b-0 border-l-[2px]">Settings</flux:tab>
        <flux:tab name="security" icon="shield-check" class="!border-b-0 border-l-[2px]">Security</flux:tab>
        <flux:tab name="billing" icon="banknotes" class="!border-b-0 border-l-[2px]">Billing</flux:tab>
    </flux:tabs>

  <flux:tab.panel name="profile" class="items-start !pt-0 space-y-4">
    ...
  </flux:tab.panel>

[benjibee]

@joshhanley some good feature requests getting lost here!

[joshhanley]

@benjibee what do you mean they are getting lost?

[benjibee]

I was clicking through the different pages of discussions and seeing some interesting feature requests without much interaction. Like this one from Oct. 2nd. Maybe "getting lost" is a bit dramatic, just don't know what's on the team's radar!

[joshhanley]

@benjibee ah right, yeah we see them all but yeah can be tough to keep track because there are so many 🙂

[melokullc]

Thank you for sharing this tabs variant, I was just searching for this for a project!