From ff0ad776769271444f0ad377ad744fd22adefe30 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Tue, 27 Dec 2022 22:08:40 +0100 Subject: [PATCH] fix: insert space around custom emojis --- composables/content-parse.ts | 2 +- styles/global.css | 5 ++++- tests/__snapshots__/html-parse.test.ts.snap | 2 +- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/composables/content-parse.ts b/composables/content-parse.ts index 59127e70..c7be74c0 100644 --- a/composables/content-parse.ts +++ b/composables/content-parse.ts @@ -120,7 +120,7 @@ export function treeToText(input: Node): string { // add spaces around emoji to prevent parsing errors: 2 or more consecutive emojis will not be parsed if (input.name === 'img' && input.attributes.class?.includes('custom-emoji')) - return `:${input.attributes['data-emoji-id']}:` + return ` :${input.attributes['data-emoji-id']}: ` if (input.name === 'em-emoji') return `${input.attributes.native}` diff --git a/styles/global.css b/styles/global.css index 6ddbe00c..ab5b2555 100644 --- a/styles/global.css +++ b/styles/global.css @@ -85,7 +85,6 @@ body { overflow: hidden; max-height: 1.3em; max-width: 1.3em; - margin: 0 0.2em; vertical-align: text-bottom; } @@ -132,6 +131,10 @@ body { .content-editor { --at-apply: outline-none flex-1; max-width: 100%; + + .custom-emoji { + margin: 0 0.2em; + } } .skeleton-loading-bg { diff --git a/tests/__snapshots__/html-parse.test.ts.snap b/tests/__snapshots__/html-parse.test.ts.snap index c9a57001..20435672 100644 --- a/tests/__snapshots__/html-parse.test.ts.snap +++ b/tests/__snapshots__/html-parse.test.ts.snap @@ -52,7 +52,7 @@ exports[`html-parse > custom emoji > html 1`] = ` " `; -exports[`html-parse > custom emoji > text 1`] = `"Daniel Roe :nuxt:"`; +exports[`html-parse > custom emoji > text 1`] = `"Daniel Roe :nuxt:"`; exports[`html-parse > emojis > html 1`] = ` "