emoji_input: show more suggestions
5 suggestions is really too little, so increase the limit and make the list scrollable.
This commit is contained in:
parent
2765a5c163
commit
7b8429aa24
2 changed files with 13 additions and 1 deletions
|
@ -183,7 +183,7 @@ const EmojiInput = {
|
|||
// Async: cancel if textAtCaret has changed during wait
|
||||
if (this.textAtCaret !== newWord) return
|
||||
if (matchedSuggestions.length <= 0) return
|
||||
this.suggestions = take(matchedSuggestions, 5)
|
||||
this.suggestions = take(matchedSuggestions, 25)
|
||||
.map(({ imageUrl, ...rest }) => ({
|
||||
...rest,
|
||||
img: imageUrl || ''
|
||||
|
@ -300,6 +300,9 @@ const EmojiInput = {
|
|||
if (this.highlighted < 0) {
|
||||
this.highlighted = this.suggestions.length - 1
|
||||
}
|
||||
const panelBody = this.$refs['panel-body']
|
||||
const highlighted = panelBody.children[this.highlighted]
|
||||
highlighted.scrollIntoView({ block: 'nearest' })
|
||||
e.preventDefault()
|
||||
} else {
|
||||
this.highlighted = 0
|
||||
|
@ -312,6 +315,9 @@ const EmojiInput = {
|
|||
if (this.highlighted >= len) {
|
||||
this.highlighted = 0
|
||||
}
|
||||
const panelBody = this.$refs['panel-body']
|
||||
const highlighted = panelBody.children[this.highlighted]
|
||||
highlighted.scrollIntoView({ block: 'nearest' })
|
||||
e.preventDefault()
|
||||
} else {
|
||||
this.highlighted = 0
|
||||
|
|
|
@ -128,6 +128,12 @@
|
|||
--postLink: var(--popoverPostLink, $fallback--link);
|
||||
--postFaintLink: var(--popoverPostFaintLink, $fallback--link);
|
||||
--icon: var(--popoverIcon, $fallback--icon);
|
||||
|
||||
overflow-y: scroll;
|
||||
scrollbar-gutter: stable;
|
||||
scrollbar-width: thin;
|
||||
max-height: calc((0.2em * 2 + 1px + 32px) * 5);
|
||||
scroll-padding-block: calc((0.2em * 2 + 1px + 32px) * 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue