From 72bd73f605a7253daf445f76425da3182a1f669c Mon Sep 17 00:00:00 2001
From: Sorin Davidoi <sorin.davidoi@gmail.com>
Date: Fri, 14 Jul 2017 22:31:25 +0200
Subject: [PATCH] Small style fixes (#4206)
* fix(components/media_modal): Center horizontally in Firefox
* fix(components/status_list): Do not remove load more button
---
app/javascript/mastodon/components/load_more.js | 9 ++++++++-
app/javascript/mastodon/components/status_list.js | 6 +-----
app/javascript/styles/components.scss | 1 +
3 files changed, 10 insertions(+), 6 deletions(-)
diff --git a/app/javascript/mastodon/components/load_more.js b/app/javascript/mastodon/components/load_more.js
index 2996d4dc8d..e2fe1fed7e 100644
--- a/app/javascript/mastodon/components/load_more.js
+++ b/app/javascript/mastodon/components/load_more.js
@@ -6,11 +6,18 @@ export default class LoadMore extends React.PureComponent {
static propTypes = {
onClick: PropTypes.func,
+ visible: PropTypes.bool,
+ }
+
+ static defaultProps = {
+ visible: true,
}
render() {
+ const { visible } = this.props;
+
return (
- <button className='load-more' onClick={this.props.onClick}>
+ <button className='load-more' disabled={!visible} style={{ opacity: visible ? 1 : 0 }} onClick={this.props.onClick}>
<FormattedMessage id='status.load_more' defaultMessage='Load more' />
</button>
);
diff --git a/app/javascript/mastodon/components/status_list.js b/app/javascript/mastodon/components/status_list.js
index 5bc46e8eeb..86e8386bda 100644
--- a/app/javascript/mastodon/components/status_list.js
+++ b/app/javascript/mastodon/components/status_list.js
@@ -101,13 +101,9 @@ export default class StatusList extends ImmutablePureComponent {
render () {
const { statusIds, scrollKey, trackScroll, shouldUpdateScroll, isLoading, hasMore, prepend, emptyMessage } = this.props;
- let loadMore = null;
+ const loadMore = <LoadMore visible={!isLoading && statusIds.size > 0 && hasMore} onClick={this.handleLoadMore} />;
let scrollableArea = null;
- if (!isLoading && statusIds.size > 0 && hasMore) {
- loadMore = <LoadMore onClick={this.handleLoadMore} />;
- }
-
if (isLoading || statusIds.size > 0 || !emptyMessage) {
scrollableArea = (
<div className='scrollable' ref={this.setRef}>
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
index 0420a2bedc..fc797a5086 100644
--- a/app/javascript/styles/components.scss
+++ b/app/javascript/styles/components.scss
@@ -1314,6 +1314,7 @@
.react-swipeable-view-container > * {
display: flex;
align-items: center;
+ justify-content: center;
height: 100%;
}
--
GitLab