Dismiss dropdown if clicked when open
This commit is contained in:
parent
54b1a1a9c9
commit
f33690b79c
@ -285,9 +285,9 @@
|
|||||||
{% for file in files %}
|
{% for file in files %}
|
||||||
{% if ns.found is sameas false and file.startswith(i[0]) %}
|
{% if ns.found is sameas false and file.startswith(i[0]) %}
|
||||||
|
|
||||||
<div class="card-footer-item dropdown" style="width:100%">
|
<div class="card-footer-item dropdown" style="width:100%;">
|
||||||
<div class="dropdown-trigger">
|
<div class="dropdown-trigger" style="width:100%;">
|
||||||
<button class="is-size-6" aria-haspopup="true" aria-controls="dropdown-menu3">
|
<button class="is-size-6" style="display: flex;width: 100%;justify-content: space-between;" aria-haspopup="true" aria-controls="dropdown-menu3">
|
||||||
<span >Instructions</span>
|
<span >Instructions</span>
|
||||||
<span class="icon is-small">
|
<span class="icon is-small">
|
||||||
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
||||||
@ -819,11 +819,13 @@ $(".navbar-item").click(function() {
|
|||||||
const dropdowns = document.querySelectorAll('.dropdown:not(.is-hoverable)');
|
const dropdowns = document.querySelectorAll('.dropdown:not(.is-hoverable)');
|
||||||
|
|
||||||
if (dropdowns.length > 0) {
|
if (dropdowns.length > 0) {
|
||||||
// For each dropdown, add event handler to open on click.
|
// For each dropdown, add event handler to open/close on click.
|
||||||
dropdowns.forEach(function(el) {
|
dropdowns.forEach(function(el) {
|
||||||
el.addEventListener('click', function(e) {
|
el.addEventListener('click', function(e) {
|
||||||
closeDropdowns();
|
// Prevent click from propagating to document
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
|
|
||||||
|
// Toggle the 'is-active' class, which will open or close the dropdown
|
||||||
el.classList.toggle('is-active');
|
el.classList.toggle('is-active');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -851,7 +853,6 @@ document.addEventListener('keydown', function (event) {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
Loading…
Reference in New Issue
Block a user