Fix SCSS linting issues (#2207)

* Disable font-family-no-missing-generic-family-keyword for font-awesome accessibility icons

* Run stylelint --fix

* Avoid `@extend` directives with doodle modal CSS

* Drop use of `@extend` for notification cleanup buttons SCSS

* Run prettier on SCSS

app/javascript/flavours/glitch/components/notification_purge_buttons.jsx

@@ -11,6 +11,7 @@ import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import Icon from 'flavours/glitch/components/icon';
+import classNames from 'classnames';
 
 const messages = defineMessages({
   btnAll : { id: 'notification_purge.btn_all', defaultMessage: 'Select\nall' },
@@ -36,19 +37,19 @@ class NotificationPurgeButtons extends ImmutablePureComponent {
     //className='active'
     return (
       <div className='column-header__notif-cleaning-buttons'>
-        <button onClick={this.props.onMarkAll} className={markNewForDelete ? 'active' : ''}>
+        <button onClick={this.props.onMarkAll} className={classNames('column-header__button', { active: markNewForDelete })}>
           <b>∀</b><br />{intl.formatMessage(messages.btnAll)}
         </button>
 
-        <button onClick={this.props.onMarkNone} className={!markNewForDelete ? 'active' : ''}>
+        <button onClick={this.props.onMarkNone} className={classNames('column-header__button', { active: !markNewForDelete })}>
           <b>∅</b><br />{intl.formatMessage(messages.btnNone)}
         </button>
 
-        <button onClick={this.props.onInvert}>
+        <button onClick={this.props.onInvert} className='column-header__button'>
           <b>¬</b><br />{intl.formatMessage(messages.btnInvert)}
         </button>
 
-        <button onClick={this.props.onDeleteMarked}>
+        <button onClick={this.props.onDeleteMarked} className='column-header__button'>
           <Icon id='trash' /><br />{intl.formatMessage(messages.btnApply)}
         </button>
       </div>