[IMP][CSS] Revamp modal to use all BS classes and variables
This commit is contained in:
committed by
Antoine Vandevenne (anv)
parent
33cccf063f
commit
001fe6bd1e
@@ -6,18 +6,19 @@
|
||||
let imageModalId = 0;
|
||||
content.querySelectorAll('img').forEach(image => {
|
||||
// Enforce the presence of the `img-fluid` class on all images.
|
||||
image.classList.add('img-fluid');
|
||||
image.classList.add('img-fluid', 'img-thumbnail');
|
||||
|
||||
// Add a modal to each image that does not explicitly block it and has no target.
|
||||
if (!image.classList.contains('o-no-modal') && image.parentElement.tagName !== 'A') {
|
||||
const modalContainer = document.createElement('div');
|
||||
modalContainer.classList.add('o_image_modal');
|
||||
modalContainer.innerHTML = `<div class="modal fade" id="modal-${imageModalId}">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<img src="${image.src}" alt="${image.alt}" class="o-no-modal img-fluid"/>
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
<img src="${image.src}" alt="${image.alt}" class="o-no-modal img-fluid img-thumbnail"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user