From Brotato Wiki

m (Darkly77 moved page Template:ItemboxTabbedWeapon to Template:StatsCardWeaponTabs: Use the new template names (they were renamed from "Infobox" to "StatsCard"))
(Initial using new JS approach. Needs line breaks, TempateData, and logic to handle disabled tiers)
Line 1: Line 1:
<div id="mytabs" data-test="ok1">
<div class="cardtabs" data-cardtabs>
<!-- Radio Buttons (invisible) -->
<div class="mytabs__panels" data-cardtabs-panels>
<input class="mytabs__radio" name="tabby-a" id="mytabby-a-1" type="radio" checked>
 
<input class="mytabs__radio" name="tabby-a" id="mytabby-a-2" type="radio">
<div data-cardtabs-panel="1" class="cardtabs__panel">
<input class="mytabs__radio" name="tabby-a" id="mytabby-a-3" type="radio">
{{StatsCardWeapon
<input class="mytabs__radio" name="tabby-a" id="mytabby-a-4" type="radio">
| name      = Isaac's Tears
<!-- Panels (Content) -->
| class     = Tears
<div class="mytabs__panels">
| image    = Mod-Isaac-isaacs_tears_icon.png
<!-- Panel 1 -->
| rarity    = 1
<!-- Circular Saw: Tier 1 -->
| damage    = 7 ({{StatIcon|Ranged Damage}})
<!-- <input class="mytabs__radio" name="mytab" id="mytab-1" type="radio" checked> -->
| critical  = x2 (3% chance)
<div class="mytabs__panel">
| cooldown  = 0.7s
<div class="ibox rarity1 rarity1dark rounded">
| knockback = 2
<div class="ibox__top">
| range    = 350 (Melee)
<div class="ibox__icon rounded">
| lifesteal =
[[File:Circular_Saw.png|60x60px]]
| bounce    =
</div>
| pierce    =
<div class="ibox__top-right">
| special1  =
<div class="ibox__name colorrarity1">Circular Saw</div>
| special2  =
<div class="ibox__class color-cream">Medical</div>
| special3  =
</div>
}}
</div>
<div class="ibox__stats">
<ul>
<li> <span class="color-cream">Damage:</span> 14 (50%{{StatIcon|Melee Damage}}) </li>
<li> <span class="color-cream">Critical:</span> x2 (10% chance) </li>
<li> <span class="color-cream">Cooldown:</span> 0.5s </li>
<li> <span class="color-cream">Knockback:</span> 10 </li>
<li> <span class="color-cream">Range:</span> 350 (Melee) </li>
<li> <span class="color-cream">Piercing:</span> 2 (-<span class="color-green">20%</span> damage) </li>
<li> <span class="color-cream">Life Steal:</span> <span class="color-green">5%</span> </li>
</ul>
</div>
</div><!-- enditem -->
</div>
</div>


<!-- Panel 2 -->
<div data-cardtabs-panel="2" class="cardtabs__panel cardtabs__panel--js-hidden">
<!-- Circular Saw: Tier 2 -->
{{StatsCardWeapon
<!-- <input class="mytabs__radio" name="mytab" id="mytab-2" type="radio"> -->
| name      = Isaac's Tears
<div class="mytabs__panel">
| class     = Tears
<div class="ibox rarity2 rarity2dark rounded">
| image    = Mod-Isaac-isaacs_tears_icon.png
<div class="ibox__top">
| rarity    = 2
<div class="ibox__icon rounded">
| damage    = 14 ({{StatIcon|Ranged Damage}})
[[File:Circular_Saw.png|60x60px]]
| critical  = x2 (3% chance)
</div>
| cooldown  = 0.62s
<div class="ibox__top-right">
| knockback = 2
<div class="ibox__name colorrarity2">Circular Saw</div>
| range    = 350 (Melee)
<div class="ibox__class color-cream">Medical</div>
| lifesteal =
</div>
| bounce    =
</div>
| pierce    =
<div class="ibox__stats">
| special1  =
<ul>
| special2  =
<li> <span class="color-cream">Damage:</span> 14 (50%{{StatIcon|Melee Damage}}) </li>
| special3  =
<li> <span class="color-cream">Critical:</span> x2 (10% chance) </li>
}}
<li> <span class="color-cream">Cooldown:</span> 0.5s </li>
<li> <span class="color-cream">Knockback:</span> 10 </li>
<li> <span class="color-cream">Range:</span> 350 (Melee) </li>
<li> <span class="color-cream">Piercing:</span> 2 (-<span class="color-green">20%</span> damage) </li>
<li> <span class="color-cream">Life Steal:</span> <span class="color-green">5%</span> </li>
</ul>
</div>
</div><!-- enditem -->
</div>
</div>


<!-- Panel 3 -->
<div data-cardtabs-panel="3" class="cardtabs__panel cardtabs__panel--js-hidden">
<!-- Circular Saw: Tier 3 -->
{{StatsCardWeapon
<!-- <input class="mytabs__radio" name="mytab" id="mytab-3" type="radio"> -->
| name      = Isaac's Tears
<div class="mytabs__panel">
| class     = Tears
<div class="ibox rarity3 rarity3dark rounded">
| image    = Mod-Isaac-isaacs_tears_icon_bloody.png
<div class="ibox__top">
| rarity    = 3
<div class="ibox__icon rounded">
| damage    = 28 ({{StatIcon|Ranged Damage}})
[[File:Circular_Saw.png|60x60px]]
| critical  = x2 (3% chance)
</div>
| cooldown  = 0.53s
<div class="ibox__top-right">
| knockback = 2
<div class="ibox__name colorrarity2">Circular Saw</div>
| range    = 350 (Melee)
<div class="ibox__class color-cream">Medical</div>
| lifesteal =
</div>
| bounce    =
</div>
| pierce    =
<div class="ibox__stats">
| special1  =
<ul>
| special2  =
<li> <span class="color-cream">Damage:</span> 14 (50%{{StatIcon|Melee Damage}}) </li>
| special3  =
<li> <span class="color-cream">Critical:</span> x2 (10% chance) </li>
}}
<li> <span class="color-cream">Cooldown:</span> 0.5s </li>
<li> <span class="color-cream">Knockback:</span> 10 </li>
<li> <span class="color-cream">Range:</span> 350 (Melee) </li>
<li> <span class="color-cream">Piercing:</span> 2 (-<span class="color-green">20%</span> damage) </li>
<li> <span class="color-cream">Life Steal:</span> <span class="color-green">5%</span> </li>
</ul>
</div>
</div><!-- enditem -->
</div>
</div>


<!-- Panel 4 -->
<div data-cardtabs-panel="4" class="cardtabs__panel cardtabs__panel--js-hidden">
<!-- Circular Saw: Tier 4 -->
{{StatsCardWeapon
<!-- <input class="mytabs__radio" name="mytab" id="mytab-4" type="radio"> -->
| name      = Isaac's Tears
<div class="mytabs__panel">
| class     = Tears
<div class="ibox rarity4 rarity4dark rounded">
| image    = Mod-Isaac-isaacs_tears_icon_bloody.png
<div class="ibox__top">
| rarity    = 4
<div class="ibox__icon rounded">
| damage    = 45 ({{StatIcon|Ranged Damage}})
[[File:Circular_Saw.png|60x60px]]
| critical  = x2 (3% chance)
</div>
| cooldown  = 0.45s
<div class="ibox__top-right">
| knockback = 2
<div class="ibox__name colorrarity2">Circular Saw</div>
| range    = 350 (Melee)
<div class="ibox__class color-cream">Medical</div>
| lifesteal =
</div>
| bounce    =
</div>
| pierce    =
<div class="ibox__stats">
| special1  =
<ul>
| special2  =
<li> <span class="color-cream">Damage:</span> 14 (50%{{StatIcon|Melee Damage}}) </li>
| special3  =
<li> <span class="color-cream">Critical:</span> x2 (10% chance) </li>
}}
<li> <span class="color-cream">Cooldown:</span> 0.5s </li>
<li> <span class="color-cream">Knockback:</span> 10 </li>
<li> <span class="color-cream">Range:</span> 350 (Melee) </li>
<li> <span class="color-cream">Piercing:</span> 2 (-<span class="color-green">20%</span> damage) </li>
<li> <span class="color-cream">Life Steal:</span> <span class="color-green">5%</span> </li>
</ul>
</div>
</div><!-- enditem -->
</div>
</div>
</div>
</div>
<!-- Buttons (Tabs) -->
 
<div class="mytabs__buttons">
<div class="cardtabs__buttons" data-cardtabs-btns>
<label class="mytabs__button rarity1 rarity1dark" for="mytabby-a-1">Tier I</label>
<div data-cardtabs-btn="1" class="cardtabs__button rarity1 rarity1dark cardtabs__button--active">Tier I</div>
<label class="mytabs__button rarity2 rarity2dark" for="mytabby-a-2">Tier II</label>
<div data-cardtabs-btn="2" class="cardtabs__button rarity2 rarity2dark">Tier II</div>
<label class="mytabs__button rarity3 rarity3dark" for="mytabby-a-3">Tier III</label>
<div data-cardtabs-btn="3" class="cardtabs__button rarity3 rarity3dark">Tier III</div>
<label class="mytabs__button rarity4 rarity4dark" for="mytabby-a-4">Tier IV</label>
<div data-cardtabs-btn="4" class="cardtabs__button rarity4 rarity4dark">Tier IV</div>
</div>
</div>
</div>
</div>

Revision as of 03:19, 6 December 2022

Mod-Isaac-isaacs tears icon.png

Isaac's Tears
Tears
  • Damage: 7 (Ranged Damage.png)
  • Critical: x2 (3% chance)
  • Cooldown: 0.7s
  • Knockback: 2
  • Range: 350 (Melee)

Mod-Isaac-isaacs tears icon.png

Isaac's Tears
Tears
  • Damage: 14 (Ranged Damage.png)
  • Critical: x2 (3% chance)
  • Cooldown: 0.62s
  • Knockback: 2
  • Range: 350 (Melee)

Mod-Isaac-isaacs tears icon bloody.png

Isaac's Tears
Tears
  • Damage: 28 (Ranged Damage.png)
  • Critical: x2 (3% chance)
  • Cooldown: 0.53s
  • Knockback: 2
  • Range: 350 (Melee)

Mod-Isaac-isaacs tears icon bloody.png

Isaac's Tears
Tears
  • Damage: 45 (Ranged Damage.png)
  • Critical: x2 (3% chance)
  • Cooldown: 0.45s
  • Knockback: 2
  • Range: 350 (Melee)
Tier I
Tier II
Tier III
Tier IV