diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/react/components/posts_view.jsx | 4 | ||||
-rw-r--r-- | web/react/components/posts_view_container.jsx | 4 | ||||
-rw-r--r-- | web/react/components/sidebar.jsx | 4 | ||||
-rw-r--r-- | web/react/components/view_image.jsx | 34 | ||||
-rw-r--r-- | web/react/stores/post_store.jsx | 2 | ||||
-rw-r--r-- | web/react/utils/markdown.jsx | 10 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_modal.scss | 40 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_post.scss | 5 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_responsive.scss | 6 |
9 files changed, 78 insertions, 31 deletions
diff --git a/web/react/components/posts_view.jsx b/web/react/components/posts_view.jsx index ff5044e8e..6b61d465c 100644 --- a/web/react/components/posts_view.jsx +++ b/web/react/components/posts_view.jsx @@ -271,6 +271,7 @@ export default class PostsView extends React.Component { this.updateScrolling(); } window.addEventListener('resize', this.handleResize); + $(this.refs.postlist).perfectScrollbar(); } componentWillUnmount() { window.removeEventListener('resize', this.handleResize); @@ -279,6 +280,7 @@ export default class PostsView extends React.Component { if (this.props.postList != null) { this.updateScrolling(); } + $(this.refs.postlist).perfectScrollbar('update'); } shouldComponentUpdate(nextProps) { if (this.props.isActive !== nextProps.isActive) { @@ -357,7 +359,7 @@ export default class PostsView extends React.Component { return ( <div ref='postlist' - className={'post-list-holder-by-time ' + activeClass} + className={'ps-container post-list-holder-by-time ' + activeClass} onScroll={this.handleScroll} > <div className='post-list__table'> diff --git a/web/react/components/posts_view_container.jsx b/web/react/components/posts_view_container.jsx index 367d3687e..6d6694fec 100644 --- a/web/react/components/posts_view_container.jsx +++ b/web/react/components/posts_view_container.jsx @@ -99,10 +99,12 @@ export default class PostsViewContainer extends React.Component { if (newIndex === -1) { newIndex = channels.length; channels.push(channelId); - postLists[newIndex] = this.getChannelPosts(channelId); atTop[newIndex] = PostStore.getVisibilityAtTop(channelId); } + // make sure we have the latest posts from the store + postLists[newIndex] = this.getChannelPosts(channelId); + this.setState({ currentChannelIndex: newIndex, currentLastViewed: lastViewed, diff --git a/web/react/components/sidebar.jsx b/web/react/components/sidebar.jsx index 30422ff7d..b4c037183 100644 --- a/web/react/components/sidebar.jsx +++ b/web/react/components/sidebar.jsx @@ -173,6 +173,10 @@ export default class Sidebar extends React.Component { this.updateScrollbar(); window.addEventListener('resize', this.handleResize); + + if ($(window).width() > 768) { + $('.nav-pills__container').perfectScrollbar(); + } } shouldComponentUpdate(nextProps, nextState) { if (!Utils.areObjectsEqual(nextState, this.state)) { diff --git a/web/react/components/view_image.jsx b/web/react/components/view_image.jsx index 91f4b3bdc..2b505607e 100644 --- a/web/react/components/view_image.jsx +++ b/web/react/components/view_image.jsx @@ -424,23 +424,27 @@ export default class ViewImageModal extends React.Component { > <div className={'image-wrapper ' + bgClass} - onMouseEnter={this.onMouseEnterImage} - onMouseLeave={this.onMouseLeaveImage} - onClick={(e) => e.stopPropagation()} + onClick={this.props.onModalDismissed} > <div - className={closeButtonClass} - onClick={this.props.onModalDismissed} - /> - {content} - <ViewImagePopoverBar - show={this.state.showFooter} - fileId={this.state.imgId} - totalFiles={this.props.filenames.length} - filename={name} - fileURL={fileUrl} - getPublicLink={this.getPublicLink} - /> + onMouseEnter={this.onMouseEnterImage} + onMouseLeave={this.onMouseLeaveImage} + onClick={(e) => e.stopPropagation()} + > + <div + className={closeButtonClass} + onClick={this.props.onModalDismissed} + /> + {content} + <ViewImagePopoverBar + show={this.state.showFooter} + fileId={this.state.imgId} + totalFiles={this.props.filenames.length} + filename={name} + fileURL={fileUrl} + getPublicLink={this.getPublicLink} + /> + </div> </div> {leftArrow} {rightArrow} diff --git a/web/react/stores/post_store.jsx b/web/react/stores/post_store.jsx index a8f0f9c63..2212edadb 100644 --- a/web/react/stores/post_store.jsx +++ b/web/react/stores/post_store.jsx @@ -211,7 +211,7 @@ class PostStoreClass extends EventEmitter { postList.order = this.postsInfo[id].pendingPosts.order.concat(postList.order); } - // Add delteted posts + // Add deleted posts if (this.postsInfo[id].hasOwnProperty('deletedPosts')) { Object.assign(postList.posts, this.postsInfo[id].deletedPosts); diff --git a/web/react/utils/markdown.jsx b/web/react/utils/markdown.jsx index 9d9bdfb7a..f2721c81d 100644 --- a/web/react/utils/markdown.jsx +++ b/web/react/utils/markdown.jsx @@ -223,6 +223,16 @@ class MattermostMarkdownRenderer extends marked.Renderer { return `<table class="markdown__table"><thead>${header}</thead><tbody>${body}</tbody></table>`; } + listitem(text) { + const taskListReg = /^\[([ |xX])\] /; + const isTaskList = taskListReg.exec(text); + + if (isTaskList) { + return `<li>${'<input type="checkbox" disabled="disabled" ' + (isTaskList[1] === ' ' ? '' : 'checked="checked" ') + '/> '}${text.replace(taskListReg, '')}</li>`; + } + return `<li>${text}</li>`; + } + text(txt) { return TextFormatting.doFormatText(txt, this.formattingOptions); } diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss index 6270c8608..4a56bc6c7 100644 --- a/web/sass-files/sass/partials/_modal.scss +++ b/web/sass-files/sass/partials/_modal.scss @@ -3,6 +3,7 @@ } .modal-body { padding: 20px 15px; + overflow: auto; } .modal { width: 100%; @@ -47,9 +48,6 @@ margin-left: auto; margin-right: auto; } - .modal-body { - overflow: auto; - } .modal-push-down { margin-top: 5%; } @@ -195,21 +193,35 @@ width:100%; height: 100%; margin: 0 auto; + max-width: 100%; + + .modal-body { + @include clearfix; + height: 100%; + display: table; + table-layout: fixed; + width: 100%; + max-height: 100%; + } + .image-wrapper { position: relative; max-width: 90%; - min-height: 100px; - min-width: 320px; @include border-radius(3px); - display: table; - margin: 0 auto; + display: table-cell; + vertical-align: middle; + text-align: center; + width: 100%; + &:hover { @include border-radius(3px 3px 0 0); } + &.default { width: 100%; height: 80%; } + .modal-close { background: url("../images/close.png") no-repeat; @include background-size(100% 100%); @@ -225,24 +237,31 @@ transition: opacity 0.6s; cursor: pointer; z-index: 9999; + &.modal-close--show { @include opacity(1); } + } - > a { + + > div { + min-height: 100px; + min-width: 320px; background: #FFF; - display: table-cell; - vertical-align: middle; + display: inline-block; position: relative; &:hover .file-playback-controls.stop { @include opacity(1); } + } + img { max-width: 100%; max-height: 100%; } + .spinner.file__loading { z-index: 2; position: absolute; @@ -259,7 +278,6 @@ height: 100%; padding: 0; border: none; - display: table; } .image-body { vertical-align: middle; diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index b7a305427..ed1632681 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -607,6 +607,11 @@ body.ios { li ul, li ol { padding: 0 0 0 20px } + + li input[type="checkbox"]:disabled { + vertical-align: sub; + cursor: default; + } } } diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index 00fa7d817..5f5cca89b 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -621,8 +621,10 @@ .modal { .modal-image { .image-wrapper { - font-size: 12px; - min-width: 250px; + > div { + font-size: 12px; + min-width: 250px; + } .modal-close { @include opacity(1); } |