diff --git a/app/javascript/mastodon/actions/onboarding.js b/app/javascript/mastodon/actions/onboarding.js
deleted file mode 100644
index a161c50efe..0000000000
--- a/app/javascript/mastodon/actions/onboarding.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { openModal } from './modal';
-import { changeSetting, saveSettings } from './settings';
-
-export function showOnboardingOnce() {
- return (dispatch, getState) => {
- const alreadySeen = getState().getIn(['settings', 'onboarded']);
-
- if (!alreadySeen) {
- dispatch(openModal('ONBOARDING'));
- dispatch(changeSetting(['onboarded'], true));
- dispatch(saveSettings());
- }
- };
-};
diff --git a/app/javascript/mastodon/containers/mastodon.js b/app/javascript/mastodon/containers/mastodon.js
index d1710445b5..8ae3b727af 100644
--- a/app/javascript/mastodon/containers/mastodon.js
+++ b/app/javascript/mastodon/containers/mastodon.js
@@ -2,7 +2,6 @@ import React from 'react';
import { Provider } from 'react-redux';
import PropTypes from 'prop-types';
import configureStore from '../store/configureStore';
-import { showOnboardingOnce } from '../actions/onboarding';
import { BrowserRouter, Route } from 'react-router-dom';
import { ScrollContext } from 'react-router-scroll-4';
import UI from '../features/ui';
@@ -40,8 +39,6 @@ export default class Mastodon extends React.PureComponent {
const handlerUrl = window.location.protocol + '//' + window.location.host + '/intent?uri=%s';
window.setTimeout(() => navigator.registerProtocolHandler('web+mastodon', handlerUrl, 'Mastodon'), 5 * 60 * 1000);
}
-
- store.dispatch(showOnboardingOnce());
}
componentWillUnmount () {
diff --git a/app/javascript/mastodon/features/ui/components/modal_root.js b/app/javascript/mastodon/features/ui/components/modal_root.js
index ebbff6b5a2..44ae5d51e2 100644
--- a/app/javascript/mastodon/features/ui/components/modal_root.js
+++ b/app/javascript/mastodon/features/ui/components/modal_root.js
@@ -9,7 +9,6 @@ import VideoModal from './video_modal';
import BoostModal from './boost_modal';
import ConfirmationModal from './confirmation_modal';
import {
- OnboardingModal,
MuteModal,
ReportModal,
EmbedModal,
@@ -18,7 +17,6 @@ import {
const MODAL_COMPONENTS = {
'MEDIA': () => Promise.resolve({ default: MediaModal }),
- 'ONBOARDING': OnboardingModal,
'VIDEO': () => Promise.resolve({ default: VideoModal }),
'BOOST': () => Promise.resolve({ default: BoostModal }),
'CONFIRM': () => Promise.resolve({ default: ConfirmationModal }),
diff --git a/app/javascript/mastodon/features/ui/components/onboarding_modal.js b/app/javascript/mastodon/features/ui/components/onboarding_modal.js
deleted file mode 100644
index 54673e223e..0000000000
--- a/app/javascript/mastodon/features/ui/components/onboarding_modal.js
+++ /dev/null
@@ -1,318 +0,0 @@
-import React from 'react';
-import { connect } from 'react-redux';
-import PropTypes from 'prop-types';
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import ReactSwipeableViews from 'react-swipeable-views';
-import classNames from 'classnames';
-import Permalink from '../../../components/permalink';
-import ComposeForm from '../../compose/components/compose_form';
-import Search from '../../compose/components/search';
-import NavigationBar from '../../compose/components/navigation_bar';
-import ColumnHeader from './column_header';
-import { List as ImmutableList } from 'immutable';
-import { me } from '../../../initial_state';
-
-const noop = () => { };
-
-const messages = defineMessages({
- home_title: { id: 'column.home', defaultMessage: 'Home' },
- notifications_title: { id: 'column.notifications', defaultMessage: 'Notifications' },
- local_title: { id: 'column.community', defaultMessage: 'Local timeline' },
- federated_title: { id: 'column.public', defaultMessage: 'Federated timeline' },
-});
-
-const PageOne = ({ acct, domain }) => (
-
-
-
-
-
-
-
@{acct}@{domain} }} />
-
-
-);
-
-PageOne.propTypes = {
- acct: PropTypes.string.isRequired,
- domain: PropTypes.string.isRequired,
-};
-
-const PageTwo = ({ myAccount }) => (
-
-);
-
-PageTwo.propTypes = {
- myAccount: ImmutablePropTypes.map.isRequired,
-};
-
-const PageThree = ({ myAccount }) => (
-
-
-
-
#illustration, introductions: #introductions }} />
-
-
-);
-
-PageThree.propTypes = {
- myAccount: ImmutablePropTypes.map.isRequired,
-};
-
-const PageFour = ({ domain, intl }) => (
-
-);
-
-PageFour.propTypes = {
- domain: PropTypes.string.isRequired,
- intl: PropTypes.object.isRequired,
-};
-
-const PageSix = ({ admin, domain }) => {
- let adminSection = '';
-
- if (admin) {
- adminSection = (
-
- @{admin.get('acct')} }} />
-
- }} />
-
- );
- }
-
- return (
-
-
- {adminSection}
-
GitHub }} />
-
}} />
-
-
- );
-};
-
-PageSix.propTypes = {
- admin: ImmutablePropTypes.map,
- domain: PropTypes.string.isRequired,
-};
-
-const mapStateToProps = state => ({
- myAccount: state.getIn(['accounts', me]),
- admin: state.getIn(['accounts', state.getIn(['meta', 'admin'])]),
- domain: state.getIn(['meta', 'domain']),
-});
-
-@connect(mapStateToProps)
-@injectIntl
-export default class OnboardingModal extends React.PureComponent {
-
- static propTypes = {
- onClose: PropTypes.func.isRequired,
- intl: PropTypes.object.isRequired,
- myAccount: ImmutablePropTypes.map.isRequired,
- domain: PropTypes.string.isRequired,
- admin: ImmutablePropTypes.map,
- };
-
- state = {
- currentIndex: 0,
- };
-
- componentWillMount() {
- const { myAccount, admin, domain, intl } = this.props;
- this.pages = [
- ,
- ,
- ,
- ,
- ,
- ];
- };
-
- componentDidMount() {
- window.addEventListener('keyup', this.handleKeyUp);
- }
-
- componentWillUnmount() {
- window.addEventListener('keyup', this.handleKeyUp);
- }
-
- handleSkip = (e) => {
- e.preventDefault();
- this.props.onClose();
- }
-
- handleDot = (e) => {
- const i = Number(e.currentTarget.getAttribute('data-index'));
- e.preventDefault();
- this.setState({ currentIndex: i });
- }
-
- handlePrev = () => {
- this.setState(({ currentIndex }) => ({
- currentIndex: Math.max(0, currentIndex - 1),
- }));
- }
-
- handleNext = () => {
- const { pages } = this;
- this.setState(({ currentIndex }) => ({
- currentIndex: Math.min(currentIndex + 1, pages.length - 1),
- }));
- }
-
- handleSwipe = (index) => {
- this.setState({ currentIndex: index });
- }
-
- handleKeyUp = ({ key }) => {
- switch (key) {
- case 'ArrowLeft':
- this.handlePrev();
- break;
- case 'ArrowRight':
- this.handleNext();
- break;
- }
- }
-
- handleClose = () => {
- this.props.onClose();
- }
-
- render () {
- const { pages } = this;
- const { currentIndex } = this.state;
- const hasMore = currentIndex < pages.length - 1;
-
- const nextOrDoneBtn = hasMore ? (
-
- ) : (
-
- );
-
- return (
-
-
- {pages.map((page, i) => {
- const className = classNames('onboarding-modal__page__wrapper', {
- 'onboarding-modal__page__wrapper--active': i === currentIndex,
- });
- return (
- {page}
- );
- })}
-
-
-
-
-
-
-
-
- {pages.map((_, i) => {
- const className = classNames('onboarding-modal__dot', {
- active: i === currentIndex,
- });
- return (
-
- );
- })}
-
-
-
- {nextOrDoneBtn}
-
-
-
- );
- }
-
-}
diff --git a/app/javascript/mastodon/features/ui/util/async-components.js b/app/javascript/mastodon/features/ui/util/async-components.js
index d6586680b8..a03c4cefd8 100644
--- a/app/javascript/mastodon/features/ui/util/async-components.js
+++ b/app/javascript/mastodon/features/ui/util/async-components.js
@@ -94,10 +94,6 @@ export function Mutes () {
return import(/* webpackChunkName: "features/mutes" */'../../mutes');
}
-export function OnboardingModal () {
- return import(/* webpackChunkName: "modals/onboarding_modal" */'../components/onboarding_modal');
-}
-
export function MuteModal () {
return import(/* webpackChunkName: "modals/mute_modal" */'../components/mute_modal');
}
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index dbb277af96..96cc39cd2a 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -3268,7 +3268,6 @@
z-index: 100;
}
-.onboarding-modal,
.error-modal,
.embed-modal {
background: $ui-secondary-color;
@@ -3279,26 +3278,6 @@
flex-direction: column;
}
-.onboarding-modal__pager {
- height: 80vh;
- width: 80vw;
- max-width: 520px;
- max-height: 420px;
-
- .react-swipeable-view-container > div {
- width: 100%;
- height: 100%;
- box-sizing: border-box;
- padding: 25px;
- display: none;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- display: flex;
- user-select: text;
- }
-}
-
.error-modal__body {
height: 80vh;
width: 80vw;
@@ -3332,23 +3311,6 @@
text-align: center;
}
-@media screen and (max-width: 550px) {
- .onboarding-modal {
- width: 100%;
- height: 100%;
- border-radius: 0;
- }
-
- .onboarding-modal__pager {
- width: 100%;
- height: auto;
- max-width: none;
- max-height: none;
- flex: 1 1 auto;
- }
-}
-
-.onboarding-modal__paginator,
.error-modal__footer {
flex: 0 0 auto;
background: darken($ui-secondary-color, 8%);
@@ -3359,7 +3321,6 @@
min-width: 33px;
}
- .onboarding-modal__nav,
.error-modal__nav {
color: darken($ui-secondary-color, 34%);
background-color: transparent;
@@ -3375,11 +3336,6 @@
&:active {
color: darken($ui-secondary-color, 38%);
}
-
- &.onboarding-modal__done,
- &.onboarding-modal__next {
- color: $ui-highlight-color;
- }
}
}
@@ -3387,216 +3343,6 @@
justify-content: center;
}
-.onboarding-modal__dots {
- flex: 1 1 auto;
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-.onboarding-modal__dot {
- width: 14px;
- height: 14px;
- border-radius: 14px;
- background: darken($ui-secondary-color, 16%);
- margin: 0 3px;
- cursor: pointer;
-
- &:hover {
- background: darken($ui-secondary-color, 18%);
- }
-
- &.active {
- cursor: default;
- background: darken($ui-secondary-color, 24%);
- }
-}
-
-.onboarding-modal__page__wrapper {
- pointer-events: none;
-
- &.onboarding-modal__page__wrapper--active {
- pointer-events: auto;
- }
-}
-
-.onboarding-modal__page {
- cursor: default;
- line-height: 21px;
-
- h1 {
- font-size: 18px;
- font-weight: 500;
- color: $ui-base-color;
- margin-bottom: 20px;
- }
-
- a {
- color: $ui-highlight-color;
-
- &:hover,
- &:focus,
- &:active {
- color: lighten($ui-highlight-color, 4%);
- }
- }
-
- p {
- font-size: 16px;
- color: lighten($ui-base-color, 8%);
- margin-top: 10px;
- margin-bottom: 10px;
-
- &:last-child {
- margin-bottom: 0;
- }
-
- strong {
- font-weight: 500;
- background: $ui-base-color;
- color: $ui-secondary-color;
- border-radius: 4px;
- font-size: 14px;
- padding: 3px 6px;
-
- @each $lang in $cjk-langs {
- &:lang(#{$lang}) {
- font-weight: 700;
- }
- }
- }
- }
-}
-
-.onboarding-modal__page-one {
- display: flex;
- align-items: center;
-}
-
-.onboarding-modal__page-one__elephant-friend {
- background: url('../images/elephant-friend-1.png') no-repeat center center / contain;
- width: 155px;
- height: 193px;
- margin-right: 15px;
-}
-
-@media screen and (max-width: 400px) {
- .onboarding-modal__page-one {
- flex-direction: column;
- align-items: normal;
- }
-
- .onboarding-modal__page-one__elephant-friend {
- width: 100%;
- height: 30vh;
- max-height: 160px;
- margin-bottom: 5vh;
- }
-}
-
-.onboarding-modal__page-two,
-.onboarding-modal__page-three,
-.onboarding-modal__page-four,
-.onboarding-modal__page-five {
- p {
- text-align: left;
- }
-
- .figure {
- background: darken($ui-base-color, 8%);
- color: $ui-secondary-color;
- margin-bottom: 20px;
- border-radius: 4px;
- padding: 10px;
- text-align: center;
- font-size: 14px;
- box-shadow: 1px 2px 6px rgba($base-shadow-color, 0.3);
-
- .onboarding-modal__image {
- border-radius: 4px;
- margin-bottom: 10px;
- }
-
- &.non-interactive {
- pointer-events: none;
- text-align: left;
- }
- }
-}
-
-.onboarding-modal__page-four__columns {
- .row {
- display: flex;
- margin-bottom: 20px;
-
- & > div {
- flex: 1 1 0;
- margin: 0 10px;
-
- &:first-child {
- margin-left: 0;
- }
-
- &:last-child {
- margin-right: 0;
- }
-
- p {
- text-align: center;
- }
- }
-
- &:last-child {
- margin-bottom: 0;
- }
- }
-
- .column-header {
- color: $primary-text-color;
- }
-}
-
-@media screen and (max-width: 320px) and (max-height: 600px) {
- .onboarding-modal__page p {
- font-size: 14px;
- line-height: 20px;
- }
-
- .onboarding-modal__page-two .figure,
- .onboarding-modal__page-three .figure,
- .onboarding-modal__page-four .figure,
- .onboarding-modal__page-five .figure {
- font-size: 12px;
- margin-bottom: 10px;
- }
-
- .onboarding-modal__page-four__columns .row {
- margin-bottom: 10px;
- }
-
- .onboarding-modal__page-four__columns .column-header {
- padding: 5px;
- font-size: 12px;
- }
-}
-
-.onboarding-modal__image {
- border-radius: 8px;
- width: 70vw;
- max-width: 450px;
- max-height: auto;
- display: block;
- margin: auto;
- margin-bottom: 20px;
-}
-
-.onboard-sliders {
- display: inline-block;
- max-width: 30px;
- max-height: auto;
- margin-left: 10px;
-}
-
.boost-modal,
.confirmation-modal,
.report-modal,