Tabset v0.1.11+

Basic Tabset

Cupcake Ipsum

Biscuit Marshmallow

Caramels Marzipan

First Panel

Cupcake ipsum dolor sit amet bonbon topping caramels. Sesame snaps gummi bears liquorice cookie chupa chups fruitcake croissant chocolate topping. Brownie biscuit wafer marshmallow liquorice soufflé powder jelly.

Sweet roll sesame snaps danish I love jelly wafer dragée soufflé cake. Cookie chocolate cake gingerbread powder icing. Ice cream cotton candy gummi bears oat cake sweet pastry.

Second Panel

Cupcake ipsum dolor sit. Amet danish jelly gummi bears. Danish caramels danish candy canes macaroon donut icing. Cupcake tiramisu soufflé fruitcake. Caramels muffin tootsie roll lemon drops bear claw cotton candy tootsie roll tootsie roll chupa chups. Pudding fruitcake ice cream marshmallow. Candy sugar plum chupa chups cotton candy gingerbread pastry gingerbread marshmallow wafer. Jelly-o bonbon dessert donut.

Link inside the panel

Sweet toffee pie icing croissant halvah chupa chups. Cotton candy pie sesame snaps. Muffin sesame snaps cake toffee liquorice apple pie apple pie chupa chups. Lemon drops caramels sugar plum. Sweet oat cake chocolate pudding cake toffee chocolate topping. Caramels caramels candy muffin topping toffee. Topping candy canes sesame snaps carrot cake dragée wafer jelly beans. Macaroon gummies tootsie roll cookie chocolate cake chocolate cake dragée cupcake. Wafer bonbon sweet roll sweet roll.

Sugar plum bonbon tiramisu tart candy canes sesame snaps tiramisu. Soufflé chocolate bar macaroon sweet bear claw dragée muffin dragée jelly. Apple pie gummies cake tiramisu dessert ice cream sweet roll. Pie fruitcake dragée. Gummi bears pudding muffin tart. Cake liquorice cheesecake donut. Cake chocolate marshmallow marshmallow dragée cupcake chocolate cake chocolate. Candy canes chocolate sweet roll apple pie icing danish chocolate bar. Jujubes toffee gummies powder cupcake topping chocolate. Cake sugar plum fruitcake brownie.

Third Panel

<hx-tabset>
  <hx-tablist>
    <hx-tab>First</hx-tab>
    <hx-tab>Second</hx-tab>
    <hx-tab>Third</hx-tab>
  </hx-tablist>
  <hx-tabcontent>
    <hx-tabpanel>...</hx-tabpanel>
    <hx-tabpanel>...</hx-tabpanel>
    <hx-tabpanel>...</hx-tabpanel>
  </hx-tabcontent>
</hx-tabset>

Dynamic Tabset

Tab #1

Tab #2

Tab #3

Tab Panel #1

Tab Panel #2

Tab Panel #3

<hx-tabset current-tab="0">
  <hx-tablist>
    <hx-tab id="tab-1" current="true"></hx-tab>
    <hx-tab id="tab-2"></hx-tab>
    <hx-tab id="tab-3"></hx-tab>
  </hx-tablist>
  <hx-tabcontent>
    <hx-tabpanel id="panel-1" open></hx-tabpanel>
    <hx-tabpanel id="panel-2"></hx-tabpanel>
    <hx-tabpanel id="panel-3"></hx-tabpanel>
  </hx-tabcontent>
</hx-tabset>

First Panel

Second Panel

Third Panel

See Also