Merge tag 'v4.2.4'

app/javascript/mastodon/features/compose/components/text_icon_button.jsx

@@ -4,7 +4,7 @@ import { PureComponent } from 'react';
 const iconStyle = {
   height: null,
   lineHeight: '27px',
-  width: `${18 * 1.28571429}px`,
+  minWidth: `${18 * 1.28571429}px`,
 };
 
 export default class TextIconButton extends PureComponent {

app/javascript/mastodon/features/explore/statuses.jsx

@@ -45,24 +45,20 @@ class Statuses extends PureComponent {
     const emptyMessage = <FormattedMessage id='empty_column.explore_statuses' defaultMessage='Nothing is trending right now. Check back later!' />;
 
     return (
-      <>
-        <DismissableBanner id='explore/statuses'>
-          <FormattedMessage id='dismissable_banner.explore_statuses' defaultMessage='These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favorites are ranked higher.' />
-        </DismissableBanner>
-
-        <StatusList
-          trackScroll
-          timelineId='explore'
-          statusIds={statusIds}
-          scrollKey='explore-statuses'
-          hasMore={hasMore}
-          isLoading={isLoading}
-          onLoadMore={this.handleLoadMore}
-          emptyMessage={emptyMessage}
-          bindToDocument={!multiColumn}
-          withCounters
-        />
-      </>
+      <StatusList
+        trackScroll
+        prepend={<DismissableBanner id='explore/statuses'><FormattedMessage id='dismissable_banner.explore_statuses' defaultMessage='These are posts from across the social web that are gaining traction today. Newer posts with more boosts and favorites are ranked higher.' /></DismissableBanner>}
+        alwaysPrepend
+        timelineId='explore'
+        statusIds={statusIds}
+        scrollKey='explore-statuses'
+        hasMore={hasMore}
+        isLoading={isLoading}
+        onLoadMore={this.handleLoadMore}
+        emptyMessage={emptyMessage}
+        bindToDocument={!multiColumn}
+        withCounters
+      />
     );
   }
 

app/javascript/mastodon/features/list_timeline/index.jsx

@@ -201,7 +201,7 @@ class ListTimeline extends PureComponent {
           </div>
 
           <div className='setting-toggle'>
-            <Toggle id={`list-${id}-exclusive`} defaultChecked={isExclusive} onChange={this.onExclusiveToggle} />
+            <Toggle id={`list-${id}-exclusive`} checked={isExclusive} onChange={this.onExclusiveToggle} />
             <label htmlFor={`list-${id}-exclusive`} className='setting-toggle__label'>
               <FormattedMessage id='lists.exclusive' defaultMessage='Hide these posts from home' />
             </label>

app/javascript/styles/mastodon/components.scss

@@ -284,6 +284,7 @@
   font-size: 11px;
   padding: 0 3px;
   line-height: 27px;
+  white-space: nowrap;
 
   &:hover,
   &:active,
@@ -4493,11 +4494,6 @@ a.status-card {
   align-items: center;
   justify-content: center;
 
-  @supports (display: grid) {
-    // hack to fix Chrome <57
-    contain: strict;
-  }
-
   & > span {
     max-width: 500px;
   }