Sandbox: Difference between revisions

From Eco - English Wiki
[checked revision][checked revision]
← Older edit
undoStalEF (talk | contribs)
Autochecked users, Editors, Reviewers, Administrators
5,237 edits
VisualWikitext
No edit summary
No edit summary
 
(102 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<div class="row g-3 mb-3">
__NOTOC__
                <div class="col-xxl-2 col-lg-3 col-sm-4 col-12">
                    {{#fab:wikipedia-w fa-spin}}
                    <h5>Users</h5>
                    <p>Manage admin people</p>


                </div>
== Test for new Main menu ==
                <div class="col-xxl-2 col-lg-3 col-sm-4 col-12">
 
                  <a href="#" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
{{#invoke:EcopediaMenu|MainMenu}}
                    <img src="assets/images/group.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
 
                    <h5>Groups</h5>
 
                    <p>Create grouping lists</p>
 
                  </a>
== Test for new Icon for recipes with number on ==
                </div>
 
                <div class="col-xxl-2 col-lg-3 col-sm-4 col-12">
'''Version from WugWugg:'''
                  <a href="dashboard5.html" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
 
                    <img src="assets/images/dashboard.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
{{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}}
                    <h5>Dashboard</h5>
 
                    <p>Insights about company</p>
== Test Plant template with gallery  ==
                  </a>
 
                </div>
<div class="row gy-4 gx-5">
                <div class="col-xxl-2 col-lg-3 col-sm-4 col-12">
<div class="col-md-6">
                  <a href="#" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<gallery widths=100% heights=auto mode="slideshow" showthumbnails>
                    <img src="assets/images/devices.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
Rice_Plant.jpg
                    <h5>Devices</h5>
Rice_Plant.jpg
                    <p>Secure data devices</p>
Rice_Plant.jpg
                  </a>
Rice_Plant.jpg
                </div>
</gallery>
                <div class="col-xxl-2 col-lg-3 col-sm-4 col-12">
</div>
                  <a href="#" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<div class="col-md-6">
                    <img src="assets/images/apps.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
<div class="card border-primary">
                    <h5>Apps</h5>
  <div class="card-body">
                    <p>Manage app settings</p>
<h2 class="card-title fs-40">[[File:RiceSpecies_Icon.png|64px|link=]] Rice</h2>
                  </a>
<p class="col-lg-10 card-text"></p>
                </div>
</div></div>
                <div class="col-xxl-2 col-lg-3 col-sm-4 col-12">
 
                  <a href="account-settings.html" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<div class="row g-2 mb-3">
                    <img src="assets/images/security.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
 
                    <h5>Security</h5>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6"><div class="card">
                    <p>Configure security logs</p>
  <div class="card-header bg-dark text-white">CardHeaderTitle</div>
                  </a>
  <ul class="list-group list-group-flush">
                </div>
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
  </ul>
</div></div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6"><div class="card">
  <div class="card-header bg-dark text-white">CardHeaderTitle</div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
  </ul>
</div></div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6"><div class="card">
  <div class="card-header bg-dark text-white">CardHeaderTitle</div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
  </ul>
</div></div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-6"><div class="card">
  <div class="card-header bg-dark text-white">CardHeaderTitle</div>
  <ul class="list-group list-group-flush">
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
    <li class="list-group-item">Listitem</li>
  </ul>
</div></div>
 
</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>

Latest revision as of 13:02, 19 May 2026


Test for new Main menu

[edit | edit source]
Concepts
Reference
Components


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.

Retrieved from "https://wiki.play.eco/en/index.php?title=Sandbox&oldid=16807"
CC BY-NC-SA 4.0
Powered by MediaWiki