Template:IconBox: Difference between revisions

From The Deadlock Wiki
Jump to navigation Jump to search
Vergir (talk | contribs)
Temporarily emit both the ai- and iconbox- class and data attribute names so consumers can migrate one at a time (with help from vergir-bot LLM)
Vergir (talk | contribs)
Support new "enhanced" state (with help from vergir-bot LLM)
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
<includeonly><templatestyles src="IconBox/styles.css" /><div class="ai-box iconbox {{#if:{{{type|}}}|ai-type-{{{type}}} iconbox-type-{{{type}}}}} {{#switch:{{lc:{{{state|}}}}}|disabled=ai-disabled iconbox-disabled|partial=ai-partial iconbox-partial}}" data-ai-icon="{{{iconfile|}}}" data-ai-title="{{{title|}}}" data-ai-state="{{#switch:{{lc:{{{state|}}}}}|disabled=disabled|partial=partial|#default=normal}}" data-iconbox-icon="{{{iconfile|}}}" data-iconbox-title="{{{title|}}}" data-iconbox-state="{{#switch:{{lc:{{{state|}}}}}|disabled=disabled|partial=partial|#default=normal}}">
<includeonly><templatestyles src="IconBox/styles.css" /><div class="iconbox {{#if:{{{type|}}}|iconbox-type-{{{type}}}}} {{#switch:{{lc:{{{state|}}}}}|disabled=iconbox-disabled|partial=iconbox-partial|enhanced=iconbox-enhanced}}" data-iconbox-icon="{{{iconfile|}}}" data-iconbox-title="{{{title|}}}" data-iconbox-state="{{#switch:{{lc:{{{state|}}}}}|disabled=disabled|partial=partial|enhanced=enhanced|#default=normal}}">
<div class="ai-header iconbox-header plainlinks">{{#if:{{{link|}}}
<div class="iconbox-header plainlinks">{{#if:{{{link|}}}
|[{{#ifeq:{{lc:{{padleft:|4|{{{link|}}}}}}}|http|{{{link|}}}|https://deadlock.wiki/{{urlencode:{{{link|}}}|WIKI}}}} {{{title|}}}]
|[{{#ifeq:{{lc:{{padleft:|4|{{{link|}}}}}}}|http|{{{link|}}}|https://deadlock.wiki/{{urlencode:{{{link|}}}|WIKI}}}} {{{title|}}}]
|{{{title|}}}
|{{{title|}}}
}}</div>
}}</div>
<div class="ai-body iconbox-body">
<div class="iconbox-body">
<div class="ai-icon iconbox-icon">{{#if:{{{iconfile|}}}
<div class="iconbox-icon">{{#if:{{{iconfile|}}}
|[[File:{{{iconfile}}}|48px|link={{#if:{{{link|}}}|{{#ifeq:{{lc:{{padleft:|4|{{{link|}}}}}}}|http|{{{link|}}}|https://deadlock.wiki/{{urlencode:{{{link|}}}|WIKI}}}}}}|alt={{{title|}}}]]{{#ifeq:{{lc:{{{state|}}}}}|partial|<span class="ai-icon-partial iconbox-icon-partial">[[File:{{{iconfile}}}|48px|link=]]</span>}}
|[[File:{{{iconfile}}}|48px|link={{#if:{{{link|}}}|{{#ifeq:{{lc:{{padleft:|4|{{{link|}}}}}}}|http|{{{link|}}}|https://deadlock.wiki/{{urlencode:{{{link|}}}|WIKI}}}}}}|alt={{{title|}}}]]{{#ifeq:{{lc:{{{state|}}}}}|partial|<span class="iconbox-icon-partial">[[File:{{{iconfile}}}|48px|link=]]</span>}}
}}</div>
}}</div>
<div class="ai-text iconbox-text">
<div class="iconbox-text">
{{{text|}}}
{{{text|}}}
</div>
</div>
</div>
</div>
</div></includeonly><noinclude>{{Documentation}}</noinclude>
</div></includeonly><noinclude>{{Documentation}}</noinclude>

Latest revision as of 10:09, 2 August 2026

Template documentation [view] [edit] [history] [purge]

{{IconBox}} displays a box with a colored header, an icon, and a body of text.

Used by {{AbilityInteraction}}.

Parameters

[edit source]

Template parameters[Edit template data]

This template prefers block formatting of parameters.

ParameterDescriptionTypeStatus
titletitle

Text shown in the box header.

Stringrequired
texttext

Wikitext shown in the box body. May contain wikilinks, templates such as AbilityIcon, and lists.

Contentoptional
typetype

Header color: positive (green), negative (red), or info (blue).

Suggested values
positive negative info
Stringrequired
iconfileiconfile

File name of the icon image, without the File: prefix.

Example
Healing Booster.png
Stringrequired
linklink

Where the header and icon link. A bare page name (e.g. Healing Booster) or a full URL.

Example
Healing Booster
Stringrequired
statestate

Set to disabled to gray out the icon, partial to gray out half of it, or enhanced to add a blue glow.

Suggested values
disabled partial enhanced
Stringoptional

Examples

[edit source]
{{IconBox
| type     = positive
| iconfile = Melee Charge.png
| link     = Melee Charge
| title    = Melee
| text     = This ability benefits from Melee damage bonuses.
}}
Melee

This ability benefits from Melee damage bonuses.

Data attributes

[edit source]

The box carries several data attributes:

  • data-iconbox-icon,
  • data-iconbox-title,
  • data-iconbox-state on its wrapper element.
These are used by Module:AbilitySection to apply correct styling to its own elements.