diff options
author | Claire <claire.github-309c@sitedethib.com> | 2021-03-24 10:53:50 +0100 |
---|---|---|
committer | Claire <claire.github-309c@sitedethib.com> | 2021-03-24 10:53:50 +0100 |
commit | f60c99a8fb0c99554fce091cac61d9ed07eef573 (patch) | |
tree | 27457a4e091b820269daedb2f709ca304bcf5d06 /app/javascript | |
parent | d7c1c41859549212a6d34ad869fded16acc17b48 (diff) | |
parent | 88d69d3261c2f02278d07dc302ff7fc15bd68e8c (diff) |
Merge branch 'main' into glitch-soc/merge-upstream
Diffstat (limited to 'app/javascript')
4 files changed, 28 insertions, 4 deletions
diff --git a/app/javascript/mastodon/features/compose/components/compose_form.js b/app/javascript/mastodon/features/compose/components/compose_form.js index adec8dc8b..9d8732a8c 100644 --- a/app/javascript/mastodon/features/compose/components/compose_form.js +++ b/app/javascript/mastodon/features/compose/components/compose_form.js @@ -133,7 +133,15 @@ class ComposeForm extends ImmutablePureComponent { } } + componentDidMount () { + this._updateFocusAndSelection({ }); + } + componentDidUpdate (prevProps) { + this._updateFocusAndSelection(prevProps); + } + + _updateFocusAndSelection = (prevProps) => { // This statement does several things: // - If we're beginning a reply, and, // - Replying to zero or one users, places the cursor at the end of the textbox. diff --git a/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js b/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js index 27300f020..de1127b0d 100644 --- a/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js +++ b/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js @@ -59,7 +59,7 @@ class ColumnSettings extends React.PureComponent { {this.modeLabel(mode)} </span> - <NonceProvider nonce={document.querySelector('meta[name=style-nonce]').content}> + <NonceProvider nonce={document.querySelector('meta[name=style-nonce]').content} cacheKey='tags'> <AsyncSelect isMulti autoFocus diff --git a/app/javascript/mastodon/features/ui/components/columns_area.js b/app/javascript/mastodon/features/ui/components/columns_area.js index 6837450eb..85a92fc3a 100644 --- a/app/javascript/mastodon/features/ui/components/columns_area.js +++ b/app/javascript/mastodon/features/ui/components/columns_area.js @@ -70,8 +70,12 @@ class ColumnsArea extends ImmutablePureComponent { children: PropTypes.node, }; + // Corresponds to (max-width: 600px + (285px * 1) + (10px * 1)) in SCSS + mediaQuery = 'matchMedia' in window && window.matchMedia('(max-width: 895px)'); + state = { shouldAnimate: false, + renderComposePanel: !(this.mediaQuery && this.mediaQuery.matches), } componentWillReceiveProps() { @@ -85,6 +89,11 @@ class ColumnsArea extends ImmutablePureComponent { this.node.addEventListener('wheel', this.handleWheel, supportsPassiveEvents ? { passive: true } : false); } + if (this.mediaQuery) { + this.mediaQuery.addEventListener('change', this.handleLayoutChange); + this.setState({ renderComposePanel: !this.mediaQuery.matches }); + } + this.lastIndex = getIndex(this.context.router.history.location.pathname); this.isRtlLayout = document.getElementsByTagName('body')[0].classList.contains('rtl'); @@ -114,6 +123,10 @@ class ColumnsArea extends ImmutablePureComponent { if (!this.props.singleColumn) { this.node.removeEventListener('wheel', this.handleWheel); } + + if (this.mediaQuery) { + this.mediaQuery.removeEventListener('change', this.handleLayoutChange); + } } handleChildrenContentChange() { @@ -123,6 +136,10 @@ class ColumnsArea extends ImmutablePureComponent { } } + handleLayoutChange = (e) => { + this.setState({ renderComposePanel: !e.matches }); + } + handleSwipe = (index) => { this.pendingIndex = index; @@ -186,7 +203,7 @@ class ColumnsArea extends ImmutablePureComponent { render () { const { columns, children, singleColumn, isModalOpen, intl } = this.props; - const { shouldAnimate } = this.state; + const { shouldAnimate, renderComposePanel } = this.state; const columnIndex = getIndex(this.context.router.history.location.pathname); @@ -205,7 +222,7 @@ class ColumnsArea extends ImmutablePureComponent { <div className='columns-area__panels'> <div className='columns-area__panels__pane columns-area__panels__pane--compositional'> <div className='columns-area__panels__pane__inner'> - <ComposePanel /> + {renderComposePanel && <ComposePanel />} </div> </div> diff --git a/app/javascript/styles/mastodon-light/diff.scss b/app/javascript/styles/mastodon-light/diff.scss index d4290d7e6..8e6b0cdd5 100644 --- a/app/javascript/styles/mastodon-light/diff.scss +++ b/app/javascript/styles/mastodon-light/diff.scss @@ -707,7 +707,6 @@ html { .public-account-bio, .hero-widget__text { background: $account-background-color; - border: 1px solid lighten($ui-base-color, 8%); } .header { |