36 lines
1 KiB
Text
36 lines
1 KiB
Text
|
{% filter markdown %}{% raw %}
|
||
|
|
```html+jinja
|
||
|
|
<TabGroup>
|
||
|
|
<TabSelect>
|
||
|
|
<TabOption target="select-recent">Recent</TabOption>
|
||
|
|
<TabOption target="select-popular">Popular</TabOption>
|
||
|
|
<TabOption target="select-disabled" disabled>Disabled</TabOption>
|
||
|
|
<TabOption target="select-trending">Trending</TabOption>
|
||
|
|
</TabSelect>
|
||
|
|
|
||
|
|
<TabList>
|
||
|
|
<Tab target="select-recent">Recent</Tab>
|
||
|
|
<Tab target="select-popular" selected>Popular</Tab>
|
||
|
|
<Tab target="select-disabled" disabled>Disabled</Tab>
|
||
|
|
<Tab target="select-trending">Trending</Tab>
|
||
|
|
</TabList>
|
||
|
|
|
||
|
|
<TabPanel id="select-recent">
|
||
|
|
<p>This is the tab panel for <b>"Recent"</b>.</p>
|
||
|
|
</TabPanel>
|
||
|
|
|
||
|
|
<TabPanel id="select-popular" hidden>
|
||
|
|
<p>This is the tab panel for <b>"Popular"</b>.</p>
|
||
|
|
</TabPanel>
|
||
|
|
|
||
|
|
<TabPanel id="select-disabled" hidden>
|
||
|
|
<p>This is the tab panel for "Disabled".</p>
|
||
|
|
</TabPanel>
|
||
|
|
|
||
|
|
<TabPanel id="select-trending" hidden>
|
||
|
|
<p>This is the tab panel for <b>"Trending"</b>.</p>
|
||
|
|
</TabPanel>
|
||
|
|
</TabGroup>
|
||
|
|
```
|
||
|
|
{% endraw %}{% endfilter %}
|