User:Samlovesmath/Sandbox: Difference between revisions

Samlovesmath (talk | contribs)
m minor fixes (ex. background image sizing)
Samlovesmath (talk | contribs)
m fixed background gradient issues, added "gradient offset"
Line 25: Line 25:
<span style="font-size:small; opacity:50%">'''''WIP -- Last edited: Mar 28, 2026'''''</span>
<span style="font-size:small; opacity:50%">'''''WIP -- Last edited: Mar 28, 2026'''''</span>
<!--
<!--
-->{{#vardefine:key|hero_mirage}}<!-- hero keyname
-->{{#vardefine:key|hero_werewolf}}<!-- hero keyname


-->{{#vardefine:color1| \#552E68 }} <!--
-->{{#vardefine:color1| \#B53913 }} <!--
-->{{#vardefine:color1_grad| \#452953 }} <!--
-->{{#vardefine:color1_grad| \#99391A }} <!--
-->{{#vardefine:color2| \#CEA05A }} <!--
-->{{#vardefine:color2| \#E2B576 }} <!--
-->{{#vardefine:grad_offset| 100px }} <!--


-->{{#vardefine:text_title| \#FFE1BC }} <!--
-->{{#vardefine:text_title| \#FFDDC9 }} <!--
-->{{#vardefine:stats_text| \#EFD8FF }} <!--
-->{{#vardefine:stats_text| \#EAD9C5 }} <!--
-->{{#vardefine:stats_back| \#201228A3 }} <!--
-->{{#vardefine:stats_back| \#2D1711A3 }} <!--


-->{{#vardefine:background_height| 700px }} <!--
-->{{#vardefine:background_height| 325px }} <!--
-->{{#vardefine:background_margin| -118px }} <!--
-->{{#vardefine:background_margin| -118px }} <!--


-->{{#vardefine:logo_height| x49px }} <!--
-->{{#vardefine:logo_height| x55px }} <!--
-->{{#vardefine:logo_bleed| -2px 0px -2px 0px }} <!--
-->{{#vardefine:logo_bleed| -2px 0px -8px 6px }} <!--
-->{{#vardefine:logo_bottom| 2px }} <!--
-->{{#vardefine:logo_bottom| 0px }} <!--
 
-->{{#vardefine:grad_height| calc({{#var:grad_offset}} + {{#var:background_height}})  }} <!--




Line 69: Line 72:
<div class="infobox-background">[[File:{{#invoke:Samlovesmath/Sandbox|get_value|{{#var:key}}|background_image}}|x{{#var:background_height}}|right]]</div>
<div class="infobox-background">[[File:{{#invoke:Samlovesmath/Sandbox|get_value|{{#var:key}}|background_image}}|x{{#var:background_height}}|right]]</div>


{| class="infobox-content" style="background-image: linear-gradient(180deg, {{#var:color1}}b3 300px, {{#var:color1_grad}} {{#var:background_height}}); background-color: transparent;"
{| class="infobox-content" style="background-image: linear-gradient(180deg, {{#var:color1}}b3 calc({{#var:grad_height}} * calc(3/7)), {{#var:color1_grad}} {{#var:grad_height}}); background-color: transparent;"
! colspan="2" class="infobox-title" style="font-size: {{{font-size|25px}}};" |
! colspan="2" class="infobox-title" style="font-size: {{{font-size|25px}}};" |