Sandbox: Difference between revisions

From Eco - English Wiki
[checked revision][checked revision]
No edit summary
 
(10 intermediate revisions by 2 users not shown)
Line 1: Line 1:
__NOTOC__
__NOTOC__
== Test for new Main menu ==
{{#invoke:EcopediaMenu|MainMenu}}


== Test for new Icon for recipes with number on ==
== Test for new Icon for recipes with number on ==
<div class="recipeitem">
 
    <div class="itemicon itemyellow">[[File:DaisyItem_Icon.png|64px]]</div>
'''Version from WugWugg:'''
    <div class="itemcount">10</div>
 
</div>
{{Icon|name=Charred Meat|link=1|size=64|style=5|border=green|count=100}} {{Icon|name=Daisy|link=1|size=64|style=5|border=yellow|count=10}}


== Test Plant template with gallery  ==
== Test Plant template with gallery  ==
Line 21: Line 27:
<div class="card border-primary">
<div class="card border-primary">
   <div class="card-body">
   <div class="card-body">
<h2 class="card-title fs-40">Aglonema Plant</h2>
<h2 class="card-title fs-40">[[File:RiceSpecies_Icon.png|64px|link=]] Rice</h2>
<p class="col-lg-10 card-text">Adipisicing pariatur occaecat exercitation sunt exercitation consectetur in dolor adipisicing consequat sunt magna occaecat occaecat.</p>
<p class="col-lg-10 card-text"></p>
</div></div>
</div></div>



Latest revision as of 13:02, 19 May 2026


Test for new Main menu

[edit | edit source]


Test for new Icon for recipes with number on

[edit | edit source]

Version from WugWugg:

100
10
[edit | edit source]

Rice

CardHeaderTitle
  • Listitem
  • Listitem
  • Listitem
CardHeaderTitle
  • Listitem
  • Listitem
  • Listitem
CardHeaderTitle
  • Listitem
  • Listitem
  • Listitem
CardHeaderTitle
  • Listitem
  • Listitem
  • Listitem

Test info card with dark/light mode

[edit | edit source]
Change the background

Swap the background-color utility and add a `.text-*` color utility to mix up the jumbotron look. Then, mix and match with additional component themes and more.

Add borders

Or, keep it light and add a border for some added definition to the boundaries of your content. Be sure to look under the hood at the source HTML here as we've adjusted the alignment and sizing of both column's content for equal-height.