chore: reduce emoji picker size
parent
e847f8ef1d
commit
d21860487b
|
@ -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>
|
||||||
|
|
|
@ -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 />
|
||||||
|
|
Loading…
Reference in New Issue