View source for Tabs

<includeonly><div class="poot-tabs-container poot-tabs-{{#if:{{{orientation|}}}|{{{orientation}}}|vertical}} {{#if:{{{collapsed|}}}|poot-tabs-collapsed}} poot-tabs-selected-{{{selected|1}}}" style="width:{{#if:{{{width|}}}|{{{width}}}|auto}}; {{{style|}}}">
{{#if: {{{hidetitle|}}} | |
<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|}}}
| horizontal=text-align:center;
| float:left;
}}">
<ul style="background:none; list-style-type:none; {{#if:{{{tabliststyle|}}}|{{{tabliststyle}}}}}">
<li class="poot-tabs-selected" style="padding-left:4px; padding-right:4px; cursor:pointer; {{#ifeq:{{{orientation|}}}|horizontal|display:inline-block; margin-left:5px; margin-right:5px;{{#if:{{{selectedstyle|}}}|{{{selectedstyle|}}}|}}}}">{{{icon1|{{{title1|}}}}}}</li>{{#loop:t
| 2
| 20
| {{#if:{{{icon{{#var:t}}|{{{title{{#var:t}}|}}}}}}|<li style="padding-left:4px; padding-right:4px; cursor:pointer; {{#ifeq:{{{orientation|}}}|horizontal|display:inline-block; margin-left:5px; margin-right:5px;{{#if:{{{notselectedstyle|}}}|{{{notselectedstyle|}}}|}}}}">{{{icon{{#var:t}}|{{{title{{#var:t}}|}}}}}}</li>}}
}}
</ul>
</div>}}{{#vardefine:tabcontent|<div class="poot-tabs-content" role="tabpanel" style="width:auto; border:0px solid orange;">
<div class="poot-tabs-selected">{{{content1}}}</div>
{{#if:{{{icon2|{{{title2|}}}}}}|<div>{{{content2}}}</div>}}{{
  #if:{{{icon3|{{{title3|}}}}}}|<div>{{{content3}}}</div>}}{{
  #if:{{{icon4|{{{title4|}}}}}}|<div>{{{content4}}}</div>}}{{
  #if:{{{icon5|{{{title5|}}}}}}|<div>{{{content5}}}</div>}}{{
  #if:{{{icon6|{{{title6|}}}}}}|<div>{{{content6}}}</div>}}{{
  #if:{{{icon7|{{{title7|}}}}}}|<div>{{{content7}}}</div>}}{{
  #if:{{{icon8|{{{title8|}}}}}}|<div>{{{content8}}}</div>}}{{
  #if:{{{icon9|{{{title9|}}}}}}|<div>{{{content9}}}</div>}}{{
  #if:{{{icon10|{{{title10|}}}}}}|<div>{{{content10}}}</div>}}{{
  #if:{{{icon11|{{{title11|}}}}}}|<div>{{{content11}}}</div>}}{{
  #if:{{{icon12|{{{title12|}}}}}}|<div>{{{content12}}}</div>}}{{
  #if:{{{icon13|{{{title13|}}}}}}|<div>{{{content13}}}</div>}}{{
  #if:{{{icon14|{{{title14|}}}}}}|<div>{{{content14}}}</div>}}{{
  #if:{{{icon15|{{{title15|}}}}}}|<div>{{{content15}}}</div>}}{{
  #if:{{{icon16|{{{title16|}}}}}}|<div>{{{content16}}}</div>}}{{
  #if:{{{icon17|{{{title17|}}}}}}|<div>{{{content17}}}</div>}}{{
  #if:{{{icon18|{{{title18|}}}}}}|<div>{{{content18}}}</div>}}{{
  #if:{{{icon19|{{{title19|}}}}}}|<div>{{{content19}}}</div>}}{{
  #if:{{{icon20|{{{title20|}}}}}}|<div>{{{content20}}}</div>}}
</div>}}
{{#if:{{{flipped|}}}|{{#var:tabcontent}}
{{#var:tablist}}|{{#var:tablist}}
{{#var:tabcontent}}}}
</div>{{clearvar|tablist|tabcontent}}</includeonly><noinclude>
==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
}}

===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;
}}

{{InfoTable|imagewidths=256|
{{InfoRow
| title=ゼロス要基ステージ (Zelos Fortress Stage)
| screenshot=Gradius PCE, Stage 8-1.png
| screenshot2=Gradius PCE, Stage 8-2.png
| screenshot3=Gradius PCE, Stage 8-3.png
| tabs=yes
| desc=
}}
}}

[[Category:Templates]]</noinclude>