Template:Ability card v2/Card/MainBox: Difference between revisionsGive feedback
Tag: Undo |
m Fixed vertical misalignment of icons and labels, now with consideration for main box headers |
||
| Line 1: | Line 1: | ||
<includeonly> | <includeonly> | ||
<div style="display:flex; flex-direction:column; flex-grow: 1; flex-basis: 0; height: | <div style="display:flex; flex-direction:column; flex-grow: 1; flex-basis: 0; max-height: 100%; padding: 10px 0px 10px 0px; margin: 3px; overflow: hidden;"> | ||
{{#if:{{{title|}}}|<div style="padding-bottom: 2px; font-size: 0.8rem; color: #9C9C9C; font-variant: small-caps;">'''{{{title}}}'''</div>|}}{{#switch: {{{scale_type}}}|melee = | {{#if:{{{title|}}}|<div style="padding-bottom: 2px; font-size: 0.8rem; color: #9C9C9C; font-variant: small-caps;">'''{{{title}}}'''</div>|}}{{#switch: {{{scale_type}}}|melee = | ||
<div style="position: relative;"> | <div style="position: relative;"> | ||
| Line 13: | Line 13: | ||
</div> | </div> | ||
</div>}} | </div>}} | ||
<div style="display:flex; flex-direction:column; flex-grow: 1; justify-content: | <div style="display:flex; flex-direction:column; flex-grow: 1; justify-content: space-between; {{#switch: {{{scale_type}}} | melee | spirit = background: rgb(42,41,43); | ||
background: radial-gradient(circle, rgba(42,41,43,1) 0%, rgba(59,49,69,1) 100%); |background-color: #2A2A2A}}; text-align: center; border: 3px solid {{#switch: {{{scale_type}}} | melee | spirit = #583D6F | #2A2A2A}}; box-shadow: 0 0 10px {{#switch: {{{scale_type}}} | melee | spirit = #3d2c4d | #2A2A2A}}; border-radius: 1px"> | background: radial-gradient(circle, rgba(42,41,43,1) 0%, rgba(59,49,69,1) 100%); |background-color: #2A2A2A}}; text-align: center; border: 3px solid {{#switch: {{{scale_type}}} | melee | spirit = #583D6F | #2A2A2A}}; box-shadow: 0 0 10px {{#switch: {{{scale_type}}} | melee | spirit = #3d2c4d | #2A2A2A}}; border-radius: 1px"> | ||
<div style="font-weight: bold;"> | <div style="font-weight: bold;"> | ||
| Line 20: | Line 20: | ||
{{ValueAndUom|'''{{{value}}}'''|{{Lang|key={{{key}}}_postfix}}|uom_style=font-size: calc(1em - 2px); color: #B2B2B2}} | {{ValueAndUom|'''{{{value}}}'''|{{Lang|key={{{key}}}_postfix}}|uom_style=font-size: calc(1em - 2px); color: #B2B2B2}} | ||
}}</div> | }}</div> | ||
<div style="font-size: 0.8rem">{{#if:{{{label|}}}|{{{label}}}|{{Lang|key={{{key}}}_label}}}}</div> | <div style="font-size: 0.8rem; padding-bottom: 3px">{{#if:{{{label|}}}|{{{label}}}|{{Lang|key={{{key}}}_label}}}}</div> | ||
</div></div> | </div></div> | ||
</includeonly><noinclude> | </includeonly><noinclude> | ||
{{Documentation}} | {{Documentation}} | ||
</noinclude> | </noinclude> | ||
Revision as of 12:33, 9 May 2025
Display element for a main ability attribute, of which heroes usually have between 1 and 3 in their ability cards
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| value | value | Display value of the attribute
| Number | required |
| key | key | Will retrieve the attribute label from localization data based on the current selected language using "<key>_label" | String | suggested |
| label | label | Display label for attribute. Will override the use of "key" argument | String | optional |
| type | type | Attribute type - used to automatically retrieve the icon's image, link, size (but not color)
| String | suggested |
| scale_type | scale_type | Type of attribute scaling
| String | optional |
| scale_value | scale_value | Multiplier for the scaling
| Number | optional |
| title | title | Title that appears above the container
| String | optional |
| icon_color | icon_color | Color of the attribute icon
| String | optional |
| icon | icon | Icon's image name. Overridden by image found via "type" parameter
| String | optional |
| icon_size | icon_size | Icon's size. Overridden by size retrieved via "type" parameter
| String | optional |
| icon_link | icon_link | Icon's hyperlink. Overridden by link retrieved via "type" parameter | String | optional |