|
|
|
@ -1,92 +1,101 @@
|
|
|
|
|
// Messages
|
|
|
|
|
.dark-theme {
|
|
|
|
|
.conversation {
|
|
|
|
|
background: none !important;
|
|
|
|
|
|
|
|
|
|
.discussion-container {
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-2;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.conversation {
|
|
|
|
|
background: none !important;
|
|
|
|
|
}
|
|
|
|
|
.module-conversation-header {
|
|
|
|
|
border-bottom: none;
|
|
|
|
|
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-4;
|
|
|
|
|
}
|
|
|
|
|
.module-conversation-header {
|
|
|
|
|
border-bottom: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.module-message {
|
|
|
|
|
&__author,
|
|
|
|
|
&__metadata__badge,
|
|
|
|
|
&__metadata__date--incoming,
|
|
|
|
|
&__metadata__date--outgoing {
|
|
|
|
|
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
@include session-color-subtle($session-color-black);
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-4;
|
|
|
|
|
@include session-color-subtle($session-color-white);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.module-message {
|
|
|
|
|
&__author,
|
|
|
|
|
&__metadata__badge,
|
|
|
|
|
&__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 {
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
@include session-color-subtle($session-color-white);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&__container--incoming {
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
@include session-color-subtle($session-color-white);
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-11;
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-11;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&__container--outgoing {
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-11;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&__container--outgoing {
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&__container {
|
|
|
|
|
transition: background-color 0.25s;
|
|
|
|
|
box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.69);
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-shade-11;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.message {
|
|
|
|
|
&-highlighted {
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-shade-5;
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
&__container {
|
|
|
|
|
transition: background-color 0.25s;
|
|
|
|
|
box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.69);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&-selected {
|
|
|
|
|
.module-message {
|
|
|
|
|
&__container {
|
|
|
|
|
background-image: $session-gradient-green;
|
|
|
|
|
box-shadow: $session-dark-shadow;
|
|
|
|
|
}
|
|
|
|
|
.message {
|
|
|
|
|
&-highlighted {
|
|
|
|
|
border-radius: 0;
|
|
|
|
|
|
|
|
|
|
@at-root .light-theme #{&} {
|
|
|
|
|
background-color: $session-shade-5;
|
|
|
|
|
}
|
|
|
|
|
@at-root .dark-theme #{&} {
|
|
|
|
|
background-color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&__author {
|
|
|
|
|
color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
&-selected {
|
|
|
|
|
.module-message {
|
|
|
|
|
&__container {
|
|
|
|
|
background-image: $session-gradient-green;
|
|
|
|
|
box-shadow: $session-dark-shadow;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&-read-receipt-container {
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
&__author {
|
|
|
|
|
color: $session-color-white;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.inbox {
|
|
|
|
|
background-image: $session-gradient-black;
|
|
|
|
|
&-read-receipt-container {
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.inbox {
|
|
|
|
|
background-image: $session-gradient-black;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.conversation {
|
|
|
|
|
background: none !important;
|
|
|
|
|
}
|
|
|
|
|