Difference between revisions of "Template:Tabs"

Revision as of 19:55, 7 November 2020

Tab#1: the Tabs Template
It is the active tab

Tab#2! the Tab Template
This tab is inactive

↑ This is Tab#1 ↑	↑ This is Tab#2 ↑

This template is designed to assemble a set of tabs (10 max) such as the ones on this same page. Lets explain how it works on this example. It uses the Tab "sub"-template.

Tabs code

 {{Tabs
|bord=2px solid #{{ColorAtys|type=dark|group=tryker}}
|bg_frame=#{{ColorAtys|type=bg|group=tryker}}
|round=5em
|align_tab=center
<!--  -->
|Tab-1={{3DText|text='''Tab#1 the Tabs Template'''}} 
|URL-1=Template:Tabs 
|bg_Tab-1=#{{ColorAtys|type=light|group=tryker}}
|Pic-1=dummy.png 
<!--  -->
|Tab-2={{3DText|text='''''Tab#2 the Tab Template'''''}}
|URL-2=Template:Tab
|bg_Tab-2=#{{ColorAtys|type=light|group=fyros}}
|Pic-2=UnderConstruction.png
}}

**Code explained**
`Code`	Effect	Range
`{{Tabs`	-	Start of template call
`\|bord=2px solid #{{ColorAtys\|type=dark\|group=tryker}}`	defines border line type, thickness and colour	the whole framed page
`\|bg_frame=#{{ColorAtys\|type=bg\|group=tryker}}`	defines page background colour : here bg (background) tryker blue as defined in ColorAtys template.
`\|round=5em`	Radius of rounded corners Note that only tab corners are rounded.
`\|align_tab=center`	text alignment of tab names
`<!-- -->`	empty comment (used as separator)	to make the code easier to read
`\|Tab-1={{3DText\|text='''Tab#1 the Tabs Template'''}}`	Tab name	This single tab Note that the parameters are numbered. You can have up to 10 tabs as this one.
`\|URL-1=Template:Tabs`	The url of the page in which the tab is "active". The url is the one of the actual page, the tab is "active", thus its background is the page body one.
`\|bg_Tab-1=#{{ColorAtys\|type=light\|group=tryker}}`	Tab background color: here light tryker blue, effective only if url differs from actual page.
`\|Pic-1=dummy.png`	An icon to be displayed left of the tab title.
`<!-- -->`	separator	to make the code easier to read
`\|Tab-2={{3DText\|text='''''Tab#2 the Tab Template'''''}}`	Second tab title.	This single tab
`\|URL-2=Template:Tab`	This page is not the actual page, the tab is "inactive" "Inactive" tabs are separated from the page body by an horizontal line.
`\|bg_Tab-2=#{{ColorAtys\|type=light\|group=fyros}}`	Tab background colour: here light fyros orange
`\|Pic-2=UnderConstruction.png`	Tab 2 icon
`}}`	-	End of Template.

Ex

With 2 tabs, no 3D Text: Wheel of fortune

@@ Line 28: / Line 28: @@
 |align_tab=center
-|Tab-1={{3DText|text='''Tab#1: the Tabs Template'''}}
+|Tab-1={{3DText|text='''Tab#1: the Tabs Template<br />It is the ''active''  tab'''}}
 |URL-1=Template:Tabs
 |bg_Tab-1=#{{ColorAtys|type=light|group=tryker}}
 |Pic-1=dummy.png
-|Tab-2={{3DText|text='''''Tab#2 the Tab Template'''''}}
+|Tab-2={{3DText|text='''''Tab#2! the Tab Template'''''<br />This tab is ''inactive''}}
 |URL-2=Template:Tab
 |bg_Tab-2=#{{ColorAtys|type=light|group=fyros}}
@@ Line 44: / Line 44: @@
 |RU=Шаблон:Tabs
 }}[[Category:Tab]]
+<br /><!-- <span style="font: bold 5em Times New Roman, Times, Georgie, serif; color: crimson;">Ce texte est vert</span> -->
 <br />
-<br />
+{| class="wikitable" style="margin: auto; width: 100%; background-color:transparent; text-align:center;font: bold 2em serif;;"
+|-
+| <span style="font: bold 2em serif; color: crimson;">↑</span> This is Tab#1 <span style="font: bold 2em serif; color: crimson;">↑</span> || <span style="font: bold 2em serif; color: crimson;">↑</span> This is Tab#2 <span style="font: bold 2em serif; color: crimson;">↑</span>
+|}
 :This template is designed to assemble a set of tabs (10 max) such as the ones on this same page. Lets explain how it works on this example. It uses the [[:Template:Tab|Tab "sub"-template]].
 ==Tabs code==

From EncyclopAtys

Revision as of 19:55, 7 November 2020

Tabs code

Ex