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

cleanup scss and themify message view

Browse Source
pull/1315/head
Audric Ackermann 5 years ago
parent 5cdb25ca00
commit 9cbf21547b
No known key found for this signature in database
GPG Key ID: 999F434D76324AD4
10 changed files with 90 additions and 478 deletions
Show Stats Download Patch File Download Diff File

10
stylesheets/_conversation.scss
Unescape Escape View File

@ -32,6 +32,11 @@
} }
.main.panel { .main.panel {
@include themify($themes) {
border-top: themed('borderActionPanel');
border-left: themed('borderActionPanel');
}
.discussion-container { .discussion-container {
flex-grow: 1; flex-grow: 1;
position: relative; position: relative;
@ -373,8 +378,8 @@
.bottom-bar { .bottom-bar {
box-sizing: content-box; box-sizing: content-box;
$button-width: 36px; $button-width: 36px;
@include themify($themes) {
form.active { border-top: themed('borderActionPanel');
} }
form.send { form.send {
@ -454,7 +459,6 @@
max-height: 100px; max-height: 100px;
padding: 10px; padding: 10px;
border-radius: 4px; border-radius: 4px;
background-color: $color-loki-light-gray;
margin-top: 3px; margin-top: 3px;
margin-bottom: 6px; margin-bottom: 6px;
color: $color-light-90; color: $color-light-90;

135
stylesheets/_modules.scss
Unescape Escape View File

@ -206,40 +206,6 @@
background-color: $color-conversation-grey; background-color: $color-conversation-grey;
} }
.module-message__container--incoming-red {
background-color: $color-conversation-red;
}
.module-message__container--incoming-deep_orange {
background-color: $color-conversation-deep_orange;
}
.module-message__container--incoming-brown {
background-color: $color-conversation-brown;
}
.module-message__container--incoming-pink {
background-color: $color-conversation-pink;
}
.module-message__container--incoming-purple {
background-color: $color-conversation-purple;
}
.module-message__container--incoming-indigo {
background-color: $color-conversation-indigo;
}
.module-message__container--incoming-blue {
background-color: $color-conversation-blue;
}
.module-message__container--incoming-teal {
background-color: $color-conversation-teal;
}
.module-message__container--incoming-green {
background-color: $color-conversation-green;
}
.module-message__container--incoming-light_green {
background-color: $color-conversation-light_green;
}
.module-message__container--incoming-blue_grey {
background-color: $color-conversation-blue_grey;
}
.module-message__attachment-container { .module-message__attachment-container {
// Entirely to ensure that images are centered if they aren't full width of bubble // Entirely to ensure that images are centered if they aren't full width of bubble
text-align: center; text-align: center;
@ -503,18 +469,6 @@
} }
} }
.module-message__text--incoming {
color: $color-white;
a {
text-decoration: underline;
color: $color-white;
}
}
.module-message__text--error {
font-style: italic;
}
.module-message__metadata { .module-message__metadata {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -759,88 +713,11 @@
border-left-color: $color-conversation-grey; border-left-color: $color-conversation-grey;
background-color: $color-conversation-grey-tint; background-color: $color-conversation-grey-tint;
} }
.module-quote--outgoing-red {
border-left-color: $color-conversation-red;
background-color: $color-conversation-red-tint;
}
.module-quote--outgoing-deep_orange {
border-left-color: $color-conversation-deep_orange;
background-color: $color-conversation-deep_orange-tint;
}
.module-quote--outgoing-brown {
border-left-color: $color-conversation-brown;
background-color: $color-conversation-brown-tint;
}
.module-quote--outgoing-pink {
border-left-color: $color-conversation-pink;
background-color: $color-conversation-pink-tint;
}
.module-quote--outgoing-purple {
border-left-color: $color-conversation-purple;
background-color: $color-conversation-purple-tint;
}
.module-quote--outgoing-indigo {
border-left-color: $color-conversation-indigo;
background-color: $color-conversation-indigo-tint;
}
.module-quote--outgoing-blue {
border-left-color: $color-conversation-blue;
background-color: $color-conversation-blue-tint;
}
.module-quote--outgoing-teal {
border-left-color: $color-conversation-teal;
background-color: $color-conversation-teal-tint;
}
.module-quote--outgoing-green {
border-left-color: $color-conversation-green;
background-color: $color-conversation-green-tint;
}
.module-quote--outgoing-light_green {
border-left-color: $color-conversation-light_green;
background-color: $color-conversation-light_green-tint;
}
.module-quote--outgoing-blue_grey {
border-left-color: $color-conversation-blue_grey;
background-color: $color-conversation-blue_grey-tint;
}
.module-quote--incoming { .module-quote--incoming {
border-left-color: $color-white; border-left-color: $color-white;
background-color: $color-conversation-grey-tint; background-color: $color-conversation-grey-tint;
} }
.module-quote--incoming-red {
background-color: $color-conversation-red-tint;
}
.module-quote--incoming-deep_orange {
background-color: $color-conversation-deep_orange-tint;
}
.module-quote--incoming-brown {
background-color: $color-conversation-brown-tint;
}
.module-quote--incoming-pink {
background-color: $color-conversation-pink-tint;
}
.module-quote--incoming-purple {
background-color: $color-conversation-purple-tint;
}
.module-quote--incoming-indigo {
background-color: $color-conversation-indigo-tint;
}
.module-quote--incoming-blue {
background-color: $color-conversation-blue-tint;
}
.module-quote--incoming-teal {
background-color: $color-conversation-teal-tint;
}
.module-quote--incoming-green {
background-color: $color-conversation-green-tint;
}
.module-quote--incoming-light_green {
background-color: $color-conversation-light_green-tint;
}
.module-quote--incoming-blue_grey {
background-color: $color-conversation-blue_grey-tint;
}
.module-quote__primary { .module-quote__primary {
flex-grow: 1; flex-grow: 1;
@ -1239,7 +1116,10 @@
.module-group-notification__change, .module-group-notification__change,
.module-timer-notification__message { .module-timer-notification__message {
background-color: #212121; @include themify($themes) {
background: themed('fakeChatBubbleBackground');
color: themed('textColor');
}
width: 90%; width: 90%;
max-width: 700px; max-width: 700px;
margin: 10px auto; margin: 10px auto;
@ -1447,11 +1327,6 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
color: $color-gray-90;
background-color: $color-white;
border-bottom: 1px solid $color-black-02;
} }
.module-conversation-header__back-icon { .module-conversation-header__back-icon {
@ -3271,8 +3146,6 @@
// Module: Left Pane // Module: Left Pane
.module-left-pane { .module-left-pane {
border-right: 1px solid $color-dark-90;
display: inline-flex; display: inline-flex;
flex-direction: column; flex-direction: column;
width: 380px; width: 380px;

22
stylesheets/_session.scss
Unescape Escape View File

@ -775,9 +775,10 @@ label {
height: 25px; height: 25px;
padding: $session-margin-md $session-margin-sm; padding: $session-margin-md $session-margin-sm;
background-color: $session-shade-4; @include themify($themes) {
background: themed('contextMenuBackground');
color: $session-color-white; color: themed('textColor');
}
font-family: $session-font-accent; font-family: $session-font-accent;
font-size: $session-font-sm; font-size: $session-font-sm;
line-height: $session-icon-size-sm; line-height: $session-icon-size-sm;
@ -785,7 +786,9 @@ label {
&--active, &--active,
&--selected { &--selected {
background-color: $session-shade-7 !important; @include themify($themes) {
background: themed('clickableHovered');
}
} }
&:active, &:active,
&:visited, &:visited,
@ -1292,6 +1295,7 @@ label {
textarea.send-message { textarea.send-message {
@include themify($themes) { @include themify($themes) {
background: themed('composeViewBackground'); background: themed('composeViewBackground');
color: themed('textColor');
} }
border: none; border: none;
margin: 0px; margin: 0px;
@ -1299,8 +1303,6 @@ label {
font-size: $session-font-md; font-size: $session-font-md;
line-height: 1.3em; line-height: 1.3em;
align-self: center; align-self: center;
@include session-color-subtle($session-color-white);
} }
} }
@ -1499,10 +1501,14 @@ input {
&-item { &-item {
font-family: $session-font-default; font-family: $session-font-default;
padding: $session-margin-sm $session-margin-md; padding: $session-margin-sm $session-margin-md;
background-color: $session-shade-5; @include themify($themes) {
background-color: themed('cellBackground');
}
&:hover:not(.member-selected) { &:hover:not(.member-selected) {
background-color: $session-shade-7; @include themify($themes) {
background-color: themed('clickableHovered');
}
} }
} }

1
stylesheets/_session_left_pane.scss
Unescape Escape View File

@ -102,7 +102,6 @@ $session-compose-margin: 20px;
} }
.module-left-pane { .module-left-pane {
border-right: 1px solid rgba($session-color-white, 0.1) !important;
width: $session-left-pane-width; width: $session-left-pane-width;
position: relative; position: relative;
height: -webkit-fill-available; height: -webkit-fill-available;

85
stylesheets/_session_theme.scss
Unescape Escape View File

@ -2,11 +2,8 @@
@import 'themes.scss'; @import 'themes.scss';
.discussion-container { .discussion-container {
@at-root .light-theme #{&} { @include themify($themes) {
background-color: $session-color-white; background: none;
}
@at-root .dark-theme #{&} {
background-color: $session-shade-2;
} }
} }
@ -14,50 +11,74 @@
background: none !important; background: none !important;
} }
.module-conversation-header { .module-conversation-header {
@at-root .light-theme #{&} { @include themify($themes) {
background-color: $session-color-white; background: themed('cellBackground');
}
@at-root .dark-theme #{&} {
background-color: $session-shade-4;
} }
border-bottom: none;
} }
.module-message { .module-message {
&__author, &__text-error {
&__metadata__badge, font-style: italic;
&__metadata__date--incoming,
&__metadata__date--outgoing {
@at-root .light-theme #{&} {
@include session-color-subtle($session-color-black);
}
@at-root .dark-theme #{&} {
@include session-color-subtle($session-color-white);
}
} }
&__container--incoming { &__container--incoming {
@at-root .light-theme #{&} { @include themify($themes) {
@include session-color-subtle($session-color-white); background: themed('receivedMessageBackground');
background-color: $session-shade-8;
} }
@at-root .dark-theme #{&} {
background-color: $session-shade-8; .module-message__text {
@include themify($themes) {
color: themed('receivedMessageText');
}
a {
text-decoration: underline;
@include themify($themes) {
color: themed('receivedMessageText');
}
}
}
.module-message__author,
.module-message__metadata,
.module-message__metadata__date,
.module-message__metadata__badge,
.module-message__metadata__badge--separator {
@include themify($themes) {
@include session-color-subtle(themed('receivedMessageText'));
}
} }
} }
&__container--outgoing { &__container--outgoing {
@at-root .light-theme #{&} { @include themify($themes) {
background-color: $session-color-white; background: themed('sentMessageBackground');
} }
@at-root .dark-theme #{&} {
background-color: $session-shade-11; .module-message__text {
@include themify($themes) {
color: themed('sentMessageText');
}
a {
text-decoration: underline;
@include themify($themes) {
color: themed('sentMessageText');
}
}
}
.module-message__author,
.module-message__metadata,
.module-message__metadata__date,
.module-message__metadata__badge,
.module-message__metadata__badge--separator {
@include themify($themes) {
@include session-color-subtle(themed('sentMessageText'));
}
} }
} }
&__container { &__container {
transition: background-color 0.25s; transition: background-color $session-transition-duration;
box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.69);
} }
} }

286
stylesheets/_theme_dark.scss
Unescape Escape View File

@ -555,53 +555,6 @@ body.dark-theme {
@include color-svg('../images/error.svg', $color-core-red); @include color-svg('../images/error.svg', $color-core-red);
} }
.module-message__container--outgoing {
background-color: $color-dark-70;
}
// In case the color gets messed up
.module-message__container--incoming {
background-color: $color-conversation-grey;
}
.module-message__container--incoming-red {
background-color: $color-conversation-red;
}
.module-message__container--incoming-deep_orange {
background-color: $color-conversation-deep_orange;
}
.module-message__container--incoming-brown {
background-color: $color-conversation-brown;
}
.module-message__container--incoming-pink {
background-color: $color-conversation-pink;
}
.module-message__container--incoming-purple {
background-color: $color-conversation-purple;
}
.module-message__container--incoming-indigo {
background-color: $color-conversation-indigo;
}
.module-message__container--incoming-blue {
background-color: $color-conversation-blue;
}
.module-message__container--incoming-teal {
background-color: $color-conversation-teal;
}
.module-message__container--incoming-green {
background-color: $color-conversation-green;
}
.module-message__container--incoming-light_green {
background-color: $color-conversation-light_green;
}
.module-message__container--incoming-blue_grey {
background-color: $color-conversation-blue_grey;
}
.module-message__attachment-container {
background-color: $color-gray-95;
}
.module-message__img-border-overlay { .module-message__img-border-overlay {
box-shadow: inset 0px 0px 0px 1px $color-white-015; box-shadow: inset 0px 0px 0px 1px $color-white-015;
} }
@ -651,10 +604,6 @@ body.dark-theme {
color: $color-white; color: $color-white;
} }
.module-message__generic-attachment__icon {
// background: url('../images/file-gradient.svg') no-repeat center;
}
.module-message__generic-attachment__file-name { .module-message__generic-attachment__file-name {
color: $color-dark-05; color: $color-dark-05;
} }
@ -688,31 +637,7 @@ body.dark-theme {
.module-message__link-preview__location { .module-message__link-preview__location {
color: $color-gray-25; color: $color-gray-25;
} }
.module-conversation__user,
.module-message__author {
color: $color-white;
}
.module-message__text {
color: $color-dark-05;
a {
color: $color-dark-05;
}
}
.module-message__text--incoming {
color: $color-white;
a {
color: $color-white;
}
}
.module-message__metadata__date {
color: $color-white-08;
}
.module-message__metadata__date--incoming {
color: $color-white-08;
}
.module-message__metadata__date--with-image-no-caption { .module-message__metadata__date--with-image-no-caption {
color: $color-white-08; color: $color-white-08;
} }
@ -801,132 +726,20 @@ body.dark-theme {
} }
// Module: Quoted Reply // Module: Quoted Reply
.module-quote--outgoing { .module-quote--outgoing {
border-left-color: $color-conversation-grey; border-left-color: $color-conversation-grey;
background-color: $color-conversation-grey-shade; background-color: $color-conversation-grey-shade;
} }
.module-quote--outgoing-red {
border-left-color: $color-conversation-red;
background-color: $color-conversation-red-shade;
}
.module-quote--outgoing-deep_orange {
border-left-color: $color-conversation-deep_orange;
background-color: $color-conversation-deep_orange-shade;
}
.module-quote--outgoing-brown {
border-left-color: $color-conversation-brown;
background-color: $color-conversation-brown-shade;
}
.module-quote--outgoing-pink {
border-left-color: $color-conversation-pink;
background-color: $color-conversation-pink-shade;
}
.module-quote--outgoing-purple {
border-left-color: $color-conversation-purple;
background-color: $color-conversation-purple-shade;
}
.module-quote--outgoing-indigo {
border-left-color: $color-conversation-indigo;
background-color: $color-conversation-indigo-shade;
}
.module-quote--outgoing-blue {
border-left-color: $color-conversation-blue;
background-color: $color-conversation-blue-shade;
}
.module-quote--outgoing-teal {
border-left-color: $color-conversation-teal;
background-color: $color-conversation-teal-shade;
}
.module-quote--outgoing-green {
border-left-color: $color-conversation-green;
background-color: $color-conversation-green-shade;
}
.module-quote--outgoing-light_green {
border-left-color: $color-conversation-light_green;
background-color: $color-conversation-light_green-shade;
}
.module-quote--outgoing-blue_grey {
border-left-color: $color-conversation-blue_grey;
background-color: $color-conversation-blue_grey-shade;
}
.module-quote--incoming { .module-quote--incoming {
border-left-color: $color-black; border-left-color: $color-black;
background-color: $color-conversation-grey-shade; background-color: $color-conversation-grey-shade;
} }
.module-quote--incoming-red {
background-color: $color-conversation-red-shade;
}
.module-quote--incoming-deep_orange {
background-color: $color-conversation-deep_orange-shade;
}
.module-quote--incoming-brown {
background-color: $color-conversation-brown-shade;
}
.module-quote--incoming-pink {
background-color: $color-conversation-pink-shade;
}
.module-quote--incoming-purple {
background-color: $color-conversation-purple-shade;
}
.module-quote--incoming-indigo {
background-color: $color-conversation-indigo-shade;
}
.module-quote--incoming-blue {
background-color: $color-conversation-blue-shade;
}
.module-quote--incoming-teal {
background-color: $color-conversation-teal-shade;
}
.module-quote--incoming-green {
background-color: $color-conversation-green-shade;
}
.module-quote--incoming-light_green {
background-color: $color-conversation-light_green-shade;
}
.module-quote--incoming-blue_grey {
background-color: $color-conversation-blue_grey-shade;
}
.module-quote__primary__author { .module-quote__primary__author {
color: $color-dark-05; color: $color-dark-05;
} }
.module-quote__primary__author-red {
color: $color-dark-05;
}
.module-quote__primary__author-deep_orange {
color: $color-dark-05;
}
.module-quote__primary__author-brown {
color: $color-dark-05;
}
.module-quote__primary__author-pink {
color: $color-dark-05;
}
.module-quote__primary__author-purple {
color: $color-dark-05;
}
.module-quote__primary__author-indigo {
color: $color-dark-05;
}
.module-quote__primary__author-blue {
color: $color-dark-05;
}
.module-quote__primary__author-teal {
color: $color-dark-05;
}
.module-quote__primary__author-green {
color: $color-dark-05;
}
.module-quote__primary__author-light_green {
color: $color-dark-05;
}
.module-quote__primary__author-blue_grey {
color: $color-dark-05;
}
.module-quote__primary__text { .module-quote__primary__text {
color: $color-dark-05; color: $color-dark-05;
@ -1087,12 +900,6 @@ body.dark-theme {
// Module: Conversation Header // Module: Conversation Header
.module-conversation-header {
color: $color-dark-05;
background-color: $color-gray-95;
border-bottom: 1px solid $color-light-60;
}
.module-conversation-header__back-icon { .module-conversation-header__back-icon {
@include color-svg('../images/back.svg', $color-dark-05); @include color-svg('../images/back.svg', $color-dark-05);
} }
@ -1296,49 +1103,8 @@ body.dark-theme {
background-color: $color-conversation-grey-shade; background-color: $color-conversation-grey-shade;
} }
.module-avatar--signal-blue {
background-color: $color-signal-blue;
}
.module-avatar--red {
background-color: $color-conversation-red-shade;
}
.module-avatar--deep_orange {
background-color: $color-conversation-deep_orange-shade;
}
.module-avatar--brown {
background-color: $color-conversation-brown-shade;
}
.module-avatar--pink {
background-color: $color-conversation-pink-shade;
}
.module-avatar--purple {
background-color: $color-conversation-purple-shade;
}
.module-avatar--indigo {
background-color: $color-conversation-indigo-shade;
}
.module-avatar--blue {
background-color: $color-conversation-blue-shade;
}
.module-avatar--teal {
background-color: $color-conversation-teal-shade;
}
.module-avatar--green {
background-color: $color-conversation-green-shade;
}
.module-avatar--light_green {
background-color: $color-conversation-light_green-shade;
}
.module-avatar--blue_grey {
background-color: $color-conversation-blue_grey-shade;
}
// Module: Main Header // Module: Main Header
.module-main-header {
border-bottom: 1px solid $color-gray-75;
}
.module-main-header__search__input { .module-main-header__search__input {
background-color: $color-gray-95; background-color: $color-gray-95;
border-radius: 14px; border-radius: 14px;
@ -1542,58 +1308,6 @@ body.dark-theme {
color: $color-gray-05; color: $color-gray-05;
} }
// Module: Left Pane
.module-left-pane {
background-color: $color-dark-85;
border-right: 1px solid $color-gray-75;
}
.module-left-pane__archive-header {
border-bottom: 1px solid $color-gray-75;
}
.module-left-pane__to-inbox-button {
background-color: $color-gray-25;
}
.module-left-pane__archive-header-text {
color: $color-gray-05;
}
.module-left-pane__archive-helper-text {
color: $color-gray-25;
background-color: $color-gray-75;
}
.module-left-pane__archived-button {
color: $color-gray-25;
&:hover {
background-color: $color-gray-75;
}
}
.module-left-pane__archived-button__archived-count {
color: $color-gray-25;
background-color: $color-gray-75;
}
// Module: Start New Conversation
.module-start-new-conversation {
&:hover {
background-color: $color-dark-70;
}
}
.module-start-new-conversation__number {
color: $color-gray-05;
}
.module-start-new-conversation__text {
color: $color-gray-45;
}
// Third-party module: react-contextmenu // Third-party module: react-contextmenu
.react-contextmenu { .react-contextmenu {

18
stylesheets/themes.scss
Unescape Escape View File

@ -1,5 +1,3 @@
// copy pasted from the android Session app. Some might not be used and some might be missing
// also, some are sometimes applied with a opacity setting (most likely 0.6)
$themes: ( $themes: (
light: ( light: (
accent: #00e97b, accent: #00e97b,
@ -13,8 +11,6 @@ $themes: (
modalBackground: #fcfcfc, modalBackground: #fcfcfc,
modalBorder: #212121, modalBorder: #212121,
fakeChatBubbleBackground: #f5f5f5, fakeChatBubbleBackground: #f5f5f5,
fakeChatBubbleText: #000,
newConversationButtonShadow: hsl(151, 89%, 26%),
// input // input
inputBackground: #8e8e931f, inputBackground: #8e8e931f,
// text // text
@ -33,7 +29,9 @@ $themes: (
composeViewBackground: #fcfcfc, composeViewBackground: #fcfcfc,
composeViewTextFieldBackground: #ededed, composeViewTextFieldBackground: #ededed,
receivedMessageBackground: #f5f5f5, receivedMessageBackground: #f5f5f5,
sentMessageBackground: #00e97b, sentMessageBackground: #272726,
receivedMessageText: #000,
sentMessageText: #fff,
// left pane // left pane
conversationList: #fff, conversationList: #fff,
conversationItemHasUnread: #fcfcfc, conversationItemHasUnread: #fcfcfc,
@ -47,6 +45,8 @@ $themes: (
// pill divider: // pill divider:
pillDividerColor: #0000001a, pillDividerColor: #0000001a,
pillDividerTextColor: #555, pillDividerTextColor: #555,
// context menu
contextMenuBackground: #f5f5f5,
), ),
dark: ( dark: (
accent: #00f782, accent: #00f782,
@ -59,9 +59,7 @@ $themes: (
buttonBackground: #1b1b1b, buttonBackground: #1b1b1b,
modalBackground: #101011, modalBackground: #101011,
modalBorder: #212121, modalBorder: #212121,
fakeChatBubbleBackground: #3f4146, fakeChatBubbleBackground: #212121,
fakeChatBubbleText: #000,
newConversationButtonShadow: #077c44,
// input // input
inputBackground: #8e8e931f, inputBackground: #8e8e931f,
// text // text
@ -81,6 +79,8 @@ $themes: (
composeViewTextFieldBackground: #141414, composeViewTextFieldBackground: #141414,
receivedMessageBackground: #222325, receivedMessageBackground: #222325,
sentMessageBackground: #3f4146, sentMessageBackground: #3f4146,
receivedMessageText: #fff,
sentMessageText: #fff,
// left pane // left pane
conversationList: #1b1b1b, conversationList: #1b1b1b,
conversationItemHasUnread: #2c2c2c, conversationItemHasUnread: #2c2c2c,
@ -94,6 +94,8 @@ $themes: (
// pill divider: // pill divider:
pillDividerColor: #353535, pillDividerColor: #353535,
pillDividerTextColor: #a0a0a0, pillDividerTextColor: #a0a0a0,
// context menu
contextMenuBackground: #212121,
), ),
); );

5
ts/components/conversation/Message.tsx
Unescape Escape View File

@ -1162,10 +1162,7 @@ export class Message extends React.PureComponent<Props, State> {
<div <div
className={classNames( className={classNames(
'module-message__container', 'module-message__container',
`module-message__container--${direction}`, `module-message__container--${direction}`
isIncoming
? `module-message__container--incoming-${authorColor}`
: null
)} )}
style={{ style={{
width: isShowingImage ? width : undefined, width: isShowingImage ? width : undefined,

3
ts/components/conversation/Quote.tsx
Unescape Escape View File

@ -389,9 +389,6 @@ export class Quote extends React.Component<Props, State> {
className={classNames( className={classNames(
'module-quote', 'module-quote',
isIncoming ? 'module-quote--incoming' : 'module-quote--outgoing', isIncoming ? 'module-quote--incoming' : 'module-quote--outgoing',
isIncoming
? `module-quote--incoming-${authorColor}`
: `module-quote--outgoing-${authorColor}`,
!onClick ? 'module-quote--no-click' : null, !onClick ? 'module-quote--no-click' : null,
withContentAbove ? 'module-quote--with-content-above' : null, withContentAbove ? 'module-quote--with-content-above' : null,
referencedMessageNotFound referencedMessageNotFound

3
ts/components/conversation/TypingBubble.tsx
Unescape Escape View File

@ -59,8 +59,7 @@ export class TypingBubble extends React.Component<Props> {
<div <div
className={classNames( className={classNames(
'module-message__container', 'module-message__container',
'module-message__container--incoming', 'module-message__container--incoming'
`module-message__container--incoming-${color}`
)} )}
> >
<div className="module-message__typing-container"> <div className="module-message__typing-container">

Write Preview
Loading…
Cancel
Save