From 047b8606ef3c6b7a588ffc3032031c692324002d Mon Sep 17 00:00:00 2001
From: cbe <cbe@users.noreply.github.com>
Date: Sun, 15 Oct 2023 21:06:18 +0200
Subject: [PATCH] Make suggestion clickable in bookmark creation
This was especially noticeable when using the web app on mobile devices
as the suggestion looks like it's clickable. It should be also a little
bit more convenient UX-wise when it's allowed to be clicked in non-
mobile context as well.
---
internal/view/assets/js/component/dialog.js | 15 ++++++++-------
1 file changed, 8 insertions(+), 7 deletions(-)
diff --git a/internal/view/assets/js/component/dialog.js b/internal/view/assets/js/component/dialog.js
index 4c2836a77c..70c4ddf1c9 100644
--- a/internal/view/assets/js/component/dialog.js
+++ b/internal/view/assets/js/component/dialog.js
@@ -31,9 +31,10 @@ var template = `
@focus="$event.target.select()"
@keyup="handleInput(index)"
@keyup.enter="handleInputEnter(index)">
- <span :ref="'suggestion-'+index"
- v-if="field.suggestion"
- class="suggestion">{{field.suggestion}}</span>
+ <button :ref="'suggestion-'+index"
+ v-if="field.suggestion"
+ @click="handleInputEnter(index)"
+ class="suggestion">{{field.suggestion}}</button>
</template>
</slot>
</div>
@@ -191,11 +192,11 @@ export default {
// Display suggestion
this.$nextTick(() => {
var input = this.$refs.input[index],
- span = this.$refs['suggestion-' + index][0],
+ suggestionNode = this.$refs['suggestion-' + index][0],
inputRect = input.getBoundingClientRect();
- span.style.top = (inputRect.bottom - 1) + 'px';
- span.style.left = inputRect.left + 'px';
+ suggestionNode.style.top = (inputRect.bottom - 1) + 'px';
+ suggestionNode.style.left = inputRect.left + 'px';
});
},
handleInputEnter(index) {
@@ -235,4 +236,4 @@ export default {
})
}
}
-}
\ No newline at end of file
+}