diff --git a/isic/core/templates/core/base.html b/isic/core/templates/core/base.html index e8b7e83af..eac196bea 100644 --- a/isic/core/templates/core/base.html +++ b/isic/core/templates/core/base.html @@ -56,26 +56,14 @@ const controller = new AbortController(); return { - quickfindOpen: false, findText: '', results: {}, openQuickfindModal() { - this.quickfindOpen = true; - // x-show defers the style change asynchronously, so focusing - // immediately (or via $nextTick) races with it. Observe the - // actual DOM mutation to focus once the element is visible. - const input = this.$refs.quickfind; - const modal = input.closest('[x-show]'); - const observer = new MutationObserver(() => { - if (modal.style.display !== 'none') { - input.focus(); - observer.disconnect(); - } - }); - observer.observe(modal, {attributes: true, attributeFilter: ['style']}); + this.$refs.quickfindModal.showModal(); + this.$nextTick(() => this.$refs.quickfind.focus()); }, closeQuickfindModal() { - this.quickfindOpen = false; + this.$refs.quickfindModal.close(); }, async performFind() { if (this.findText.length < 3) { @@ -114,7 +102,7 @@ {% block head_extra %}{% endblock %} -
+ {% include 'core/partials/navbar.html' %}{{ error }}
-