diff options
author | Sudheer <sudheer.105@gmail.com> | 2017-08-21 19:42:40 +0530 |
---|---|---|
committer | Harrison Healey <harrisonmhealey@gmail.com> | 2017-08-21 10:12:40 -0400 |
commit | b2e53086b3b4527af04d4689f0d836fefd10f8fb (patch) | |
tree | e365d0b520a6e3b0532f6de5faa73f37e8af5974 /webapp/components/sidebar_header_dropdown_button.jsx | |
parent | 2986c384690951b2e87c016efaa6f447d844e6b2 (diff) | |
download | chat-b2e53086b3b4527af04d4689f0d836fefd10f8fb.tar.gz chat-b2e53086b3b4527af04d4689f0d836fefd10f8fb.tar.bz2 chat-b2e53086b3b4527af04d4689f0d836fefd10f8fb.zip |
PLT-5747: Fixed inconsistent on-hover, tooltip, and active states for buttons. (#7174)
* Fixed LHS Team Sidebar on hover highlight.
* Fixed LHS Main Menu on hover tooltip to show "Main menu".
* Added On-hover highlight for Favorite button in channel heading.
* Added active state for channel members icon.
* Added active class based on internal react state with new changeCss rule.
* Changed cursor to pointer on hovering a theme.
* Fixed Invite New Member Add Button to have text-underline on hover.
Diffstat (limited to 'webapp/components/sidebar_header_dropdown_button.jsx')
-rw-r--r-- | webapp/components/sidebar_header_dropdown_button.jsx | 39 |
1 files changed, 28 insertions, 11 deletions
diff --git a/webapp/components/sidebar_header_dropdown_button.jsx b/webapp/components/sidebar_header_dropdown_button.jsx index 45e40f655..82dd6eccf 100644 --- a/webapp/components/sidebar_header_dropdown_button.jsx +++ b/webapp/components/sidebar_header_dropdown_button.jsx @@ -6,6 +6,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import Constants from 'utils/constants.jsx'; +import {Tooltip, OverlayTrigger} from 'react-bootstrap'; +import {FormattedMessage} from 'react-intl'; export default class SidebarHeaderDropdownButton extends React.PureComponent { static propTypes = { @@ -14,19 +16,34 @@ export default class SidebarHeaderDropdownButton extends React.PureComponent { }; render() { + const mainMenuToolTip = ( + <Tooltip id='main-menu__tooltip'> + <FormattedMessage + id='sidebar.mainMenu' + defaultMessage='Main menu' + /> + </Tooltip> + ); + return ( - <a - href='#' - id='sidebarHeaderDropdownButton' - className='sidebar-header-dropdown__toggle' - onClick={this.props.onClick} + <OverlayTrigger + trigger={['hover', 'focus']} + delayShow={Constants.OVERLAY_TIME_DELAY} + placement='right' + overlay={mainMenuToolTip} > - <span - className='sidebar-header-dropdown__icon' - dangerouslySetInnerHTML={{__html: Constants.MENU_ICON}} - /> - </a> + <a + href='#' + id='sidebarHeaderDropdownButton' + className='sidebar-header-dropdown__toggle' + onClick={this.props.onClick} + > + <span + className='sidebar-header-dropdown__icon' + dangerouslySetInnerHTML={{__html: Constants.MENU_ICON}} + /> + </a> + </OverlayTrigger> ); } } - |