Mirrors/linkding
2
0
Fork 0
mirror of https://github.com/sissbruecker/linkding synced 2024-11-28 22:30:19 +00:00
Code Issues Projects Releases Packages Wiki Activity

Enhance delete links with inline confirmation (#74)

Browse source
This commit is contained in:
Sascha Ißbrücker 2021-02-15 21:09:03 +01:00 committed by GitHub
parent b6b7d3f662
commit 3bab7db023
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 43 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
bookmarks/styles/bookmarks.scss
View file

@ -56,6 +56,13 @@ ul.bookmark-list {
color: darken($gray-color, 10%);
}
}
.actions .btn-link.bm-remove-confirm {
color: $error-color;
&:hover {
text-decoration: underline;
}
}
}
.bookmark-pagination {

38
bookmarks/templates/bookmarks/bookmark_list.html
View file

@ -32,8 +32,7 @@
class="btn btn-link btn-sm">Archive</a>
{% endif %}
<a href="{% url 'bookmarks:remove' bookmark.id %}?return_url={{ return_url }}"
class="btn btn-link btn-sm"
onclick="return confirm('Do you really want to delete this bookmark?')">Remove</a>
class="btn btn-link btn-sm bm-remove">Remove</a>
</div>
</li>
{% endfor %}
@ -42,3 +41,38 @@
<div class="bookmark-pagination">
{% pagination bookmarks %}
</div>
{# Enhance delete links to show inline confirmation #}
<script type="application/javascript">
window.addEventListener("load", function () {
const linkEls = document.querySelectorAll('.bookmark-list a.bm-remove');
function showConfirmation(linkEl) {
const cancelEl = document.createElement('span');
cancelEl.innerText = 'Cancel';
cancelEl.className = 'btn btn-link btn-sm bm-remove-confirm mr-1';
cancelEl.addEventListener('click', function() {
container.remove();
linkEl.style = '';
});
const confirmEl = document.createElement('a');
confirmEl.innerText = 'Confirm';
confirmEl.className = 'btn btn-link btn-delete btn-sm bm-remove-confirm';
confirmEl.href = linkEl.href;
const container = document.createElement('span');
container.appendChild(cancelEl);
container.appendChild(confirmEl);
linkEl.parentElement.appendChild(container);
linkEl.style = 'display: none';
}
linkEls.forEach(function (linkEl) {
linkEl.addEventListener('click', function (e) {
e.preventDefault();
showConfirmation(linkEl);
});
});
});
</script>