diff --git a/stylesheets/components/ForwardMessageModal.scss b/stylesheets/components/ForwardMessageModal.scss index 60b2bedab9..e456362ae1 100644 --- a/stylesheets/components/ForwardMessageModal.scss +++ b/stylesheets/components/ForwardMessageModal.scss @@ -60,8 +60,9 @@ &__scroller { max-height: 300px; min-height: 300px; - padding-right: 36px; padding: 16px; + // Need more padding on the right to make room for floating emoji button + padding-right: 36px; } } @@ -79,14 +80,26 @@ } } - &--cancel { + &--close { @include button-reset; position: absolute; - left: 16px; + top: 8px; + right: 16px; + + height: 22px; + width: 22px; + + @include light-theme { + @include color-svg('../images/icons/v2/x-24.svg', $color-gray-75); + } + + @include dark-theme { + @include color-svg('../images/icons/v2/x-24.svg', $color-gray-15); + } @include keyboard-mode { &:focus { - color: $ultramarine-ui-light; + background-color: $ultramarine-ui-light; } } } diff --git a/ts/components/ContactListItem.stories.tsx b/ts/components/ContactListItem.stories.tsx index e3f106aa82..1d81bb8cfe 100644 --- a/ts/components/ContactListItem.stories.tsx +++ b/ts/components/ContactListItem.stories.tsx @@ -18,6 +18,8 @@ storiesOf('Components/ContactListItem', module) .add("It's me!", () => { return ( { return ( ); }) + .add('With a group with no avatarPath', () => { + return ( + + ); + }) .add('With just number, admin', () => { return ( { return ( { return ( { return ( { return ( { return ( - + ); }); diff --git a/ts/components/ContactListItem.tsx b/ts/components/ContactListItem.tsx index 39b3eb82f3..849176008a 100644 --- a/ts/components/ContactListItem.tsx +++ b/ts/components/ContactListItem.tsx @@ -28,6 +28,7 @@ type Props = { | 'profileName' | 'sharedGroupNames' | 'title' + | 'type' | 'unblurredAvatarPath' >; @@ -43,6 +44,7 @@ export class ContactListItem extends React.Component { profileName, sharedGroupNames, title, + type, unblurredAvatarPath, } = this.props; @@ -51,7 +53,7 @@ export class ContactListItem extends React.Component { acceptedMessageRequest={acceptedMessageRequest} avatarPath={avatarPath} color={color} - conversationType="direct" + conversationType={type} i18n={i18n} name={name} phoneNumber={phoneNumber} diff --git a/ts/components/ForwardMessageModal.tsx b/ts/components/ForwardMessageModal.tsx index d1b621fb20..1bdcf1adfa 100644 --- a/ts/components/ForwardMessageModal.tsx +++ b/ts/components/ForwardMessageModal.tsx @@ -250,13 +250,11 @@ export const ForwardMessageModal: FunctionComponent = ({ ) : ( + /> )}

{i18n('forwardMessage')}

diff --git a/ts/components/conversation/conversation-details/AddGroupMembersModal/ChooseGroupMembersModal.tsx b/ts/components/conversation/conversation-details/AddGroupMembersModal/ChooseGroupMembersModal.tsx index f5d652e84e..97fc320f76 100644 --- a/ts/components/conversation/conversation-details/AddGroupMembersModal/ChooseGroupMembersModal.tsx +++ b/ts/components/conversation/conversation-details/AddGroupMembersModal/ChooseGroupMembersModal.tsx @@ -151,6 +151,7 @@ export const ChooseGroupMembersModal: FunctionComponent = ({ {selectedContacts.map(contact => ( ; @@ -64,6 +65,7 @@ export const ContactCheckbox: FunctionComponent = React.memo( sharedGroupNames, style, title, + type, unblurredAvatarPath, }) => { const disabled = Boolean(disabledReason); @@ -99,7 +101,7 @@ export const ContactCheckbox: FunctionComponent = React.memo( avatarPath={avatarPath} checked={isChecked} color={color} - conversationType="direct" + conversationType={type} disabled={disabled} headerName={headerName} i18n={i18n} diff --git a/ts/views/conversation_view.ts b/ts/views/conversation_view.ts index 2a1ed3dc66..9635e28ea3 100644 --- a/ts/views/conversation_view.ts +++ b/ts/views/conversation_view.ts @@ -2365,9 +2365,8 @@ Whisper.ConversationView = Whisper.View.extend({ }) ); - if (linkPreview) { - this.resetLinkPreview(); - } + // Cancel any link still pending, even if it didn't make it into the message + this.resetLinkPreview(); return true; },