teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

chore: reduce emoji picker size

Browse source
This commit is contained in:
Anthony Fu 2023-01-16 11:21:38 +01:00
parent e847f8ef1d
commit d21860487b
2 changed files with 11 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
components/search/SearchEmojiInfo.vue
View file

@ -1,6 +1,4 @@
<script setup lang="ts"> <script setup lang="ts">
import { Emoji } from 'emoji-mart'
export interface SearchEmoji { export interface SearchEmoji {
title: string title: string
src: string src: string
@ -12,18 +10,13 @@ defineProps<{
</script> </script>
<template> <template>
<div flex gap-2 items-center> <div flex="~ gap3" items-center text-base>
<img <img
:key="emoji.title" width="20"
width="30" height="20"
height="30"
:src="emoji.src" :src="emoji.src"
loading="lazy" loading="lazy"
> >
<div flex="~ col gap1" pt-1 pl-2 shrink h-full overflow-hidden leading-none> <span shrink overflow-hidden leading-none text-base><span text-secondary>:</span>{{ emoji.title }}<span text-secondary>:</span></span>
<div flex="~" gap-2>
<span text-lg>:{{ emoji.title }}:</span>
</div>
</div>
</div> </div>
</template> </template>

9
components/tiptap/TiptapEmojiList.vue
View file

@ -3,7 +3,7 @@ import { getEmojiMatchesInText } from '@iconify/utils/lib/emoji/replace/find'
import CommonScrollIntoView from '../common/CommonScrollIntoView.vue' import CommonScrollIntoView from '../common/CommonScrollIntoView.vue'
import type { CustomEmoji, Emoji } from '~~/composables/tiptap/suggestion' import type { CustomEmoji, Emoji } from '~~/composables/tiptap/suggestion'
import { isCustomEmoji } from '~~/composables/tiptap/suggestion' import { isCustomEmoji } from '~~/composables/tiptap/suggestion'
import { emojiFilename, emojiPrefix, emojiRegEx, getEmojiAttributes } from '~~/config/emojis' import { emojiFilename, emojiPrefix, emojiRegEx } from '~~/config/emojis'
const { items, command } = defineProps<{ const { items, command } = defineProps<{
items: (CustomEmoji | Emoji)[] items: (CustomEmoji | Emoji)[]
@ -68,7 +68,12 @@ defineExpose({
</script> </script>
<template> <template>
<div v-if="isPending || items.length" relative bg-base text-base shadow border="~ base rounded" text-sm py-2 overflow-x-hidden overflow-y-auto max-h-100> <div
v-if="isPending || items.length"
relative bg-base text-base shadow border="~ base rounded"
text-sm py-2 overflow-x-hidden overflow-y-auto max-h-100
min-w-40 max-w-50
>
<template v-if="isPending"> <template v-if="isPending">
<div flex gap-1 items-center p2 animate-pulse> <div flex gap-1 items-center p2 animate-pulse>
<div i-ri:loader-2-line animate-spin /> <div i-ri:loader-2-line animate-spin />