replace text in FilterBar with icons

app/javascript/mastodon/features/notifications/components/filter_bar.js

@@ -30,37 +30,49 @@ export default class FilterBar extends React.PureComponent {
           className={selectedFilter === 'mention' ? 'active' : ''}
           onClick={this.onClick('mention')}
         >
-          <FormattedMessage
-            id='notifications.filter.mentions'
-            defaultMessage='Mentions'
-          />
+          {/*
+            <FormattedMessage
+              id='notifications.filter.mentions'
+              defaultMessage='Mentions'
+            />
+          */}
+          @
         </button>
         <button
           className={selectedFilter === 'favourite' ? 'active' : ''}
           onClick={this.onClick('favourite')}
         >
-          <FormattedMessage
-            id='notifications.filter.favourites'
-            defaultMessage='Favourites'
-          />
+          {/*
+            <FormattedMessage
+              id='notifications.filter.favourites'
+              defaultMessage='Favourites'
+            />
+          */}
+          <i className='fa fa-fw fa-star' />
         </button>
         <button
           className={selectedFilter === 'reblog' ? 'active' : ''}
           onClick={this.onClick('reblog')}
         >
-          <FormattedMessage
-            id='notifications.filter.boosts'
-            defaultMessage='Boosts'
-          />
+          {/*
+            <FormattedMessage
+              id='notifications.filter.boosts'
+              defaultMessage='Boosts'
+            />
+          */}
+          <i className='fa fa-fw fa-retweet' />
         </button>
         <button
           className={selectedFilter === 'follow' ? 'active' : ''}
           onClick={this.onClick('follow')}
         >
-          <FormattedMessage
-            id='notifications.filter.follows'
-            defaultMessage='Follows'
-          />
+          {/*
+            <FormattedMessage
+              id='notifications.filter.follows'
+              defaultMessage='Follows'
+            />
+          */}
+          <i className='fa fa-fw fa-user-plus' />
         </button>
       </div>
     );

app/javascript/styles/mastodon/components.scss

@@ -1493,7 +1493,7 @@ a.account__display-name {
     position: relative;
     flex-grow: 1;
     color: $primary-text-color;
-    padding: 5px 5px 12px;
+    padding: 10px 5px 12px;
     text-decoration: none;
     font-weight: 400;
     font-size: 15px;