<!---------------------------------------------------------------------------------------------------------
04 | POKEMON SUMMARY by trunswicked
> Edit with WYSIWYG *OFF* and Code Editor *ON* in your display settings
> Please do not remove credit!
> Feel free to PM me or comment with any questions or concerns! Thank you :D
/////////// EDIT EVERYTHING in brackets [[[[ ]]]]]] (delete brackets afterwards)!
------------------------------------------------------------------------------------------------------------>
<div class="container-fluid p-0 mx-auto" style="max-width:400px">
<!---------------------------------------------------------------------------------------------------------------------------
BACKGROUND / to change colors, edit #'s in linear-gradient
----------------------------------------------------------------------------------------------------------------------------->
<div class="rounded" style="border-left: 2px solid #1C2D56;background:linear-gradient(#FFF, #9EE1FF);">
<div class="row no-gutters">
<div class="col-7">
<div class="mt-1 mb-3 text-white" style="border-radius: 0px 5px 5px 0px;background-color:#465F90;">
<div class="d-flex justify-content-between">
<!---------------------------------------------------------------------------------------------------------------------------
NAME, BALL, GENDER, AND LEVEL / pokeball images at serebii: https://www.serebii.net/itemdex/list/pokeball.shtml
/ male is "fas fa-mars" + #009AFB, and female is "fas-fa-venus" + #FF5AC1
----------------------------------------------------------------------------------------------------------------------------->
<span><img src="https://www.serebii.net/itemdex/sprites/ultraball.png" style="width:23px;">[[[[[[[POKEMON NAME]]]]]]</span>
<span class="mr-4"><i class="fas fa-mars" style="color:#009AFB;"></i> Lv. [[[[[[[LEVEL]]]]]]</span>
</div>
</div>
<div class="text-white my-1 mr-4" style="border-radius: 0px 5px 5px 0px;background-color:#234589;">
<div class="row no-gutters">
<div class="col">
<!---------------------------------------------------------------------------------------------------------------------------
NUMBER, NAME, TYPE, AND TRAINER
----------------------------------------------------------------------------------------------------------------------------->
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">Pokedex no.</span>
<span class="mr-1 w-50 text-right">[[[[[[[POKEMON NUMBER]]]]]]</span>
</div>
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">Name</span>
<span class="mr-1 w-50 text-right">[[[[[[[POKEMON SPECIES]]]]]]</span>
</div>
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">Type</span>
<!---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
TYPE / delete an entire <a> tag if you only need one type
//////////// see the color guide: https://toyhou.se/2861766.04-pok-mon-summary/4156573.color-guide
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
<span class="mr-1 w-50 text-right">
<span class="rounded text-white px-1" style="font-size:12px;background:linear-gradient(#5854DD, #1b1784);">[[[[[[[TYPE 1]]]]]]</span> <span class="rounded text-white px-3" style="font-size:12px;background:linear-gradient(#85BFC8, #3b7f89);">[[[[[[[TYPE 2]]]]]]</span>
</span>
</div>
<div class="d-flex justify-content-between">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">OT</span>
<span class="mr-1 w-50 text-right">[[[[[[[TRAINER]]]]]]</span>
</div>
</div>
</div>
</div>
<div class="text-white my-1 mr-4" style="border-radius: 0px 5px 5px 0px;background-color:#80B2FB;">
<div class="row no-gutters">
<div class="col w-50">
<!---------------------------------------------------------------------------------------------------------------------------
STATS (column 1)
----------------------------------------------------------------------------------------------------------------------------->
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="pr-2" style="color:#c0dbf7;background-color:#5775B1;">HP</span>
<span class="px-1 text-right">[[[[[[[HP]]]]]]</span>
</div>
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="pr-2" style="color:#c0dbf7;background-color:#5775B1;">Attack</span>
<span class="px-1 text-right">[[[[[[[ATK]]]]]]</span>
</div>
<div class="d-flex justify-content-between">
<span class="pr-2" style="color:#c0dbf7;background-color:#5775B1;">Defense</span>
<span class="px-1 text-right">[[[[[[[DEF]]]]]]</span>
</div>
</div>
<!---------------------------------------------------------------------------------------------------------------------------
STATS (column 2)
----------------------------------------------------------------------------------------------------------------------------->
<div class="col w-50 ml-1">
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="pl-1 pr-2" style="color:#c0dbf7;background-color:#5775B1;">Sp.Atk</span>
<span class="px-1 text-right">[[[[[[[SPECIAL ATK]]]]]]</span>
</div>
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="pl-1 pr-2" style="color:#c0dbf7;background-color:#5775B1;">Sp.Def</span>
<span class="px-1 text-right">[[[[[[[SPECIAL DEF]]]]]]</span>
</div>
<div class="d-flex justify-content-between">
<span class="pl-1 pr-2" style="color:#c0dbf7;background-color:#5775B1;">Speed</span>
<span class="px-1 text-right">[[[[[[[SPEED]]]]]]</span>
</div>
</div>
</div>
</div>
<div class="text-white my-1 mr-4" style="border-radius: 0px 5px 5px 0px;background-color:#234589;">
<div class="row no-gutters">
<div class="col">
<!---------------------------------------------------------------------------------------------------------------------------
NATURE, ABILITY, AND ITEM
----------------------------------------------------------------------------------------------------------------------------->
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">Nature</span>
<span class="mr-1 w-50 text-right">[[[[[[[NATURE]]]]]]</span>
</div>
<div class="d-flex justify-content-between" style="border-bottom:1px solid black;">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">Ability</span>
<span class="mr-1 w-50 text-right">[[[[[[[ABILITY]]]]]]</span>
</div>
<div class="d-flex justify-content-between">
<span class="m-0 w-50" style="color:#7CA0EA;background-color:#1C2D56;">Held Item</span>
<span class="mr-1 w-50 text-right">[[[[[[[ITEM]]]]]]</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-5">
<div class="row">
<!-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
IMAGE
////// IMPORTANT: you may need to adjust the '''''my-1'''''' property, depending on the size of the image (this adds space '''above''' and '''below''' the picture).
/// Find animated pokemon sprites here!: https://pokemon.fandom.com/wiki/List_of_Pok%C3%A9mon
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
<img src="POKEMON SPRITE URL GOES HERE" class="mx-auto my-1 d-block">
</div>
<!---------------------------------------------------------------------------------------------------------------------------
SYMBOLS
----------------------------------------------------------------------------------------------------------------------------->
<div class="text-right mr-1" style="font-size:8px;color:#bababa;"><i class="fas fa-plus"></i> <i class="fas fa-circle"></i> <i class="fas fa-square"></i> <i class="fas fa-heart"></i> <i class="fas fa-star"></i></div>
<div class="text-white pl-1 pb-1" style="border-radius: 5px 0px 0px 5px;background-color:#465F90;">
<span class="pb-1">Moves Learned</span>
<!------------------------------------------------------------------------------------------------------------------------------------------------------------
MOVESET ////////////// See the type color guide: https://toyhou.se/2861766.04-pok-mon-summary/4156573.color-guide
-------------------------------------------------------------------------------------------------------------------------------------------------------------->
<div class="text-white text-right ml-1" style="background: linear-gradient(#85BFC8, #3b7f89);border-radius: 50px 0px 0px 50px;">
<span class="pr-1">[[[[[[[MOVE 1]]]]]]</span>
</div>
<div class="text-white text-right ml-1" style="background: linear-gradient(#AABB22, #727f0e);border-radius: 50px 0px 0px 50px;">
<span class="pr-1">[[[[[[[MOVE 2]]]]]]</span>
</div>
<div class="text-white text-right ml-1" style="background: linear-gradient(#5854DD, #1b1784);border-radius: 50px 0px 0px 50px;">
<span class="pr-1">[[[[[[[MOVE 3]]]]]]</span>
</div>
<div class="text-white text-right ml-1" style="background: linear-gradient(#FD60AA, #a31f5d);border-radius: 50px 0px 0px 50px;">
<span class="pr-1">[[[[[[[MOVE 4]]]]]]</span>
</div>
</div>
</div>
</div>
</div>
<!---------------------------------------------------------------------------------------------------------------------------
CREDIT (Do not remove)
----------------------------------------------------------------------------------------------------------------------------->
<p class="text-right text-muted" style="font-size:11px;">code by trunswicked</p>
</div>
