Browse Source

feat(components/onboarding_modal): Swipe between pages (#3934)

pull/4/head
Sorin Davidoi 4 years ago
committed by Eugen Rochko
parent
commit
d23293c762
1 changed files with 3 additions and 2 deletions
  1. +3
    -2
      app/javascript/mastodon/features/ui/components/onboarding_modal.js

+ 3
- 2
app/javascript/mastodon/features/ui/components/onboarding_modal.js View File

@ -3,6 +3,7 @@ import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ReactSwipeable from 'react-swipeable';
import classNames from 'classnames';
import Permalink from '../../../components/permalink';
import TransitionMotion from 'react-motion/lib/TransitionMotion';
@ -274,7 +275,7 @@ export default class OnboardingModal extends React.PureComponent {
<div className='modal-root__modal onboarding-modal'>
<TransitionMotion styles={styles}>
{interpolatedStyles => (
<div className='onboarding-modal__pager'>
<ReactSwipeable onSwipedRight={this.handlePrev} onSwipedLeft={this.handleNext} className='onboarding-modal__pager'>
{interpolatedStyles.map(({ key, data, style }, i) => {
const className = classNames('onboarding-modal__page__wrapper', {
'onboarding-modal__page__wrapper--active': i === currentIndex,
@ -283,7 +284,7 @@ export default class OnboardingModal extends React.PureComponent {
<div key={key} style={style} className={className}>{data}</div>
);
})}
</div>
</ReactSwipeable>
)}
</TransitionMotion>

Loading…
Cancel
Save