Sandbox: Difference between revisions
From Eco - English Wiki
| [checked revision] | [checked revision] |
No edit summary |
No edit summary |
||
| Line 23: | Line 23: | ||
</div> | </div> | ||
</div> | </div> | ||
== Test info card with dark/light mode == | |||
<div class="row align-items-md-stretch"> | |||
<div class="col-md-6"> | |||
<div class="h-80 p-4 border-primary text-white bg-dark rounded-3"> | |||
<h5 class="text-white">{{Icon |name = Achievement|id = Achievement|link = Achievements |style = 1 |size = 48}} Change the background</h5> | |||
<p>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.</p> | |||
</div> | |||
</div> | |||
<div class="col-md-6"> | |||
<div class="h-80 p-4 border-primary bg-light border rounded-3"> | |||
<h5>{{Icon |name = Achievement|id = Achievement|link = Achievements |style = 1 |size = 48}} Add borders</h5> | |||
<p>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.</p> | |||
</div> | |||
</div> | |||
</div> | |||
Revision as of 12:54, 18 February 2026
Test for new Icon for recipes with number on
10
Test Plant template with gallery
Aglonema Plant
Adipisicing pariatur occaecat exercitation sunt exercitation consectetur in dolor adipisicing consequat sunt magna occaecat occaecat.
Test info card with dark/light mode
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.
