diff options
author | Asaad Mahmood <Unknowngi@live.com> | 2015-11-02 11:40:53 +0500 |
---|---|---|
committer | JoramWilander <jwawilander@gmail.com> | 2015-11-02 14:47:24 -0500 |
commit | 393d253021e6b119ec35b92f9eeaa6f2d255008f (patch) | |
tree | d20833fcebe116899b06d9f9b6b3d0ffaa0e2590 /web/react/components/tutorial/tutorial_tip.jsx | |
parent | 97449a102e5592358a4f7f22d6720a9af21286a1 (diff) | |
download | chat-393d253021e6b119ec35b92f9eeaa6f2d255008f.tar.gz chat-393d253021e6b119ec35b92f9eeaa6f2d255008f.tar.bz2 chat-393d253021e6b119ec35b92f9eeaa6f2d255008f.zip |
Updating tutorial screens
Diffstat (limited to 'web/react/components/tutorial/tutorial_tip.jsx')
-rw-r--r-- | web/react/components/tutorial/tutorial_tip.jsx | 51 |
1 files changed, 31 insertions, 20 deletions
diff --git a/web/react/components/tutorial/tutorial_tip.jsx b/web/react/components/tutorial/tutorial_tip.jsx index 166d10d8a..3482a7cfa 100644 --- a/web/react/components/tutorial/tutorial_tip.jsx +++ b/web/react/components/tutorial/tutorial_tip.jsx @@ -52,9 +52,19 @@ export default class TutorialTip extends React.Component { if (this.props.screens.length > 1) { for (let i = 0; i < this.props.screens.length; i++) { if (i === this.state.currentScreen) { - dots.push(<span key={'dotactive' + i}>{'[ x ]'}</span>); + dots.push( + <div + className='circle active' + key={'dotactive' + i} + /> + ); } else { - dots.push(<span key={'dotinactive' + i}>{'[ ]'}</span>); + dots.push( + <div + className='circle' + key={'dotinactive' + i} + /> + ); } } } @@ -63,7 +73,8 @@ export default class TutorialTip extends React.Component { <div className='tip-div'> <img className='tip-button' - src='/static/images/next.png' + src='/static/images/tutorialTip.gif' + width='35' onClick={this.toggle} ref='target' /> @@ -77,24 +88,24 @@ export default class TutorialTip extends React.Component { > <div className='tip-overlay'> {this.props.screens[this.state.currentScreen]} - <br/> - {dots} - <button - className='btn btn-default' - onClick={this.handleNext} - > - {buttonText} - </button> - <br/> - <span> - {'Seen this before? '} - <a - href='#' - onClick={this.skipTutorial} + <div className='tutorial__circles'>{dots}</div> + <div className='text-right'> + <button + className='btn btn-default' + onClick={this.handleNext} > - {'Opt out of these tips.'} - </a> - </span> + {buttonText} + </button> + <div className='tip-opt'> + {'Seen this before? '} + <a + href='#' + onClick={this.skipTutorial} + > + {'Opt out of these tips.'} + </a> + </div> + </div> </div> </Overlay> </div> |