diff --git a/src/components/common/embedded/EmbeddedMessage.tsx b/src/components/common/embedded/EmbeddedMessage.tsx index 5745cdfa3..563d96ca9 100644 --- a/src/components/common/embedded/EmbeddedMessage.tsx +++ b/src/components/common/embedded/EmbeddedMessage.tsx @@ -59,6 +59,7 @@ type OwnProps = { }; const NBSP = '\u00A0'; +const EMOJI_SIZE = 17; const EmbeddedMessage: FC = ({ className, @@ -143,6 +144,7 @@ const EmbeddedMessage: FC = ({ translatedText={translatedText} observeIntersectionForLoading={observeIntersectionForLoading} observeIntersectionForPlaying={observeIntersectionForPlaying} + emojiSize={EMOJI_SIZE} /> ); } diff --git a/src/components/middle/composer/ComposerEmbeddedMessage.scss b/src/components/middle/composer/ComposerEmbeddedMessage.scss index 6026dd9ba..ecdd79ddd 100644 --- a/src/components/middle/composer/ComposerEmbeddedMessage.scss +++ b/src/components/middle/composer/ComposerEmbeddedMessage.scss @@ -1,6 +1,6 @@ .ComposerEmbeddedMessage { --accent-color: var(--color-primary); - height: 2.625rem; + height: 3.125rem; /* stylelint-disable-next-line plugin/no-low-performance-animation-properties */ transition: height 150ms ease-out, opacity 150ms ease-out; @@ -19,7 +19,7 @@ &_inner { display: flex; align-items: center; - margin-top: 0.5rem; + padding-top: 0.5rem; } & .embedded-left-icon { diff --git a/src/components/middle/composer/WebPagePreview.scss b/src/components/middle/composer/WebPagePreview.scss index e22102449..b61ffff60 100644 --- a/src/components/middle/composer/WebPagePreview.scss +++ b/src/components/middle/composer/WebPagePreview.scss @@ -1,6 +1,5 @@ .WebPagePreview { - height: 2.625rem; - margin-top: 0.5rem; + height: 3.125rem; /* stylelint-disable-next-line plugin/no-low-performance-animation-properties */ transition: height 150ms ease-out, opacity 150ms ease-out; @@ -18,6 +17,7 @@ // TODO Remove duplication with `.ComposerEmbeddedMessage` &_inner { + padding-top: 0.5rem; display: flex; align-items: center; }