Sandbox: Difference between revisions
| [checked revision] | [checked revision] |
No edit summary |
No edit summary |
||
| Line 132: | Line 132: | ||
</div> | |||
</div> | |||
<div class="container-fluid"> | |||
<div class="row"> | |||
<div class="row g-3 mb-3"> | |||
<div class="col-xxl-2 col-lg-3 col-sm-4 col-12"> | |||
<a href="contacts.html" class="tile-link d-flex align-items-center flex-column text-center rounded-2"> | |||
<img src="assets/images/users.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards"> | |||
<h5>Users</h5> | |||
<p>Manage admin people</p> | |||
</a> | |||
</div> | |||
<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"> | |||
<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> | |||
</div> | |||
<div class="col-xxl-2 col-lg-3 col-sm-4 col-12"> | |||
<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"> | |||
<h5>Dashboard</h5> | |||
<p>Insights about company</p> | |||
</a> | |||
</div> | |||
<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"> | |||
<img src="assets/images/devices.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards"> | |||
<h5>Devices</h5> | |||
<p>Secure data devices</p> | |||
</a> | |||
</div> | |||
<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"> | |||
<img src="assets/images/apps.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards"> | |||
<h5>Apps</h5> | |||
<p>Manage app settings</p> | |||
</a> | |||
</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"> | |||
<img src="assets/images/security.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards"> | |||
<h5>Security</h5> | |||
<p>Configure security logs</p> | |||
</a> | |||
</div> | |||
</div> | </div> | ||
</div> | </div> | ||
Revision as of 21:48, 2 June 2025
Card title
Some quick example text to build on the card title and make up the bulk of the card's content.
Icon grid
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
Featured title
Paragraph of text beneath the heading to explain the heading.
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.
<button class="btn btn-outline-light" type="button">Example button</button>
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.
<button class="btn btn-outline-secondary" type="button">Example button</button>
Shift E
Card title
Some quick example text to build on the card title and make up the bulk of the card's content.
<a href="#" class="btn btn-primary">Go somewhere</a>
Card title
Card subtitle
Some quick example text to build on the card title and make up the bulk of the card's content.
<a href="#" class="card-link">Card link</a> <a href="#" class="card-link">Another link</a>
<a href="contacts.html" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<img src="assets/images/users.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
Users
Manage admin people
</a>
<a href="#" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<img src="assets/images/group.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
Groups
Create grouping lists
</a>
<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">
Dashboard
Insights about company
</a>
<a href="#" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<img src="assets/images/devices.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
Devices
Secure data devices
</a>
<a href="#" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<img src="assets/images/apps.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
Apps
Manage app settings
</a>
<a href="account-settings.html" class="tile-link d-flex align-items-center flex-column text-center rounded-2">
<img src="assets/images/security.svg" class="img-3x m-auto mb-4" alt="Admin Dashboards">
Security
Configure security logs
</a>
