Template:Demo RecipeItemIcon: Difference between revisions

[unchecked revision]

[checked revision]

Revision as of 16:34, 19 February 2026

Visual Goals

location=center

Template Examples

Border Colors
Color	Example
White (Default)
Yellow
Green

Responsive Sizing
Size	Example
64px (Default)	10
128px	10
256px	10

Count Shadow
Count	Example
No Count/Shadow
10	10
100	100

Grid Demo

100

10

67

Recipe Demo

2

0.5

10

2

No description.

Template parameters[Edit template data]
Parameter		Description	Type	Status
size	`size`	Size in pixels (numbers only) Suggested values `64` `128` Default 64 Example 64 Auto value `64`	Number	optional
icon	`icon`	File name for icon. Example DaisyItem_Icon.png	String	required
count	`count` `num`	A number to display over this icon's image. Useful for showing counts. Example 10	Number	optional
border	`border`	Border color Suggested values `white` `yellow` `green` Default white Auto value `white`	String	optional

@@ Line 51: / Line 51: @@
 === Recipe Demo ===
-<div class="row g-2 mb-3 align-items-center justify-content-center"><div class="col-xs-12 col-md-2">{{Demo RecipeItemIcon|icon=NailItem Icon.png|border=yellow|size=128|count=2}}</div><div class="col-xs-12 col-md-1"><i class="fas fa-plus" style="font-size:64px"></i></div><div class="col-xs-12 col-md-2">{{Demo RecipeItemIcon|icon=FlaxseedOilItem_Icon.png|border=yellow|size=128|count=0.5}}</div><div class="col-xs-12 col-md-1"><i class="fas fa-plus" style="font-size:64px"></i></div><div class="col-xs-12 col-md-2">{{Demo RecipeItemIcon|icon=WoodBoard_Icon.png|border=yellow|size=128|count=10}}</div><div class="col-xs-12 col-md-1"><i class="fas fa-equals" style="font-size:64px"></i></div><div class="col-xs-12 col-md-2">{{Demo RecipeItemIcon|icon=LumberItem_Icon.png|size=128|count=2}}</div></div>
+<div class="row g-2 mb-3 align-items-center justify-content-center"><div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">{{Demo RecipeItemIcon|icon=NailItem Icon.png|border=yellow|size=128|count=2}}</div><div class="col-xs-12 col-sm-2 col-md-1"><i class="fas fa-plus" style="font-size:64px"></i></div><div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">{{Demo RecipeItemIcon|icon=FlaxseedOilItem_Icon.png|border=yellow|size=128|count=0.5}}</div><div class="col-xs-12 col-sm-2 col-md-1"><i class="fas fa-plus" style="font-size:64px"></i></div><div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">{{Demo RecipeItemIcon|icon=WoodBoard_Icon.png|border=yellow|size=128|count=10}}</div><div class="col-xs-12 col-sm-2 col-md-1"><i class="fas fa-equals" style="font-size:64px"></i></div><div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">{{Demo RecipeItemIcon|icon=LumberItem_Icon.png|size=128|count=2}}</div></div>
 <templatedata>