Template:Callout/doc: Difference between revisions
From Space Station 14 Wiki
(Created page with "== Syntax == {{tj|Callout |1: <nowiki>[REQUIRED] Type of the callout. Select from the suggested values. Any casing is supported. TYPE: line</nowiki> |2: <nowiki>[REQUIRED] Content of the callout. TYPE: string</nowiki> |header: <nowiki>Header text of the callout. By default, depends on the type. TYPE: line</nowiki> |align: <nowiki>Alignment of the callout. TYPE: line</nowiki> }} == Examples == === Types === {| class="wikitable" |+ Capti...") |
(→Stacked callouts: fixed example) |
||
| (11 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
== Examples == | == Examples == | ||
=== Types === | === Types === | ||
| Line 45: | Line 30: | ||
|| {{Callout|Example|An example for something.}} | || {{Callout|Example|An example for something.}} | ||
|} | |} | ||
=== Header label === | |||
{{tji|Callout|Info|header:Notice|Bla-bla-bla, lorem ipsum...}} <br> | |||
{{or}} <br> | |||
{{tji|Callout|Info|h:Notice|Bla-bla-bla, lorem ipsum...}} | |||
{{gda}} | |||
{{Callout|Info|header=Notice|Bla-bla-bla, lorem ipsum...}} | |||
{{gray or}} <br> | |||
{{Callout|Info|h=Notice|Bla-bla-bla, lorem ipsum...}} | |||
=== Alignment === | |||
==== Left ==== | |||
The default. | |||
==== Center ==== | |||
{{tji|Callout|Info|align:center|Bla-bla-bla, lorem ipsum...}} <br> | |||
{{or}} <br> | |||
{{tji|Callout|Info|a:center|Bla-bla-bla, lorem ipsum...}} | |||
{{gda}} | |||
{{Callout|Info|align=center|Bla-bla-bla, lorem ipsum...}} | |||
{{or}} | |||
{{Callout|Info|a=center|Bla-bla-bla, lorem ipsum...}} | |||
==== Right ==== | |||
{{tji|Callout|Info|align:right|Bla-bla-bla, lorem ipsum...}} <br> | |||
{{gda}} | |||
{{Callout|Info|align=right|Bla-bla-bla, lorem ipsum...}} | |||
=== Images === | |||
{{tj|Callout|Info|header:Work in Progress|align:center|This page is unfinished.|image:Wired Frame.png|image2:Wrench.png}} | |||
{{gda}} | |||
{{Callout|Info|header=Work in Progress|align=center|This page is unfinished.|image=Wired Frame.png|image2=Wrench.png}} | |||
=== Stacked callouts === | |||
Sets the callout to a predefined width, making all callouts with the same class appear with the same width. | |||
Callouts will be stacked to the right and will require {{t|clear}} after to not overflow with the content that goes after. | |||
{{tji|Callout|stacked:1|Info|An informative message. An informative message. An informative message.}} <br> | |||
{{tji|Callout|stacked:1|Info|Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum...}} <br> | |||
{{tji|Clear}} | |||
{{gda}} | |||
{{Callout|stacked=1|Info|An informative message. An informative message. An informative message.}} | |||
{{Callout|stacked=1|Info|Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum...}} | |||
{{Clear}} | |||
=== Wrapper classes === | |||
Allows to add custom classes to the wrapper element. | |||
{{tji|Callout|wrapper class:hello|Info|An informative message.}} | |||
{{gda}} | |||
{{Callout|wrapper class=hello|Info|An informative message.}} | |||
<noinclude>[[Category:Template documentation]]</noinclude> | |||
Latest revision as of 10:08, 17 August 2024
Examples
Types
| Type | Syntax | Result |
|---|---|---|
| Info | {{Callout |
Info An informative message. |
| Warning | {{Callout |
Warning Something to be warned about. |
| Danger | {{Callout |
Danger The clown is closing in. |
| Tip | {{Callout |
Tip When walking over slippery surfaces, hold Shift to slow down and not slip (in most cases). |
| Example | {{Callout |
Example An example for something. |
Header label
{{Callout
or
{{Callout
↓
Notice
Bla-bla-bla, lorem ipsum...
or
Notice
Bla-bla-bla, lorem ipsum...
Alignment
Left
The default.
Center
{{Callout
or
{{Callout
↓
or
Right
{{Callout
↓
Info
Bla-bla-bla, lorem ipsum...
Images
{{Callout
| Info
| header = Work in Progress
| align = center
| This page is unfinished.
| image = Wired Frame.png
| image2 = Wrench.png
}}
| Info
| header = Work in Progress
| align = center
| This page is unfinished.
| image = Wired Frame.png
| image2 = Wrench.png
}}
↓
Work in Progress
This page is unfinished.
Stacked callouts
Sets the callout to a predefined width, making all callouts with the same class appear with the same width.
Callouts will be stacked to the right and will require {{clear}} after to not overflow with the content that goes after.
{{Callout
{{Callout
{{Clear}}
↓
Info
An informative message. An informative message. An informative message.
Info
Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum... Bla-bla-bla, lorem ipsum...
Wrapper classes
Allows to add custom classes to the wrapper element.
{{Callout
↓
Info
An informative message.
