Move the “Show why” button inline

diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 4cd6b3a36016ba86310767128aceccc50940afff..e94ce6dfe543d4e3a78d914ffd529da15b023159 100644 (file)
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -506,9 +506,10 @@ class Status extends ImmutablePureComponent {
         <HotKeys handlers={minHandlers}>
           <div className='status__wrapper status__wrapper--filtered focusable' tabIndex='0' ref={this.handleRef}>
             <FormattedMessage id='status.filtered' defaultMessage='Filtered' />
+            {settings.get('filtering_behavior') !== 'upstream' && ' '}
             {settings.get('filtering_behavior') !== 'upstream' && (
               <button className='status__wrapper--filtered__button' onClick={this.handleUnfilterClick}>
-                <FormattedMessage id='status.show_filter_reason' defaultMessage='Show why' />
+                <FormattedMessage id='status.show_filter_reason' defaultMessage='(show why)' />
               </button>
             )}
           </div>

diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
index cf8f396930c623a63002be7f3b216c1433c73366..4ffbb2c21e0eb88e52e3ca285bab031d9c2b05e7 100644 (file)
--- a/app/javascript/flavours/glitch/styles/components/status.scss
+++ b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -998,14 +998,13 @@ a.status-card.compact:hover {
 }
 
 .status__wrapper--filtered__button {
-  display: block;
-  font-size: 15px;
-  line-height: 20px;
+  display: inline;
   color: lighten($ui-highlight-color, 8%);
   border: 0;
   background: transparent;
   padding: 0;
-  padding-top: 8px;
+  font-size: inherit;
+  line-height: inherit;
 
   &:hover,
   &:active {