oxen-io
/
session-desktop
mirror of https://github.com/oxen-io/session-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: qa feedback - Fixed community invitation theming and icons

This commit is contained in:
William Grant 2022-10-17 14:49:21 +11:00
parent 93f814e59d
commit e28c5e9885
2 changed files with 26 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
stylesheets/_conversation.scss
View File

@ -21,6 +21,12 @@
&.invitation-outgoing { &.invitation-outgoing {
background-color: var(--message-bubbles-sent-background-color); background-color: var(--message-bubbles-sent-background-color);
align-self: flex-end; align-self: flex-end;
.contents {
.session-icon-button {
background-color: var(--transparent-color);
}
}
} }
display: inline-block; display: inline-block;

28
ts/components/conversation/message/message-item/GroupInvitation.tsx
View File

@ -4,6 +4,12 @@ import { PropsForGroupInvitation } from '../../../../state/ducks/conversations';
import { acceptOpenGroupInvitation } from '../../../../interactions/messageInteractions'; import { acceptOpenGroupInvitation } from '../../../../interactions/messageInteractions';
import { SessionIconButton } from '../../../icon'; import { SessionIconButton } from '../../../icon';
import { ReadableMessage } from './ReadableMessage'; import { ReadableMessage } from './ReadableMessage';
import styled from 'styled-components';
const StyledIconContainer = styled.div`
background-color: var(--message-link-preview-background-color);
border-radius: 100%;
`;
export const GroupInvitation = (props: PropsForGroupInvitation) => { export const GroupInvitation = (props: PropsForGroupInvitation) => {
const { messageId, receivedAt, isUnread } = props; const { messageId, receivedAt, isUnread } = props;
@ -24,14 +30,20 @@ export const GroupInvitation = (props: PropsForGroupInvitation) => {
<div className="group-invitation-container" id={`msg-${props.messageId}`}> <div className="group-invitation-container" id={`msg-${props.messageId}`}>
<div className={classNames(classes)}> <div className={classNames(classes)}>
<div className="contents"> <div className="contents">
<SessionIconButton <StyledIconContainer>
iconColor="var(--background-secondary-color)" <SessionIconButton
iconType="plus" iconColor={
iconSize={'large'} props.direction === 'outgoing'
onClick={() => { ? 'var(--message-bubbles-sent-text-color)'
acceptOpenGroupInvitation(props.acceptUrl, props.serverName); : 'var(--message-bubbles-received-text-color)'
}} }
/> iconType={props.direction === 'outgoing' ? 'communities' : 'plus'}
iconSize={'large'}
onClick={() => {
acceptOpenGroupInvitation(props.acceptUrl, props.serverName);
}}
/>
</StyledIconContainer>
<span className="group-details"> <span className="group-details">
<span className="group-name">{props.serverName}</span> <span className="group-name">{props.serverName}</span>
<span className="group-type">{openGroupInvitation}</span> <span className="group-type">{openGroupInvitation}</span>