diff --git a/webapp/assets/_new/styles/tokens.scss b/webapp/assets/_new/styles/tokens.scss index d84b92ac9..372dab0c8 100644 --- a/webapp/assets/_new/styles/tokens.scss +++ b/webapp/assets/_new/styles/tokens.scss @@ -408,6 +408,15 @@ $color-ribbon-event-active: $background-color-third-active; $color-ribbon-article: $background-color-secondary; $color-ribbon-article-active: $background-color-secondary-active; +/** + * @tokens Chat Color + */ + +$chat-message-bg-me: $color-primary-light; +$chat-message-color: $text-color-base; +$chat-message-bg-others: $color-neutral-80; +$chat-sidemenu-bg: $color-secondary-active; +$chat-new-message-color: $color-secondary-active; :export { colorPrimary: $color-primary; @@ -430,4 +439,11 @@ $color-ribbon-article-active: $background-color-secondary-active; backgroundColorPrimary: $background-color-primary; colorNeutral30: $color-neutral-30; + + chatMessageColor: $chat-message-color; + + chatMessageBgMe: $chat-message-bg-me; + chatMessageBgOthers: $chat-message-bg-others; + + chatNewMessageColor: $chat-new-message-color; } \ No newline at end of file diff --git a/webapp/constants/chat.js b/webapp/constants/chat.js index 79d8f0cd7..a183a3922 100644 --- a/webapp/constants/chat.js +++ b/webapp/constants/chat.js @@ -57,9 +57,9 @@ const STYLE = { }, message: { - background: styleData.backgroundColorBase, - backgroundMe: styleData.colorPrimaryLight, - color: styleData.textColorBase, + background: styleData.chatMessageBgOthers, + backgroundMe: styleData.chatMessageBgMe, + color: styleData.chatMessageColor, colorStarted: '#9ca6af', backgroundDeleted: '#dadfe2', backgroundSelected: '#c2dcf2', @@ -76,7 +76,7 @@ const STYLE = { colorReply: '#6e6e6e', colorTag: '#0d579c', backgroundImage: '#ddd', - colorNewMessages: '#1976d2', + colorNewMessages: styleData.chatNewMessageColor, backgroundScrollCounter: '#0696c7', colorScrollCounter: '#fff', backgroundReaction: '#eee',