diff --git a/CHANGELOG.md b/CHANGELOG.md index 3b2a108d5..5a483424b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -31,6 +31,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Modals: fix "View context" button in media modal. - Posts: let unauthenticated users to translate posts if allowed by backend. - Chats: fix jumpy scrollbar. +- Composer: fix alignment of icon in submit button. ## [3.0.0] - 2022-12-25 diff --git a/app/soapbox/features/compose/components/compose-form.tsx b/app/soapbox/features/compose/components/compose-form.tsx index a7af9e77d..c80dc9a07 100644 --- a/app/soapbox/features/compose/components/compose-form.tsx +++ b/app/soapbox/features/compose/components/compose-form.tsx @@ -15,7 +15,6 @@ import { } from 'soapbox/actions/compose'; import AutosuggestInput, { AutoSuggestion } from 'soapbox/components/autosuggest-input'; import AutosuggestTextarea from 'soapbox/components/autosuggest-textarea'; -import Icon from 'soapbox/components/icon'; import { Button, HStack, Stack } from 'soapbox/components/ui'; import { useAppDispatch, useAppSelector, useCompose, useFeatures, useInstance, usePrevious } from 'soapbox/hooks'; import { isMobile } from 'soapbox/is-mobile'; @@ -241,25 +240,18 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab const disabledButton = disabled || isUploading || isChangingUpload || length(countedText) > maxTootChars || (countedText.length !== 0 && countedText.trim().length === 0 && !anyMedia); const shouldAutoFocus = autoFocus && !showSearch && !isMobile(window.innerWidth); - let publishText: string | JSX.Element = ''; + let publishText: string = ''; + let publishIcon: string | undefined; let textareaPlaceholder: MessageDescriptor; if (isEditing) { publishText = intl.formatMessage(messages.saveChanges); } else if (privacy === 'direct') { - publishText = ( - <> - - {intl.formatMessage(messages.message)} - - ); + publishText = intl.formatMessage(messages.message); + publishIcon = require('@tabler/icons/mail.svg'); } else if (privacy === 'private') { - publishText = ( - <> - - {intl.formatMessage(messages.publish)} - - ); + publishText = intl.formatMessage(messages.publish); + publishIcon = require('@tabler/icons/lock.svg'); } else { publishText = privacy !== 'unlisted' ? intl.formatMessage(messages.publishLoud, { publish: intl.formatMessage(messages.publish) }) : intl.formatMessage(messages.publish); } @@ -355,7 +347,7 @@ const ComposeForm = ({ id, shouldCondense, autoFocus, clickab )} -