Fix emoji position for non-web platforms in CustomEmoji components

src/components/HTMLEngineProvider/CustomEmojiWithDefaultPressableAction.tsx

@@ -1,4 +1,5 @@
 import React, {useContext} from 'react';
+import {Platform} from 'react-native';
 import {FABPopoverContext} from '@components/FABPopoverProvider';
 import ImageSVG from '@components/ImageSVG';
 import {PressableWithoutFeedback} from '@components/Pressable';
@@ -12,6 +13,7 @@ type CustomEmojiWithDefaultPressableActionProps = {
 
 function CustomEmojiWithDefaultPressableAction({emojiKey}: CustomEmojiWithDefaultPressableActionProps) {
     const styles = useThemeStyles();
+    const positionFix = Platform.OS !== 'web' && {height: '5%'};
 
     const image = (
         <ImageSVG
@@ -26,16 +28,12 @@ function CustomEmojiWithDefaultPressableAction({emojiKey}: CustomEmojiWithDefaul
         return (
             <PressableWithoutFeedback
                 onPress={() => setIsCreateMenuActive(!isCreateMenuActive)}
-                style={styles.customEmoji}
+                style={[styles.customEmoji, positionFix]}
                 accessible
                 accessibilityRole="button"
                 accessibilityLabel="Press to create a new item"
             >
-                <ImageSVG
-                    src={emojiMap[emojiKey]}
-                    width={variables.iconSizeNormal}
-                    height={variables.iconSizeNormal}
-                />
+                {image}
             </PressableWithoutFeedback>
         );
     }

src/components/HTMLEngineProvider/HTMLRenderers/CustomEmojiRenderer.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import type {FC} from 'react';
+import {Platform} from 'react-native';
 import type {CustomRendererProps, TPhrasing, TText} from 'react-native-render-html';
 import type {SvgProps} from 'react-native-svg';
 import GlobalCreateIcon from '@assets/images/customEmoji/global-create.svg';
@@ -17,6 +18,7 @@ export const emojiMap: Record<string, FC<SvgProps>> = {
 function CustomEmojiRenderer({tnode}: CustomRendererProps<TText | TPhrasing>) {
     const styles = useThemeStyles();
     const emojiKey = tnode.attributes.emoji;
+    const positionFix = Platform.OS !== 'web' && {height: '5%'};
 
     if (emojiMap[emojiKey]) {
         if ('pressablewithdefaultaction' in tnode.attributes) {
@@ -25,7 +27,7 @@ function CustomEmojiRenderer({tnode}: CustomRendererProps<TText | TPhrasing>) {
 
         return (
             <ImageSVG
-                style={styles.customEmoji}
+                style={[styles.customEmoji, positionFix]}
                 src={emojiMap[emojiKey]}
                 width={variables.iconSizeNormal}
                 height={variables.iconSizeNormal}