Files
app
controllers
helpers
javascript
fonts
images
mastodon
actions
components
containers
features
account
account_gallery
account_timeline
blocks
community_timeline
compose
components
autosuggest_account.js
character_counter.js
compose_form.js
emoji_picker_dropdown.js
navigation_bar.js
privacy_dropdown.js
reply_indicator.js
search.js
search_results.js
text_icon_button.js
upload.js
upload_button.js
upload_form.js
upload_progress.js
warning.js
containers
util
index.js
emoji
favourited_statuses
favourites
follow_requests
followers
following
generic_not_found
getting_started
hashtag_timeline
home_timeline
mutes
notifications
pinned_statuses
public_timeline
reblogs
report
standalone
status
ui
video
locales
middleware
reducers
selectors
service_worker
store
.gitkeep
api.js
base_polyfills.js
extra_polyfills.js
initial_state.js
is_mobile.js
link_header.js
load_polyfills.js
main.js
performance.js
ready.js
rtl.js
scroll.js
stream.js
test_setup.js
uuid.js
web_push_subscription.js
packs
styles
lib
mailers
models
policies
presenters
serializers
services
validators
views
workers
bin
config
db
docs
lib
log
nanobox
public
spec
streaming
vendor
.babelrc
.buildpacks
.codeclimate.yml
.dockerignore
.editorconfig
.env.nanobox
.env.production.sample
.env.test
.env.vagrant
.eslintignore
.eslintrc.yml
.foreman
.gitattributes
.gitignore
.haml-lint.yml
.nanoignore
.nvmrc
.postcssrc.yml
.profile
.rspec
.rubocop.yml
.ruby-version
.scss-lint.yml
.slugignore
.travis.yml
.yarnclean
Aptfile
CODEOWNERS
CODE_OF_CONDUCT.md
CONTRIBUTING.md
Capfile
Dockerfile
Gemfile
Gemfile.lock
ISSUE_TEMPLATE.md
LICENSE
Procfile
Procfile.dev
README.md
Rakefile
Vagrantfile
app.json
boxfile.yml
config.ru
docker-compose.yml
docker_entrypoint.sh
jest.config.js
package.json
scalingo.json
yarn.lock
hometown/app/javascript/mastodon/features/compose/components/warning.js
Nolan Lawson fa0be3f834 Add option to reduce motion ()
* Add option to reduce motion

* Use HOC to wrap all Motion calls

* fix case-sensitive issue

* Avoid updating too frequently

* Get rid of unnecessary change to _simple_status.html.haml
2017-10-16 09:36:15 +02:00

27 lines
841 B
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import Motion from '../../ui/util/optional_motion';
import spring from 'react-motion/lib/spring';
export default class Warning extends React.PureComponent {
static propTypes = {
message: PropTypes.node.isRequired,
};
render () {
const { message } = this.props;
return (
<Motion defaultStyle={{ opacity: 0, scaleX: 0.85, scaleY: 0.75 }} style={{ opacity: spring(1, { damping: 35, stiffness: 400 }), scaleX: spring(1, { damping: 35, stiffness: 400 }), scaleY: spring(1, { damping: 35, stiffness: 400 }) }}>
{({ opacity, scaleX, scaleY }) => (
<div className='compose-form__warning' style={{ opacity: opacity, transform: `scale(${scaleX}, ${scaleY})` }}>
{message}
</div>
)}
</Motion>
);
}
}