Editing Template:ItemBoxGive feedback

<templatestyles src="Template:ItemBox/styles.css" /><includeonly>

{{#vardefine:itemName|{{{itemName|{{{1}}}}}}}}<!--

     Display name: Lang string for the codename, else the raw name, then override.
-->{{#vardefine:displayName|{{#invoke:Lang|get_string|{{#invoke:ItemData|get_codename|{{#var:itemName}}}}}}}}<!--
-->{{#vardefine:displayName|{{#if:{{#var:displayName}}|{{#var:displayName}}|{{#var:itemName}}}}}}<!--
-->{{#vardefine:displayName|{{{overrideDisplayName|{{#var:displayName}}}}}}}<!--

     Measured name size (em) and stable per-item texture variety.
-->{{#vardefine:fontSize|{{#invoke:ItemBox|getFontSize|{{#var:displayName}}}}}}<!--
-->{{#vardefine:variants|{{#invoke:ItemBox|variants|{{#var:itemName}}}}}}<!--

     Modifier classes: slot (Weapon/Armor/Tech from data, or Weapon/Vitality/Spirit override -> weapon/vitality/spirit), tier, tags.
-->{{#vardefine:slot|{{#switch:{{{overrideSlot|{{#invoke:ItemData|get_prop|{{#var:itemName}}|Slot}}}}}|Weapon=itembox-weapon|Armor|Vitality=itembox-vitality|Tech|Spirit=itembox-spirit}}}}<!--
-->{{#vardefine:tier|itembox-tier-{{{overrideTier|{{#invoke:ItemData|get_prop|{{#var:itemName}}|Tier}}}}}}}<!--
-->{{#vardefine:showTierTag|{{#ifeq:{{{showTierTag|}}}|true|itembox-show-tier}}}}<!--
-->{{#vardefine:isActive|{{{overrideIsActive|{{#invoke:ItemData|is_active|{{#var:itemName}}}}}}}}}<!--
-->{{#vardefine:isActive|{{#ifeq:{{#var:isActive}}|true|itembox-active}}}}<!--
-->{{#vardefine:isImbue|{{{overrideIsImbue|{{#invoke:ItemData|get_prop|{{#var:itemName}}|IsImbue}}}}}}}<!--
-->{{#vardefine:isImbue|{{#ifeq:{{#var:isImbue}}|true|itembox-imbue}}}}<!--

     Optional simplifications for callers that render many cards at once. Each
     masked layer costs the GPU an extra render pass per card and the texture
     costs a backdrop read, so dropping them buys frames at the cost of detail.
     wearMask=no keeps the tier tint on the card stock but loses the worn edge;
     wearMask=ramp instead fades the tint in from the card's edges.
-->{{#vardefine:lite|{{#switch:{{{wearMask|}}}|no=itembox-flat-wear|ramp=itembox-ramp-wear}} {{#ifeq:{{{iconMask|}}}|no|itembox-flat-icon}} {{#ifeq:{{{texture|}}}|no|itembox-no-texture}}}}<!--

     Links.
-->{{#vardefine:linkTooltip|{{{overrideLinkTooltip|{{#var:itemName}}}}}}}<!--
-->{{#vardefine:linkImage|{{{overrideLinkImage|{{#var:itemName}}}}}}}<!--
-->{{#vardefine:linkClick|{{{overrideLinkClick|{{#var:itemName}}{{If lang}}}}}}}<!--

--><div class="itembox {{#var:showTierTag}} {{#var:tier}} {{#var:slot}} {{#var:isActive}} {{#var:isImbue}} {{#var:variants}} {{#var:lite}}" style="font-size:{{#expr: 10 * {{#if:{{{size|}}}|{{{size}}}|1}} }}px;">
	<div class="itembox-background">
		<div class="itembox-card">
			<div class="itembox-icon-area">
				<div class="itembox-icon">[[File:{{#var:linkImage}}.png|160px|link=]]</div>
				<div class="itembox-tier-badge">
					<div class="itembox-tier-badge-shadow"></div>
					<div class="itembox-tier-badge-fill"></div>
					<div class="itembox-tier-badge-number"></div>
				</div>
				<div class="itembox-imbue-tag">{{#invoke:Lang|get_string|item_info_imbue}}</div>
			</div>
			<div class="itembox-name-area">
				<p class="itembox-name" style="font-size:{{#var:fontSize}}em;text-wrap:balance;">{{#var:displayName}}</p>
			</div>
			<div class="itembox-wear"></div>
			<div class="itembox-texture"></div>
			<div class="itembox-bevel"></div>
			<div class="itembox-active-tag">{{#invoke:Lang|get_string|item_info_active}}</div>
			<div class="itembox-outline"></div>
		</div>
	</div>
	<div class="item-link-wrapper" data-item-name="{{#var:linkTooltip}}">[[{{#var:linkClick}}|<span></span>]]</div>
</div></includeonly><noinclude>{{Documentation}}</noinclude>
@@ Line 8: / Line 8: @@
 -->{{#vardefine:displayName|{{{overrideDisplayName|{{#var:displayName}}}}}}}<!--
-      Measured name size (cqw) and stable per-item texture variety.
+      Measured name size (em) and stable per-item texture variety.
 -->{{#vardefine:fontSize|{{#invoke:ItemBox|getFontSize|{{#var:displayName}}}}}}<!--
 -->{{#vardefine:variants|{{#invoke:ItemBox|variants|{{#var:itemName}}}}}}<!--
@@ Line 21: / Line 21: @@
 -->{{#vardefine:isImbue|{{#ifeq:{{#var:isImbue}}|true|itembox-imbue}}}}<!--
-      lowGraphics=true is for callers that place dozens of cards on one page (the
+      Optional simplifications for callers that render many cards at once. Each
-     card navboxes). It swaps the paper texture from the normal-mode multiply,
+      masked layer costs the GPU an extra render pass per card and the texture
-     which blends two images and so is re-rasterised every scrolled frame, to a
+      costs a backdrop read, so dropping them buys frames at the cost of detail.
-     transparent-paper overlay that is a single cacheable image. On the profiled
+      wearMask=no keeps the tier tint on the card stock but loses the worn edge;
-      navbox this took the render thread's OpenGL work from ~230 ms/s to ~10 and
+      wearMask=ramp instead fades the tint in from the card's edges.
-      roughly doubled the frame rate. The wear and icon masks are clips of a
+-->{{#vardefine:lite|{{#switch:{{{wearMask|}}}|no=itembox-flat-wear|ramp=itembox-ramp-wear}} {{#ifeq:{{{iconMask|}}}|no|itembox-flat-icon}} {{#ifeq:{{{texture|}}}|no|itembox-no-texture}}}}<!--
-     single image, not blends, so they cache once rasterised and stay at full
-     detail. The overlay itself is defined in [[Template:ItemBox/styles.css]] and
-      keyed off the same per-item texture-vN class, so a card keeps its paper
-      across both modes.
--->{{#vardefine:lowGraphics|{{#ifeq:{{{lowGraphics|}}}|true|itembox-lowgfx}}}}<!--
       Links.
@@ Line 38: / Line 33: @@
 -->{{#vardefine:linkClick|{{{overrideLinkClick|{{#var:itemName}}{{If lang}}}}}}}<!--
---><div class="itembox {{#var:showTierTag}} {{#var:tier}} {{#var:slot}} {{#var:isActive}} {{#var:isImbue}} {{#var:variants}} {{#var:lowGraphics}}" style="font-size:{{#expr: 10 * {{#if:{{{size|}}}|{{{size}}}|1}} }}px;">
+--><div class="itembox {{#var:showTierTag}} {{#var:tier}} {{#var:slot}} {{#var:isActive}} {{#var:isImbue}} {{#var:variants}} {{#var:lite}}" style="font-size:{{#expr: 10 * {{#if:{{{size|}}}|{{{size}}}|1}} }}px;">
 	<div class="itembox-background">
 		<div class="itembox-card">
@@ Line 50: / Line 45: @@
 				<div class="itembox-imbue-tag">{{#invoke:Lang|get_string|item_info_imbue}}</div>
 			</div>
-			<!-- container-type is inline because TemplateStyles strips it; the name's cqw size measures against this box. -->
+			<div class="itembox-name-area">
-			<div class="itembox-name-area" style="container-type: inline-size;">
+				<p class="itembox-name" style="font-size:{{#var:fontSize}}em;text-wrap:balance;">{{#var:displayName}}</p>
-				<p class="itembox-name" style="font-size:{{#var:fontSize}};text-wrap:balance;">{{#var:displayName}}</p>
 			</div>
 			<div class="itembox-wear"></div>