ConverseJS theme: Fix margin when hidding avatars.

This commit is contained in:
John Livingston 2021-11-22 14:50:55 +01:00
parent 01faeb2d4d
commit d45893a22c
No known key found for this signature in database
GPG Key ID: B17B5640CE66CDBC
2 changed files with 14 additions and 6 deletions

View File

@ -8,7 +8,7 @@ module.exports = {
rules: { rules: {
'selector-class-pattern': [ 'selector-class-pattern': [
// extending the kebab-case to accept ConverseJS class names. // extending the kebab-case to accept ConverseJS class names.
'^([a-z][a-z0-9]*)(-[a-z0-9]+)*(__[a-z]+)?$', '^([a-z][a-z0-9]*)(-[a-z0-9]+)*((__|--)[a-z]+(-[a-z0-9]+)*)?$',
{ {
message: 'Expected class selector to be kebab-case, or ConverseJS-style.', message: 'Expected class selector to be kebab-case, or ConverseJS-style.',
} }

View File

@ -2,15 +2,23 @@
// hidding avatars when screen width is not big enough. // hidding avatars when screen width is not big enough.
@media screen and (max-width: 576px) { @media screen and (max-width: 576px) {
.message { .message {
&.chat-msg {
.chat-msg__content { .chat-msg__content {
width: 100%; width: 100%;
} }
&.chat-msg--followup {
&.chat-msg--with-avatar .chat-msg__content {
margin-left: 0.5em;
}
}
.chat-msg__avatar { .chat-msg__avatar {
display: none; display: none;
} }
} }
} }
}
// Bigger occupants sidebar when width is not big enough. // Bigger occupants sidebar when width is not big enough.
@media screen and (max-width: 576px) { @media screen and (max-width: 576px) {