More actions
m Change formatting. |
Fix typo. Add basic info about design-tokens. |
||
| (6 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
; Description | ; Description | ||
: This template creates a colored banner with centered text. | : This template creates a colored banner with, by default, centered text. | ||
: '''Known issues''': (2025-06-08) Using this template inside a list, created with wiki mark-up will break the code. | |||
; Dependencies | ; Dependencies | ||
: Uses: | : Uses: | ||
| Line 8: | Line 10: | ||
:: {{T|Deletion}} | :: {{T|Deletion}} | ||
:: {{T|Deprecated}} | :: {{T|Deprecated}} | ||
:: {{T|Eunispecific}} | |||
:: {{T|Merge}} | :: {{T|Merge}} | ||
:: {{T|Mission stub}} | :: {{T|Mission stub}} | ||
| Line 14: | Line 17: | ||
:: {{T|Past content}} | :: {{T|Past content}} | ||
:: {{T|Stub}} | :: {{T|Stub}} | ||
:: {{T|Update}} | :: {{T|Update}} | ||
:: {{T|Work in progress}} | :: {{T|Work in progress}} | ||
;Syntax | ;Syntax | ||
:{{T|Banner|2=color= |3=border= |4=text= |5=content}} | : {{T|Banner|2= color= color|3= border= color|4= text= color|5= icon= link|6= icon-both= yes|7= align= align|8= content}} | ||
:: '''color''' - Color of the banner background. If omitted the background color is | : With the exception of <kbd>content</kbd>, all parameters are optional | ||
:: '''color''' - Color of the banner background. If omitted the background color is transparent. | |||
:: Colors can be given either by design-token<ref>Design tokens are the building blocks of UI elements. For colors they are used as CSS custom properties (variables) e.g. var(--background-color-warning-subtle). For wikimedia see: [https://doc.wikimedia.org/codex/latest/design-tokens/overview.html Design tokens]. Warning: Individual wikis can change these base color i.e. in [[MediaWiki:Citizen.css|Citizen.css]]</ref>, color name<ref>https://www.w3schools.com/cssref/css_colors.asp [2021-10-23]</ref> (e.g. {{Co|red|red}} or {{Co|green|green}}) or values<ref>https://www.w3schools.com/cssref/css_colors_legal.asp [2021-10-23]</ref> (like {{Co|#0000FF|#0000FF}}). | |||
:: '''border''' - Color of the border of the banner. If omitted and "color" is given then the border is the same color as the background. If color is also omitted then the border color is {{Co|red|red}}. | :: '''border''' - Color of the border of the banner. If omitted and "color" is given then the border is the same color as the background. If color is also omitted then the border color is {{Co|red|red}}. | ||
:: '''text''' - Color of the text in the banner. If omitted the text color is | :: '''text''' - Color of the text in the banner. If omitted the text color is inherited from the parent container.the icon is placed on the left side of the banner. | ||
:: '''icon''' - Link or Semantic MediaWiki code for the icon. | |||
:: '''icon-both''' - To repeat the icon on the right side of the banner. | |||
:: '''align''' - To align the text content of the banner (CSS values). | |||
:: '''content''' - The content of the banner | :: '''content''' - The content of the banner | ||
; Sample output | ; Sample output | ||
: {{Code|<nowiki>{{Banner|This is a banner!}}</nowiki> gives...}} {{Banner|This is a banner!}} | : {{Code|<nowiki>{{Banner|This is a banner!}}</nowiki> gives...}} | ||
: {{Code|<nowiki>{{Banner|color= LightSalmon|border= blue|text= #000000|This is a light salmon banner with a blue border and black text !}}</nowiki> gives...}} {{Banner|color= LightSalmon|border= blue|text= #000000|This is a light salmon banner with a blue border and black text !}} | {{Banner|This is a banner!}} | ||
: {{Code|<nowiki>{{Banner | |||
| color= LightSalmon | |||
| border= blue | |||
| text= #000000 | |||
| This is a light salmon banner with a blue border and black text ! | |||
}}</nowiki> gives...}} | |||
{{Banner | |||
| color= LightSalmon | |||
| border= blue | |||
| text= #000000 | |||
| This is a light salmon banner with a blue border and black text ! | |||
}} | |||
: {{Code|<nowiki>{{Banner | |||
| icon= [[File:Icon timer non-capsuleer.png|link=]] | |||
| This is a banner with an icon link. | |||
}}</nowiki> gives...}} | |||
{{Banner | |||
| icon= [[File:Icon timer non-capsuleer.png|link=]] | |||
| This is a banner with an icon link. | |||
}} | |||
: {{Code|<nowiki>{{Banner | |||
| icon= {{#show: UniWiki:EVE University Graphics|?Has EVE University emblem#64px}} | |||
| align= left | |||
| This banner uses Semantic MediaWiki code for the icon and has left aligned text. | |||
}}</nowiki> gives...}} | |||
{{Banner | |||
| icon= {{#show: UniWiki:EVE University Graphics|?Has EVE University emblem#64px}} | |||
| align= left | |||
| This banner uses Semantic MediaWiki code code for the icon and has left aligned text. | |||
}} | |||
; References | ; References | ||
<references /> | <references /> | ||
<includeonly>[[Category:Formatting templates]]</includeonly><noinclude>[[Category:Template documentation]]</noinclude> | <includeonly>[[Category:Formatting templates]]</includeonly><noinclude>[[Category:Template documentation]]</noinclude> | ||