From c44b8d452b30144ddc342bf35ef6bb694ca91610 Mon Sep 17 00:00:00 2001
From: Chad Pilkey <capilkey@gmail.com>
Date: Fri, 6 Mar 2020 12:41:23 -0800
Subject: [PATCH] fix the spacing in the typing indicator
---
.../ui/components/chat/message-form/styles.scss | 6 +-----
.../message-form/typing-indicator/component.jsx | 15 +++++++++------
2 files changed, 10 insertions(+), 11 deletions(-)
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-form/styles.scss b/bigbluebutton-html5/imports/ui/components/chat/message-form/styles.scss
index 5055a9eef8..d7cb8563b9 100755
--- a/bigbluebutton-html5/imports/ui/components/chat/message-form/styles.scss
+++ b/bigbluebutton-html5/imports/ui/components/chat/message-form/styles.scss
@@ -110,15 +110,11 @@
[dir="rtl"] & {
text-align: right;
}
-
- &:before {
- content: "\00a0"; // non-breaking space
- }
}
.spacer {
&:before {
- content: none;
+ content: "\00a0"; // non-breaking space
}
}
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-form/typing-indicator/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-form/typing-indicator/component.jsx
index aa0195b564..45887ee41e 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/message-form/typing-indicator/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/message-form/typing-indicator/component.jsx
@@ -94,16 +94,19 @@ class TypingIndicator extends PureComponent {
render() {
const {
error,
+ indicatorEnabled,
} = this.props;
- const style = {};
- style[styles.error] = !!error;
- style[styles.info] = !error;
- style[styles.spacer] = !!this.renderTypingElement();
+ const typingElement = this.renderTypingElement();
+
+ const showSpacer = (indicatorEnabled ? !typingElement : !error);
return (
- <div className={cx(style)}>
- <span className={styles.typingIndicator}>{error || this.renderTypingElement()}</span>
+ <div className={cx(styles.info, (showSpacer && styles.spacer))}>
+ <div className={styles.typingIndicator}>{typingElement}</div>
+ {error
+ && <div className={cx(styles.typingIndicator, styles.error)}>{error}</div>
+ }
</div>
);
}
--
GitLab