github
/
AdminLTE
mirror of https://github.com/ColorlibHQ/AdminLTE
1
0
Fork 0
Code Issues Releases Wiki Activity

BS5 components

pull/5312/head
LEWE, GEORGE 2023-08-31 09:20:34 +02:00
parent 3dc54671da
commit e164129a4c
2 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/html/components/_scripts.astro
View File

@ -60,8 +60,10 @@ const adminlteJsUrl = path + "/js/adminlte.js";
<!--end::Bootstrap Tooltips-->
<!--begin::JavaScript-->
<script is:inline>
const toastTrigger = document.getElementById('liveToastBtn');
const toastLiveExample = document.getElementById('liveToast');
// const toastTrigger = document.getElementById('liveToastBtn');
// const toastLiveExample = document.getElementById('liveToast');
const toastTrigger = document.querySelector('[data-lte-show-toast="toastPrimary"]');
const toastLiveExample = document.getElementById('toastPrimary');
if (toastTrigger) {
const toastBootstrap = bootstrap.Toast.getOrCreateInstance(toastLiveExample);
toastTrigger.addEventListener('click', () => {

27
src/html/pages/components/general.astro
View File

@ -612,20 +612,9 @@ const pageTitle = "General Components";
<!--end::Header-->
<!--begin::Body-->
<div class="card-body">
<button type="button" class="btn btn-primary" id="liveToastBtn">Show live toast</button>
<button type="button" class="btn btn-primary" data-lte-trigger="showToastPrimary">Show live toast</button>
<div class="toast-container position-fixed bottom-0 end-0 p-3">
<div id="liveToast" class="toast toast-warning" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<i class="bi bi-circle me-2"></i>
<strong class="me-auto">Bootstrap</strong>
<small>11 mins ago</small>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
Hello, world! This is a toast message.
</div>
</div>
<div id="liveToast" class="toast toast-warning" role="alert" aria-live="assertive" aria-atomic="true">
<div id="toastPrimary" class="toast toast-primary" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<i class="bi bi-circle me-2"></i>
<strong class="me-auto">Bootstrap</strong>
@ -636,6 +625,18 @@ const pageTitle = "General Components";
Hello, world! This is a toast message.
</div>
</div>
<!--<button type="button" class="btn btn-warning" data-lte-showtoast="toastWarning">Show live toast</button>-->
<!--<div data-lte-toast="toastWarning" class="toast toast-warning" role="alert" aria-live="assertive" aria-atomic="true">-->
<!-- <div class="toast-header">-->
<!-- <i class="bi bi-circle me-2"></i>-->
<!-- <strong class="me-auto">Bootstrap</strong>-->
<!-- <small>11 mins ago</small>-->
<!-- <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>-->
<!-- </div>-->
<!-- <div class="toast-body">-->
<!-- Hello, world! This is a toast message.-->
<!-- </div>-->
<!--</div>-->
</div>
</div>
<!--end::Body-->