Template:Demo RecipeItemIcon: Difference between revisions

From Eco - English Wiki
[unchecked revision][unchecked revision]
← Older editNewer edit →
undoWugWugg (talk | contribs)
141 edits
VisualWikitext
WugWugg (talk | contribs)
141 edits
No edit summary
WugWugg (talk | contribs)
141 edits
No edit summary
Line 47: Line 47:
|}
|}


=== Composition Demo ===
=== Grid Demo ===
<div class="row g-2 mb-3"><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=DaisyItem_Icon.png|count=100|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=TulipItem Icon.png|count=100|border=yellow|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=LupineItem Icon.png|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=RoseItem Icon.png|count=10|border=yellow|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=FlaxFlowerItem Icon.png|count=67|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=Flower Icon.png|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=EcoBookItem Icon.png|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=RiceFlourItem Icon.png|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=NailItem Icon.png|border=yellow|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=AdobeItem Icon.png|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=JoshuaLogItem Icon.png|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=IronOreItem Icon.png|border=yellow|size=128}}</div></div>
<div class="row g-2 mb-3"><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=DaisyItem_Icon.png|count=100|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=TulipItem Icon.png|count=100|border=yellow|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=LupineItem Icon.png|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=RoseItem Icon.png|count=10|border=yellow|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=FlaxFlowerItem Icon.png|count=67|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=Flower Icon.png|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=EcoBookItem Icon.png|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=RiceFlourItem Icon.png|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=NailItem Icon.png|border=yellow|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=AdobeItem Icon.png|border=green|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=JoshuaLogItem Icon.png|size=128}}</div><div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">{{Demo RecipeItemIcon|icon=IronOreItem Icon.png|border=yellow|size=128}}</div></div>


<div class="row g-2 mb-3"><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"></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"></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-md-12"></div><div class="col-xs-12 col-md-1"><i class="fas fa-equals"></i></div><div class="col-xs-12 col-md-2">{{Demo RecipeItemIcon|icon=LumberItem_Icon.png|size=128|count=2}}</div></div>
=== 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>


<templatedata>
<templatedata>

Revision as of 16:25, 19 February 2026



Visual Goals

location=center location=center location=center 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
100
10
67

Recipe Demo

2
0.5
10
2

No description.

Template parameters[Edit template data]

ParameterDescriptionTypeStatus
sizesize

Size in pixels (numbers only)

Suggested values
64 128
Default
64
Example
64
Auto value
64
Numberoptional
iconicon

File name for icon.

Example
DaisyItem_Icon.png
Stringrequired
countcount num

A number to display over this icon's image. Useful for showing counts.

Example
10
Numberoptional
borderborder

Border color

Suggested values
white yellow green
Default
white
Auto value
white
Stringoptional
Retrieved from "https://wiki.play.eco/en/index.php?title=Template:Demo_RecipeItemIcon&oldid=16337"
CC BY-NC-SA 4.0
Powered by MediaWiki