diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/component.jsx index 6548ab3a9970727e627d746b23436dcb5b1a17d0..7e3ef9bf218ac075d8070bd4c7aed915f5f85921 100755 --- a/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/component.jsx @@ -5,12 +5,16 @@ import styles from '../styles.scss'; export default class MuteAudio extends React.Component { render() { - const { isInAudio, isMuted, callback } = this.props; + const { isInAudio, isMuted, callback, isTalking} = this.props; let label = !isMuted ? 'Mute' : 'Unmute'; let icon = !isMuted ? 'audio-off' : 'audio'; let className = !isInAudio ? styles.invisible : null; let tabIndex = !isInAudio ? -1 : 0; + if (isInAudio && isTalking) { + className = styles.circleGlow; + } + return ( <Button onClick={callback} diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/container.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/container.jsx index 9a8ad360884ad3df95df95a425e9b378de2d36c7..176bf187d38acda731c39b2ab0719dbf6e3acc7d 100755 --- a/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/container.jsx +++ b/bigbluebutton-html5/imports/ui/components/actions-bar/mute-button/container.jsx @@ -19,6 +19,8 @@ export default createContainer((params) => { const user = Users.findOne({ userId: userId }).user; const isMuted = user.voiceUser.muted; const isInAudio = user.voiceUser.joined; + const isTalking = user.voiceUser.talking; + let callback = () => {}; if (isInAudio && !isMuted) { @@ -33,6 +35,7 @@ export default createContainer((params) => { isInAudio, isMuted, callback, + isTalking, }; return data; }, MuteAudioContainer); diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/styles.scss b/bigbluebutton-html5/imports/ui/components/actions-bar/styles.scss index 04f69baa3d0c52de8347bfeea400d4ccc552508d..08cabd778238c58c5c85cb6219d3971b9eec43e4 100755 --- a/bigbluebutton-html5/imports/ui/components/actions-bar/styles.scss +++ b/bigbluebutton-html5/imports/ui/components/actions-bar/styles.scss @@ -30,3 +30,7 @@ .invisible { visibility: hidden; } + +.circleGlow > :first-child{ + box-shadow: 0 0 .15rem #FFF !important; +} diff --git a/bigbluebutton-html5/imports/ui/components/button/component.jsx b/bigbluebutton-html5/imports/ui/components/button/component.jsx index 3b0f03e635a0b9a5ae1ff03fcab0ab3bbd1c8e07..c4f16c1efce238043b65398351cb48884d12c65d 100755 --- a/bigbluebutton-html5/imports/ui/components/button/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/button/component.jsx @@ -95,6 +95,7 @@ export default class Button extends BaseButton { } = this.props; let propClassNames = {}; + propClassNames[styles.button] = true; propClassNames[styles[size]] = true; propClassNames[styles[color]] = true; diff --git a/bigbluebutton-html5/imports/ui/components/button/styles.scss b/bigbluebutton-html5/imports/ui/components/button/styles.scss index bc164c369610a585253c0290258690b1d1937f98..4d7b84befbd7a34c5ef5a8964481c52ebe7fea9b 100755 --- a/bigbluebutton-html5/imports/ui/components/button/styles.scss +++ b/bigbluebutton-html5/imports/ui/components/button/styles.scss @@ -259,7 +259,6 @@ $btn-jumbo-padding: $jumbo-padding-y $jumbo-padding-x; } } - .circle { $btn-sm-padding-x: nth($btn-sm-padding, 2) / 2.75; $btn-md-padding-x: nth($btn-md-padding, 2) / 2.75;