Merge pull request #1282 from asaadmahmoodspin/ui-improvements

Multiple UI changes

1 files changed, 20 insertions, 11 deletions

diff --git a/web/react/components/tutorial/tutorial_intro_screens.jsx b/web/react/components/tutorial/tutorial_intro_screens.jsx
index c7abccae3..8fc38b1e3 100644
--- a/web/react/components/tutorial/tutorial_intro_screens.jsx
+++ b/web/react/components/tutorial/tutorial_intro_screens.jsx
@@ -35,6 +35,9 @@ export default class TutorialIntroScreens extends React.Component {
         preference = PreferenceStore.setPreference(Preferences.TUTORIAL_STEP, UserStore.getCurrentId(), newValue);
         AsyncClient.savePreferences([preference]);
     }
+    componentDidMount() {
+        $('.tutorials__scroll').perfectScrollbar();
+    }
     createScreen() {
         switch (this.state.currentScreen) {
         case 0:
@@ -130,20 +133,26 @@ export default class TutorialIntroScreens extends React.Component {
         );
     }
     render() {
+        const height = Utils.windowHeight() - 100;
         const screen = this.createScreen();
 
         return (
-            <div className='tutorial-steps__container'>
-                <div className='tutorial__content'>
-                    <div className='tutorial__steps'>
-                        {screen}
-                        <button
-                            className='btn btn-primary'
-                            tabIndex='1'
-                            onClick={this.handleNext}
-                        >
-                            {'Next'}
-                        </button>
+            <div
+                className='tutorials__scroll'
+                style={{height}}
+            >
+                <div className='tutorial-steps__container'>
+                    <div className='tutorial__content'>
+                        <div className='tutorial__steps'>
+                            {screen}
+                            <button
+                                className='btn btn-primary'
+                                tabIndex='1'
+                                onClick={this.handleNext}
+                            >
+                                {'Next'}
+                            </button>
+                        </div>
                     </div>
                 </div>
             </div>