| Latest revision |
Your text |
| Line 1: |
Line 1: |
| <includeonly><templatestyles src="Ability card v2/Card/styles.css" />{{anchor|{{{name}}}}}<div id="{{{id|}}}" class="ability-card"> | | <includeonly>{{anchor|{{{name}}}}}<div style="font-size: 15px; line-height: 1.4; font-family: 'PT Serif', 'Palatino', 'Georgia'; color: #FFEFD7; display:flex; flex-direction:column; background: rgb(52,52,52); |
| | background: linear-gradient(90deg, rgba(52,52,52,1) 0%, rgba(66,66,66,1) 14%, rgba(77,77,77,1) 100%); align-items: center; max-width: 700px"> |
|
| |
|
| <!-- HEADER --> | | <!-- HEADER --> |
| <div class="ac-header-wrapper"> | | <div style="display:flex; flex-direction:row; justify-content: space-between; width: 100%; background: #121212; font-size: calc(1em - 2px);"> |
| <div class="ac-header"> | | <div style="display:flex; flex-direction:column; padding: 20px 0 20px 20px"> |
| <div class="ac-header-left"> | | <div style="font-size: 1.8rem">{{#if:{{{name_link|}}}|[[{{{name_link}}}|{{{name}}}]]|{{{name}}}}}</div> |
| <div class="ac-title">
| | <div style="display:flex; flex-direction:row; margin-left: 10px;"> |
| <span class="ac-icon">[[File:{{{icon}}}|45px|link=]]</span><span class="ac-name">{{#if:{{{name_link|}}}|[[{{{name_link}}}|{{{name}}}]]|{{{name}}}}}</span>
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{range|}}}|uom=m|icon=CastRange.png}} |
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{radius|}}}|uom=m|icon=AttributeIconTechRange.png}} |
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{ability_width|}}}|uom=m|icon=AttributeIconTechRange.png}} |
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{duration|}}}|uom=s|icon=AttributeIconMaxChargesIncrease.png}} |
| | </div> |
| </div> | | </div> |
| <div class="ac-header-attrs">
| | <div style="display:flex; flex-direction:column; align-items: end; padding: 20px 0 20px 0"> |
| {{Ability_card_v2/Card/HeaderAttr|{{{channel_time|}}}|id=AbilityChannelTime|uom=s|scale={{{channel_time_scale|}}}|scale_type={{{channel_time_scale_type|}}}|icon=[[File:AttributeIconMaxChargesIncrease.png|Channel Time|20px|link=]]}}
| | <div style="display:flex; flex-direction:row; justify-content: flex-end; margin-bottom: 5px; margin-right: 20px;"> |
| {{Ability_card_v2/Card/HeaderAttr|{{{range|}}}|id=AbilityCastRange|scale={{{range_scale|}}}|scale_type={{{range_scale_type|}}}|uom=m|icon=[[File:CastRange.png|Cast Range|20px|link=]]}}
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{num_of_charges|}}}|icon=AttributeIconMaxChargesIncrease.png|style=margin-right: 0;}} |
| {{Ability_card_v2/Card/HeaderAttr|{{{radius|}}}|id=Radius|scale={{{radius_scale|}}}|scale_type={{{radius_scale_type|}}}|uom=m|icon=[[File:AttributeIconTechRange.png|Radius|20px|link=]]}}
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{charge_cooldown|}}}|uom=s|icon=AttributeIconTechCooldownBetweenChargeUses.png|style=font-size: 12px; background-color: #242424; margin-right: 0;|icon_size=15px}} |
| {{Ability_card_v2/Card/HeaderAttr|{{{ability_width|}}}|id=ability_width|uom=m|icon=[[File:AttributeIconTechRange.png|Width|20px|link=]]}}
| |
| {{Ability_card_v2/Card/HeaderAttr|{{{duration|}}}|id=AbilityDuration|uom=s|scale={{{duration_scale|}}}|scale_type={{{duration_scale_type|}}}|icon=[[File:AttributeIconTechDuration.png|Duration|20px|link=]]}}
| |
| </div>
| |
| </div> | |
| <div class="ac-header-right">
| |
| <div class="ac-charge-row"> | |
| {{Ability_card_v2/Card/HeaderAttr|{{{num_of_charges|}}}|id=AbilityCharges|icon=[[File:AttributeIconMaxChargesIncrease.png|Number of Charges|20px|link=]]|style=margin-right: 0;|hide={{#ifeq: {{{num_of_charges|}}} | 0 | true }}}}
| |
| {{Ability_card_v2/Card/HeaderAttr|{{{charge_cooldown|}}}|id=AbilityCooldownBetweenCharge|scale={{{charge_cooldown_scale|}}}|scale_type={{{charge_cooldown_scale_type|}}}|uom=s|icon=[[File:AttributeIconTechCooldownBetweenChargeUses.png|Charge Cooldown|16px|link=]]|style=margin-left: 1px; margin-right: 0}}
| |
| </div>
| |
| {{Ability_card_v2/Card/HeaderAttr|{{{cooldown|}}}|id=AbilityCooldown|scale={{{cooldown_scale|}}}|scale_type={{{cooldown_scale_type|}}}|uom=s|icon=[[File:AttributeIconTechCooldown.png|Cooldown|20px|link=]]}}
| |
| </div> | | </div> |
| | {{User:Saag/Sandbox/AbilityCard/HeaderAttr|{{{cooldown|}}}|uom=s|icon=AttributeIconTechCooldown.png}} |
| </div> | | </div> |
| </div> | | </div> |
| | | |
| <!-- INFO SECTIONS --> | | <!-- INFO SECTIONS --> |
| <div class="ac-info-outer">
| | <div style="display:flex; flex-direction:column; align-items: center; margin: 5px 10px 20px 10px; width: calc(100% - 18px);"> |
| <!-- Info Section #1 -->
| | <div style="padding: 20px 10px 20px 10px">{{{description}}}</div> |
| <div id="ability-info1" class="ability-info ac-info-section {{#ifeq:{{{hide_info1|}}}|true|hide}}"> | | <div style="display:flex; flex-direction:row; flex-wrap: wrap; justify-content: center; width: calc(97% - 5px); min-width: 310px;"> |
| <div class="ac-info-desc">{{{info1_desc|}}}</div> | | {{#invoke: AbilityData|get_info_main|{{{hero_name}}}|{{{ability_num}}}|1}} |
| <!-- Main Info --> | |
| <div class="ac-info-main">
| |
| {{{info1_mainbox1|}}}{{{info1_mainbox2|}}}{{{info1_mainbox3|}}}{{{info1_mainbox4|}}}{{{info1_mainbox5|}}} | |
| </div> | | </div> |
| | | <div style="display:flex; flex-direction:row; flex-wrap: wrap; justify-content: center; background-color: #2A2A2A; width: calc(97% - 11px); min-width: 310px;"> |
| <!-- Alt Info --> | | {{#invoke: AbilityData|get_info_alt|{{{hero_name}}}|{{{ability_num}}}|1}} |
| <div class="ac-info-alt">
| |
| {{{info1_altbox1|}}}{{{info1_altbox2|}}}{{{info1_altbox3|}}}{{{info1_altbox4|}}}{{{info1_altbox5|}}}{{{info1_altbox6|}}}{{{info1_altbox7|}}}
| |
| </div> | | </div> |
| </div> | | </div> |
| | | |
| <!-- Info Section #2 -->
| |
| <div id="ability-info2" class="ability-info ac-info-section ac-info-section--padded {{#ifeq:{{{hide_info2|}}}|true|hide}}">
| |
| <div class="ac-info-desc">{{{info2_desc|}}}</div>
| |
| <!-- Main Info -->
| |
| <div class="ac-info-main">
| |
| {{{info2_mainbox1|}}}{{{info2_mainbox2|}}}{{{info2_mainbox3|}}}{{{info2_mainbox4|}}}{{{info2_mainbox5|}}}
| |
| </div>
| |
|
| |
| <!-- Alt Info -->
| |
| <div class="ac-info-alt">
| |
| {{{info2_altbox1|}}}{{{info2_altbox2|}}}{{{info2_altbox3|}}}{{{info2_altbox4|}}}{{{info2_altbox5|}}}{{{info2_altbox6|}}}{{{info2_altbox7|}}}
| |
| </div>
| |
| </div>
| |
|
| |
| <!-- Info Section #3 -->
| |
| <div id="ability-info3" class="ability-info ac-info-section ac-info-section--padded {{#ifeq:{{{hide_info3|}}}|true|hide}}">
| |
| <div class="ac-info-desc">{{{info3_desc|}}}</div>
| |
| <!-- Main Info -->
| |
| <div class="ac-info-main">
| |
| {{{info3_mainbox1|}}}{{{info3_mainbox2|}}}{{{info3_mainbox3|}}}{{{info3_mainbox4|}}}{{{info3_mainbox5|}}}
| |
| </div>
| |
|
| |
| <!-- Alt Info -->
| |
| <div class="ac-info-alt">
| |
| {{{info3_altbox1|}}}{{{info3_altbox2|}}}{{{info3_altbox3|}}}{{{info3_altbox4|}}}{{{info3_altbox5|}}}{{{info3_altbox6|}}}{{{info3_altbox7|}}}
| |
| </div>
| |
| </div>
| |
| </div>
| |
|
| |
| <!-- UPGRADES --> | | <!-- UPGRADES --> |
| <div class="ac-upgrades"> | | <div style="display:flex; flex-direction:row; flex-wrap: wrap; margin-bottom: 10px; justify-content: center; width: calc(97% - 16px); min-width: 310px;> |
| {{{upgrade1}}}{{{upgrade2}}}{{{upgrade3}}} | | {{#invoke: AbilityData|get_upgrades|{{{hero_name}}}|{{{ability_num}}}}} |
| </div> | | </div> |
| | | |
| <!-- NOTES --> | | <!-- NOTES --> |
| {{#if: {{{notes|}}}| | | {{#if: {{{notes|}}}| |
| <div class="ac-notes-wrapper"> | | <div style="align-self: flex-start; margin: 10px 0 10px 20px"> |
| <div><span class="ac-notes-title"> {{#if: {{{name_link|}}}| | | <div style="font-size:1.5rem;"> Notes </div> |
| {{#vardefine:notes_localized|{{#invoke:Dictionary|translate|Notes|show_needs_translation=false}}}}
| |
| [[{{{name_link}}}/{{#var:notes_localized}}|{{#var:notes_localized}}]]
| |
| |
| |
| {{#invoke:Dictionary|translate|Notes}}
| |
| }}</span>
| |
| {{#if:{{{notes_source_page|}}}
| |
| | <span class="ac-notes-edit">[[{{{notes_source_page}}}|{{#invoke:Dictionary|translate|edit}}]]</span>}}</div>
| |
| </div>
| |
| <div class="mw-collapsible mw-collapsed ac-notes-body">
| |
| <div> | | <div> |
| {{{notes}}} | | {{{notes}}} |
| </div> | | </div> |
| </div>}}</div></includeonly><noinclude> | | </div>}} |
| {{#invoke:Abilities/card|get_ability_card|{{{hero_name|Abrams}}}|{{{ability_num|4}}}|{{{link_name|false}}}|{{{notes|}}}}}
| |
| {{Documentation}}
| |
|
| |
|
| | </div></includeonly><noinclude> |
| | {{#invoke:AbilityData|get_ability_card|Abrams|4|true}} |
| </noinclude> | | </noinclude> |