Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Don't nest chat-msg__txt inside converse-chat-message-body

Browse Source 
instead just set the classes directly on the custom element

As far as I can tell, this fixes #1346 (or it was fixed already)
This commit is contained in:
JC Brand 2020-06-12 13:30:33 +02:00
parent 59a5acf249
commit de583cbd32
3 changed files with 4 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
sass/_messages.scss
View File

@ -164,7 +164,7 @@
}
converse-chat-message-body {
display: inline-block;
display: inline;
}
.chat-msg__message {
@ -193,7 +193,6 @@
.chat-msg__text {
color: var(--message-text-color);
padding: 0;
width: 100%;
white-space: pre-wrap;
word-wrap: break-word;
word-break: break-word;

11
src/components/message-body.js
View File

@ -1,15 +1,11 @@
import { CustomElement } from './element.js';
import { renderBodyText } from './../templates/directives/body';
import { html } from 'lit-element';
class MessageBody extends CustomElement {
static get properties () {
return {
is_only_emojis: { type: Boolean },
is_spoiler: { type: Boolean },
is_spoiler_visible: { type: Boolean },
is_me_message: { type: Boolean },
model: { type: Object },
text: { type: String },
@ -17,13 +13,8 @@ class MessageBody extends CustomElement {
}
render () {
const spoiler_classes = this.is_spoiler ? `spoiler ${this.is_spoiler_visible ? '' : 'collapsed'}` : '';
return html`
<div class="chat-msg__text ${this.is_only_emojis ? 'chat-msg__text--larger' : ''} ${spoiler_classes}"
>${renderBodyText(this)}</div>
`;
return renderBodyText(this);
}
}
customElements.define('converse-chat-message-body', MessageBody);

2
src/components/message.js
View File

@ -223,11 +223,13 @@ class Message extends CustomElement {
</a>
</div>
`;
const spoiler_classes = this.is_spoiler ? `spoiler ${this.is_spoiler_visible ? '' : 'collapsed'}` : '';
return html`
${ this.is_spoiler ? tpl_spoiler_hint : '' }
${ this.subject ? html`<div class="chat-msg__subject">${this.subject}</div>` : '' }
<span>
<converse-chat-message-body
class="chat-msg__text ${this.is_only_emojis ? 'chat-msg__text--larger' : ''} ${spoiler_classes}"
.model="${this.model}"
?is_me_message="${this.is_me_message}"
?is_only_emojis="${this.is_only_emojis}"