Difference between revisions of "Tabs"
From Sega Retro
Line 2: | Line 2: | ||
{{#if: {{{hidetitle|}}} | | | {{#if: {{{hidetitle|}}} | | | ||
<div class="poot-tabs-title breakout"><span class="poot-tabs-titletext">{{{title|}}}</span></div> | <div class="poot-tabs-title breakout"><span class="poot-tabs-titletext">{{{title|}}}</span></div> | ||
− | }} | + | }}{{#vardefine:tablist|<div class="poot-tabs" role="tablist" style="width:auto; border:0px solid pink; padding:0px; {{#switch:{{{orientation|}}} |
− | {{#vardefine:tablist|<div class="poot-tabs" role="tablist" style="width:auto; border:0px solid pink; padding:0px; {{#switch:{{{orientation|}}} | ||
| horizontal=text-align:center; | | horizontal=text-align:center; | ||
| float:left; | | float:left; |
Revision as of 13:44, 22 April 2022
Usage
Vertical
{{tabs | title=vertical tabs | icon1=tab 1 | icon2=tab 2 | icon3=tab 3 | icon4=tab 4 | icon5=tab 5 | content1=content of tab 1 | content2=things in second tab | content3=another tab content | content4=content of tab 4 | content5=content of tab 5 | orientation=vertical }}
vertical tabs
- tab 1
- tab 2
- tab 3
- tab 4
- tab 5
content of tab 1
things in second tab
another tab content
content of tab 4
content of tab 5
Horizontal
{{tabs | hidetitle=yes | icon1=tab 1 | icon2=tab 2 | icon3=[[file:Logo-md.png|link=]] | content1=aaa | content2=things in second tab[[file:Notavailable.svg]] | content3=another tab content | orientation=horizontal | width=500px | tabliststyle=margin-bottom:0px; }}
Horizontal (flipped)
{{tabs | hidetitle=yes | icon1=tab 1 | icon2=tab 2 | icon3=[[file:Logo-md.png|link=]] | content1=aaa | content2=things in second tab[[file:Notavailable.svg]] | content3=another tab content | orientation=horizontal | width=500px | tabliststyle=margin-top:0px; | flipped=yes }}