diff --git a/src/components/middle/MiddleHeader.scss b/src/components/middle/MiddleHeader.scss index 1bf715c0d..733d7bd98 100644 --- a/src/components/middle/MiddleHeader.scss +++ b/src/components/middle/MiddleHeader.scss @@ -116,7 +116,7 @@ font-size: 1.125rem; font-weight: var(--font-weight-medium); - line-height: 1.375rem; + line-height: 1.5rem; text-overflow: ellipsis; white-space: pre; diff --git a/src/components/modals/quickPreview/QuickPreviewModalHeader.module.scss b/src/components/modals/quickPreview/QuickPreviewModalHeader.module.scss index adbf5a8a8..d03656d6d 100644 --- a/src/components/modals/quickPreview/QuickPreviewModalHeader.module.scss +++ b/src/components/modals/quickPreview/QuickPreviewModalHeader.module.scss @@ -1,7 +1,11 @@ .root { position: relative; - min-height: 3rem; - padding: 0.5rem 0.625rem 0.625rem 0.75rem !important; + + display: flex; + align-items: center; + + min-height: 3.625rem; + padding: 0 0.75rem; border-bottom: 1px solid var(--color-borders); :global(.modal-title) { @@ -38,8 +42,8 @@ :global(.Avatar) { flex-shrink: 0; - width: 2.625rem; - height: 2.625rem; + width: 2.5rem; + height: 2.5rem; } :global(.info) { @@ -47,25 +51,27 @@ display: flex; flex: 1; flex-direction: column; - gap: 0.125rem; text-align: left; } :global(.title), :global(.fullName) { + --custom-emoji-size: 1.375rem; + overflow: hidden; margin-bottom: 0; - font-size: 1rem; + font-size: 1.0625rem; font-weight: var(--font-weight-semibold); - line-height: 1.25rem; + line-height: 1.5rem; text-overflow: ellipsis; white-space: nowrap; } - :global(.status) { + :global(.status), :global(.typing-status) { + margin: 0; font-size: 0.875rem; line-height: 1.125rem; color: var(--color-text-secondary); diff --git a/src/components/modals/quickPreview/QuickPreviewModalHeader.tsx b/src/components/modals/quickPreview/QuickPreviewModalHeader.tsx index 0746e80da..efc16a461 100644 --- a/src/components/modals/quickPreview/QuickPreviewModalHeader.tsx +++ b/src/components/modals/quickPreview/QuickPreviewModalHeader.tsx @@ -39,7 +39,7 @@ type StateProps = { hasUnreadMark?: boolean; }; -const EMOJI_STATUS_SIZE = 20; +const EMOJI_STATUS_SIZE = 22; const QuickPreviewModalHeader: FC = ({ chatId,