Template:Ability card v2/Card/MainBox: Difference between revisions

added melee scaling (WIP)
m Make use of Abilities/icon module
 
(30 intermediate revisions by 4 users not shown)
Line 1: Line 1:
<includeonly>
<includeonly>
<div style="display:flex; flex-direction:column; flex-grow: 1; flex-basis: 0; height: 80px; padding: 10px 0px 10px 0px; margin: 3px;">
<div class="ability-mainbox {{#ifeq:{{{hide|}}}|true|hide}}">
{{#if:{{{title|}}}|<div style="padding-bottom: 2px; font-size: 0.8rem; color: #9C9C9C; font-variant: small-caps;">'''{{{title}}}'''</div>|}}{{#ifeq: {{{scale_type}}}|spirit|
{{#if:{{{title|}}}|<div class="ac-mainbox-title">'''{{{title}}}'''</div>|}}
  <div style="position: relative;">
{{#if:{{{scale_type|}}}|
    <div style="position: absolute; top: -20px; right: -2px">
<div class="ac-mainbox-scale">
    {{Ability card v2/Spirit mult|{{{scale_value}}}}}
<div class="ac-mainbox-scale-badge">
    </div>
{{Ability card v2/Card/Scaling|{{{scale_value|}}}|scale_type={{{scale_type|}}}|id={{{key}}}-scale}}
  </div>}}
</div>
<div style="display:flex; flex-direction:column; flex-grow: 1; justify-content: center; {{#ifeq: {{{scale_type}}} | spirit | background: rgb(42,41,43);
</div>}}
background: radial-gradient(circle, rgba(42,41,43,1) 0%, rgba(59,49,69,1) 100%);  |background-color: #2A2A2A}}; {{#ifeq: {{{scale_type}}} | melee | 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 {{#ifeq: {{{scale_type}}} | spirit | #583D6F | #2A2A2A}}; box-shadow: 0 0 10px {{#ifeq: {{{scale_type}}} | spirit | #3d2c4d | #2A2A2A}}; box-shadow: 0 0 10px {{#ifeq: {{{scale_type}}} | melee | #3d2c4d | #2A2A2A}}; border-radius: 1px">
<div class="ac-mainbox-inner ac-mainbox-inner--{{#if:{{{scale_value|}}}|{{#invoke:Abilities/icon|getScalarIconAttr|{{{scale_type}}}|class}}|default}}">
  <div style="font-weight: bold;">
  <div class="ac-mainbox-value">
{{#vardefine:value_prefix|{{Lang|key={{{key}}}_prefix}}}}
{{Icon/{{{icon_color|Grey}}}|
{{Icon/{{{icon_color|Grey}}}|
{{#if:{{{icon|}}}|[[File:{{{icon}}}|{{{icon_size|18px}}}|link={{{icon_link}}}]]|{{#invoke:Abilities/card|get_attr_icon|{{{type|}}}}}}}|
{{#if:{{{icon|}}}|[[File:{{{icon}}}|{{{icon_size|18px}}}|link={{{icon_link}}}]]|{{#invoke:Abilities/icon|getAttrIconFile|{{{type|}}}}}}}|
{{ValueAndUom|'''{{{value}}}'''|{{Lang|key={{{key}}}_postfix}}|uom_style=font-size: calc(1em - 2px); color: #B2B2B2}}
{{#ifeq:{{#var:value_prefix}}|-|{{#var:value_prefix}}}}{{ValueAndUom|'''{{{value}}}'''|id={{{key}}}|class=ability-attr|{{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 class="ac-mainbox-label">{{#if:{{{label|}}}|{{{label}}}|{{Lang|key={{{key}}}_label}}}}</div>
</div></div>
</div></div>
</includeonly><noinclude>
</includeonly><noinclude>
{{#invoke:Abilities/card|get_ability_card|Ivy|2|false}}
{{Documentation}}
{{Documentation}}
</noinclude>
</noinclude>