Merge pull request #1547 from asaadmahmoodspin/ui-improvements

Ui improvements

2 files changed, 23 insertions, 15 deletions

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}