diff options
author | Pierre Rudloff <contact@rudloff.pro> | 2017-04-19 03:21:52 +0200 |
---|---|---|
committer | Joram Wilander <jwawilander@gmail.com> | 2017-04-18 21:21:52 -0400 |
commit | bc906abd6672efbe9b755a4edd5dbc5f7a39761f (patch) | |
tree | 30dd27a17546d72378313847ba51c66edc12bb79 /webapp | |
parent | 5398c82e1b80c3160974e01afabbfd1c2a2420a7 (diff) | |
download | chat-bc906abd6672efbe9b755a4edd5dbc5f7a39761f.tar.gz chat-bc906abd6672efbe9b755a4edd5dbc5f7a39761f.tar.bz2 chat-bc906abd6672efbe9b755a4edd5dbc5f7a39761f.zip |
Move "Start Video Call" option to the bottom of the profile popover (#5853)
Diffstat (limited to 'webapp')
-rw-r--r-- | webapp/components/profile_popover.jsx | 29 | ||||
-rw-r--r-- | webapp/sass/components/_popover.scss | 19 | ||||
-rw-r--r-- | webapp/sass/components/_webrtc.scss | 13 |
3 files changed, 24 insertions, 37 deletions
diff --git a/webapp/components/profile_popover.jsx b/webapp/components/profile_popover.jsx index c86de514e..63bd99ac4 100644 --- a/webapp/components/profile_popover.jsx +++ b/webapp/components/profile_popover.jsx @@ -118,9 +118,7 @@ export default class ProfilePopover extends React.Component { if (webrtcEnabled && this.props.user.id !== this.state.currentUserId) { const isOnline = this.props.status !== UserStatuses.OFFLINE; let webrtcMessage; - let circleClass = 'offline'; if (isOnline && !this.props.isBusy) { - circleClass = ''; webrtcMessage = ( <FormattedMessage id='user_profile.webrtc.call' @@ -143,32 +141,20 @@ export default class ProfilePopover extends React.Component { ); } - const webrtcTooltip = ( - <Tooltip id='webrtcTooltip'>{webrtcMessage}</Tooltip> - ); - webrtc = ( <div - className='webrtc__user-profile' + data-toggle='tooltip' key='makeCall' + className='popover__row' > <a href='#' + className='text-nowrap user-popover__email' onClick={() => this.initWebrtc()} disabled={!isOnline} > - <OverlayTrigger - delayShow={Constants.WEBRTC_TIME_DELAY} - placement='top' - overlay={webrtcTooltip} - > - <div - id='webrtc-btn' - className={'webrtc__button ' + circleClass} - > - <span dangerouslySetInnerHTML={{__html: Constants.VIDEO_ICON}}/> - </div> - </OverlayTrigger> + <i className='fa fa-video-camera'/> + {webrtcMessage} </a> </div> ); @@ -219,8 +205,6 @@ export default class ProfilePopover extends React.Component { ); } - dataContent.push(webrtc); - const email = this.props.user.email; if (global.window.mm_config.ShowEmailAddress === 'true' || UserStore.isSystemAdminForCurrentUser() || this.props.user === UserStore.getCurrentUser()) { dataContent.push( @@ -244,7 +228,7 @@ export default class ProfilePopover extends React.Component { <div data-toggle='tooltip' key='user-popover-dm' - className='popover__row' + className='popover__row first' > <a href='#' @@ -259,6 +243,7 @@ export default class ProfilePopover extends React.Component { </a> </div> ); + dataContent.push(webrtc); } return ( diff --git a/webapp/sass/components/_popover.scss b/webapp/sass/components/_popover.scss index 93b567ad3..610cdb31d 100644 --- a/webapp/sass/components/_popover.scss +++ b/webapp/sass/components/_popover.scss @@ -36,10 +36,14 @@ } .popover__row { - border-top: 1px solid transparent; - margin: 9px -15px 0; + margin: 0 -15px 0; padding: 9px 15px 0; + &.first { + border-top: 1px solid transparent; + margin-top: 9px; + } + > a { > i { margin-right: 5px; @@ -80,6 +84,17 @@ max-width: 200px; overflow: hidden; text-overflow: ellipsis; + + &[disabled] { + color: $video-circle-offline; + + &:focus, + &:hover { + color: $video-circle-offline; + text-decoration: none; + } + } + } .search-help-popover { diff --git a/webapp/sass/components/_webrtc.scss b/webapp/sass/components/_webrtc.scss index a36fb1c95..c127bc5cc 100644 --- a/webapp/sass/components/_webrtc.scss +++ b/webapp/sass/components/_webrtc.scss @@ -1,18 +1,5 @@ @charset 'UTF-8'; -.webrtc__user-profile { - @include webrtc-button; - position: absolute; - right: 7px; - text-align: center; - top: 5px; - - #webrtc-btn { - height: 23px; - width: 23px; - } -} - .webrtc__header { @include webrtc-button; float: left; |