We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
1 parent f02304d commit ff7237dCopy full SHA for ff7237d
packages/messenger-demo/src/theme.ts
@@ -10,17 +10,17 @@ export const themeColors = {
10
activeContactBackgroundColor: 'dimgray',
11
configurationBoxBackgroundColor: 'darkgrey',
12
configurationBoxBorderColor: '#666876',
13
- chatBakgroundColor: '#5c5e54',
+ chatBackgroundColor: '#5c5e54',
14
disabledButtonTextColor: 'burlywood',
15
errorTextColor: '#C30F1A',
16
errorBackgroundColor: '#830B12',
17
attachmentBackgroundColor: '#202129',
18
selectedContactBorderColor: 'orange',
19
profileConfigurationTextColor: 'pink',
20
receivedMessageBackgroundColor: 'pink',
21
- receivedMessageTextColor: 'white',
+ receivedMessageTextColor: 'orange',
22
sentMessageBackgroundColor: 'blue',
23
- sentMessageTextColor: 'white',
+ sentMessageTextColor: 'black',
24
infoBoxBackgroundColor: 'green',
25
infoBoxTextColor: 'yellow',
26
buttonShadow: '#000000',
packages/messenger-widget/src/components/Contacts/Contacts.css
@@ -1,5 +1,5 @@
1
.contacts-scroller {
2
- height: calc(100% - 65px) !important;
+ height: calc(100% - 50px) !important;
3
padding-left: 1rem;
4
margin-top: 2px;
5
}
packages/messenger-widget/src/components/Message/Message.css
@@ -49,7 +49,7 @@
49
background-color: var(--received-message-background-color);
50
51
52
-.msg:hover div .content-style + .msg-action-container {
+.msg:hover div .content-style+.msg-action-container {
53
visibility: visible;
54
55
@@ -69,11 +69,11 @@
69
flex-direction: column;
70
71
72
-.reply-preview-own{
+.reply-preview-own {
73
background-color: var(--scrollbar-background-color);
74
75
76
-.reply-preview-contact{
+.reply-preview-contact {
77
78
79
@@ -118,9 +118,9 @@
118
119
120
.own-msg-text {
121
- background: var(--sent-message-text-color);
+ color: var(--sent-message-text-color);
122
123
124
.contact-msg-text {
125
- background: var(--received-message-text-color);
126
-}
+ color: var(--received-message-text-color);
+}
packages/messenger-widget/src/components/Message/Message.tsx
@@ -57,14 +57,14 @@ export function Message(props: MessageProps) {
57
state.uiView.selectedMessageView.messageData
58
?.envelop.id === props.envelop.id
59
? 'msg-editing-active'
60
- : 'ms-3 own-msg-background'
+ : 'ms-3 own-msg-background own-msg-text'
61
: !props.message &&
62
props.envelop.message.metadata.type ===
63
MessageActionType.DELETE &&
64
(!props.envelop.message.attachments ||
65
props.envelop.message.attachments.length < 1)
66
? 'contact-deleted-msg'
67
- : 'contact-msg-background'
+ : 'contact-msg-background contact-msg-text'
68
).concat(
' ',
props.reactions.length > 0
@@ -210,8 +210,8 @@ export function Message(props: MessageProps) {
210
className={'reacted d-flex'.concat(
211
212
props.ownMessage
213
- ? 'background-config-box'
214
- : 'normal-btn-hover',
+ ? 'own-msg-background'
+ : 'contact-msg-background',
215
)}
216
>
217
{props.reactions.map((item, index) => {
packages/messenger-widget/src/components/Message/bl.ts
@@ -51,6 +51,15 @@ export const deleteEmoji = async (
) => {
const userDb = state.userDb;
+ /**
+ * User can't remove reactions on his own messages.
56
+ * As the other account can only react to my messages.
+ * And only that other account can remove those reactions.
+ **/
+ if (props.ownMessage) {
+ return;
+ }
+
if (!userDb) {
throw Error('userDB not found');
packages/messenger-widget/src/utils/theme-utils.ts
@@ -72,7 +72,7 @@ export const getCustomizedTheme = (themeCss: any) => {
? `1px solid ${themeCss.configurationBoxBorderColor}`
: defaultTheme.backgroundConfigBoxBorder,
chatBackground:
- themeCss.chatBakgroundColor ?? defaultTheme.chatBackground,
+ themeCss.chatBackgroundColor ?? defaultTheme.chatBackground,
disabledBtnText:
themeCss.disabledButtonTextColor ?? defaultTheme.disabledBtnText,
textError: themeCss.errorTextColor ?? defaultTheme.textError,
0 commit comments