Added tooltips to SKU on Dashboard+Items

- Globally enabled all bootstrap tooltips.
This commit is contained in:
Leon Meier 2023-05-13 00:42:15 +02:00
parent 7a26537903
commit 5ade4891b5
3 changed files with 9 additions and 5 deletions

View File

@ -30,20 +30,18 @@
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">SKU</th>
<th scope="col">Name</th>
<th scope="col">Status</th>
<th scope="col">SKU</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<% it.recents.forEach(function(user){ %>
<tr>
<th scope="row"><%= user.id %></th>
<th scope="row" data-bs-toggle="tooltip" data-bs-placement="left" data-bs-title="ID: <%= user.id %>"><%= user.SKU %></th>
<td><%= user.name %></td>
<td><span class="badge text-bg-success"><%= user.status %></span></td>
<td><%= user.SKU %></td>
<td><a href="#" class="btn btn-primary">Edit</a></td>
</tr>
<% }) %>

View File

@ -14,7 +14,7 @@
<tbody>
<% it.items.forEach(function(user){ %>
<tr>
<td><%= user.SKU %></td>
<td scope="row" data-bs-toggle="tooltip" data-bs-placement="left" data-bs-title="ID: <%= user.id %>"><%= user.SKU %></td>
<td><%= user.name %></td>
<td><span class="badge text-bg-success"><%= user.status %></span></td>
<td><a href="#" class="btn btn-primary">Edit</a></td>

View File

@ -1,3 +1,9 @@
<script src="https://cdn.jsdelivr.net/npm/feather-icons@4.28.0/dist/feather.min.js" integrity="sha384-uO3SXW5IuS1ZpFPKugNNWqTZRRglnUJK6UAZ/gxOX80nxEkN9NcGZTftn6RzhGWE" crossorigin="anonymous"></script>
<script>
// Enable all bootstrap tooltips.
// https://getbootstrap.com/docs/5.3/components/tooltips/#enable-tooltips
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
</script>
</body>
</html>