diff options
Diffstat (limited to 'web/react')
-rw-r--r-- | web/react/components/create_post.jsx | 5 | ||||
-rw-r--r-- | web/react/components/error_bar.jsx | 21 | ||||
-rw-r--r-- | web/react/components/post_info.jsx | 1 | ||||
-rw-r--r-- | web/react/components/sidebar.jsx | 26 | ||||
-rw-r--r-- | web/react/components/user_profile.jsx | 2 | ||||
-rw-r--r-- | web/react/utils/utils.jsx | 6 |
6 files changed, 37 insertions, 24 deletions
diff --git a/web/react/components/create_post.jsx b/web/react/components/create_post.jsx index ed265ab02..f35079383 100644 --- a/web/react/components/create_post.jsx +++ b/web/react/components/create_post.jsx @@ -192,9 +192,12 @@ export default class CreatePost extends React.Component { PostStore.storeCurrentDraft(draft); } resizePostHolder() { - const height = $(window).height() - $(React.findDOMNode(this.refs.topDiv)).height() - $('#error_bar').outerHeight() - 50; + const height = $(window).height() - $(React.findDOMNode(this.refs.topDiv)).height() - 50; $('.post-list-holder-by-time').css('height', `${height}px`); $(window).trigger('resize'); + if ($(window).width() > 960) { + $('#post_textbox').focus(); + } } handleUploadStart(clientIds, channelId) { const draft = PostStore.getDraft(channelId); diff --git a/web/react/components/error_bar.jsx b/web/react/components/error_bar.jsx index b100fd337..6311d9460 100644 --- a/web/react/components/error_bar.jsx +++ b/web/react/components/error_bar.jsx @@ -9,7 +9,6 @@ export default class ErrorBar extends React.Component { this.onErrorChange = this.onErrorChange.bind(this); this.handleClose = this.handleClose.bind(this); - this.resize = this.resize.bind(this); this.prevTimer = null; this.state = ErrorStore.getLastError(); @@ -46,34 +45,14 @@ export default class ErrorBar extends React.Component { return false; } - resize() { - if (this.isValidError(this.state)) { - var height = $(React.findDOMNode(this)).outerHeight(); - height = height < 30 ? 30 : height; - $('body').css('padding-top', height + 'px'); - } else { - $('body').css('padding-top', '0'); - } - } - componentDidMount() { ErrorStore.addChangeListener(this.onErrorChange); - - $(window).resize(() => { - this.resize(); - }); - - this.resize(); } componentWillUnmount() { ErrorStore.removeChangeListener(this.onErrorChange); } - componentDidUpdate() { - this.resize(); - } - onErrorChange() { var newState = ErrorStore.getLastError(); diff --git a/web/react/components/post_info.jsx b/web/react/components/post_info.jsx index 7addd825f..a95095ff6 100644 --- a/web/react/components/post_info.jsx +++ b/web/react/components/post_info.jsx @@ -150,6 +150,7 @@ export default class PostInfo extends React.Component { <ul className='post-header post-info'> <li className='post-header-col'> <OverlayTrigger + delayShow='500' container={this} placement='top' overlay={tooltip} diff --git a/web/react/components/sidebar.jsx b/web/react/components/sidebar.jsx index a1a5b64ba..814b2e264 100644 --- a/web/react/components/sidebar.jsx +++ b/web/react/components/sidebar.jsx @@ -15,6 +15,8 @@ const TeamStore = require('../stores/team_store.jsx'); const UnreadChannelIndicator = require('./unread_channel_indicator.jsx'); const UserStore = require('../stores/user_store.jsx'); const Utils = require('../utils/utils.jsx'); +const Tooltip = ReactBootstrap.Tooltip; +const OverlayTrigger = ReactBootstrap.OverlayTrigger; export default class Sidebar extends React.Component { constructor(props) { @@ -455,14 +457,21 @@ export default class Sidebar extends React.Component { } let closeButton = null; + const removeTooltip = <Tooltip>{'Remove from list'}</Tooltip>; if (handleClose && !badge) { closeButton = ( + <OverlayTrigger + delayShow='1000' + placement='top' + overlay={removeTooltip} + > <span - className='close-btn pull-right small' + className='btn-close' data-close='true' > {'×'} </span> + </OverlayTrigger> ); rowClass = ' has-close'; @@ -545,6 +554,9 @@ export default class Sidebar extends React.Component { showChannelModal = true; } + const createChannelTootlip = <Tooltip>{'Create new channel'}</Tooltip>; + const createGroupTootlip = <Tooltip>{'Create new group'}</Tooltip>; + return ( <div> <NewChannelFlow @@ -579,6 +591,11 @@ export default class Sidebar extends React.Component { <li> <h4> {'Channels'} + <OverlayTrigger + delayShow='500' + placement='top' + overlay={createChannelTootlip} + > <a className='add-channel-btn' href='#' @@ -586,6 +603,7 @@ export default class Sidebar extends React.Component { > {'+'} </a> + </OverlayTrigger> </h4> </li> {publicChannelItems} @@ -606,6 +624,11 @@ export default class Sidebar extends React.Component { <li> <h4> {'Private Groups'} + <OverlayTrigger + delayShow='500' + placement='top' + overlay={createGroupTootlip} + > <a className='add-channel-btn' href='#' @@ -613,6 +636,7 @@ export default class Sidebar extends React.Component { > {'+'} </a> + </OverlayTrigger> </h4> </li> {privateChannelItems} diff --git a/web/react/components/user_profile.jsx b/web/react/components/user_profile.jsx index 948f06444..cc6165c1b 100644 --- a/web/react/components/user_profile.jsx +++ b/web/react/components/user_profile.jsx @@ -32,7 +32,7 @@ export default class UserProfile extends React.Component { componentDidMount() { UserStore.addChangeListener(this.onChange); if (!this.props.disablePopover) { - $('#profile_' + this.uniqueId).popover({placement: 'right', container: 'body', trigger: 'hover', html: true, delay: {show: 200, hide: 100}}); + $('#profile_' + this.uniqueId).popover({placement: 'right', container: 'body', trigger: 'click hover', html: true, delay: {show: 200, hide: 100}}); $('body').tooltip({selector: '[data-toggle=tooltip]', trigger: 'hover click'}); } } diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index 91502352e..8f697a9c5 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -473,6 +473,8 @@ export function applyTheme(theme) { if (theme.centerChannelColor) { changeCss('.app__content, .post-create__container .post-create-body .btn-file, .post-create__container .post-create-footer .msg-typing, .command-name, .modal .modal-content, .dropdown-menu, .popover, .mentions-name', 'color:' + theme.centerChannelColor, 1); changeCss('#post-create', 'color:' + theme.centerChannelColor, 2); + changeCss('.channel-header__links a', 'fill:' + changeOpacity(theme.centerChannelColor, 0.7), 1); + changeCss('.channel-header__links a:hover, .channel-header__links a:active', 'fill:' + theme.centerChannelColor, 2); changeCss('.mentions--top, .command-box', 'box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 3); changeCss('.mentions--top, .command-box', '-webkit-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 2); changeCss('.mentions--top, .command-box', '-moz-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px', 1); @@ -485,6 +487,10 @@ export function applyTheme(theme) { changeCss('.channel-header__info>div.dropdown .header-dropdown__icon', 'color:' + changeOpacity(theme.centerChannelColor, 0.8), 1); changeCss('.channel-header #member_popover', 'color:' + changeOpacity(theme.centerChannelColor, 0.8), 1); changeCss('.custom-textarea, .custom-textarea:focus, .preview-container .preview-div, .post-image__column .post-image__details, .sidebar--right .sidebar-right__body, .markdown__table th, .markdown__table td, .command-box, .modal .modal-content, .settings-modal .settings-table .settings-content .divider-light, .dropdown-menu, .modal .modal-header, .popover, .mentions--top .mentions-box', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1); + changeCss('.popover.bottom>.arrow', 'border-bottom-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1); + changeCss('.popover.right>.arrow', 'border-right-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1); + changeCss('.popover.left>.arrow', 'border-left-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1); + changeCss('.popover.top>.arrow', 'border-top-color:' + changeOpacity(theme.centerChannelColor, 0.25), 1); changeCss('.command-name, .popover .popover-title', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1); changeCss('.dropdown-menu .divider', 'background:' + theme.centerChannelColor, 1); changeCss('.custom-textarea', 'color:' + theme.centerChannelColor, 1); |