SONAR-10673 Stop using font for icons (#252)

11 files changed, 27 insertions, 24 deletions

diff --git a/server/sonar-web/src/main/js/components/issue/IssueView.js b/server/sonar-web/src/main/js/components/issue/IssueView.js
index 0598c4f9f07..100e1942d23 100644
--- a/server/sonar-web/src/main/js/components/issue/IssueView.js
+++ b/server/sonar-web/src/main/js/components/issue/IssueView.js
@@ -119,10 +119,6 @@ export default class IssueView extends React.PureComponent {
               ))}
             </div>
           )}
-        <a className="issue-navigate js-issue-navigate">
-          <i className="issue-navigate-to-left icon-chevron-left" />
-          <i className="issue-navigate-to-right icon-chevron-right" />
-        </a>
         {hasCheckbox && (
           <a className="js-toggle issue-checkbox-container" href="#" onClick={this.handleCheck}>
             <i
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.js b/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.js
index 2cfeb1544cf..fb892131a08 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.js
@@ -97,7 +97,7 @@ export default class IssueActionsBar extends React.PureComponent {
         <tbody>
           <tr>
             <td>
-              <ul className="list-inline issue-meta-list">
+              <ul className="issue-meta-list">
                 <li className="issue-meta">
                   <IssueType
                     isOpen={this.props.currentPopup === 'set-type' && canSetSeverity}
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.js b/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.js
index a70f6ca5a33..3b6135a0d91 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.js
@@ -20,6 +20,7 @@
 // @flow
 import React from 'react';
 import ChangelogPopup from '../popups/ChangelogPopup';
+import DropdownIcon from '../../../components/icons-components/DropdownIcon';
 import DateFromNow from '../../../components/intl/DateFromNow';
 import DateTimeFormatter from '../../../components/intl/DateTimeFormatter';
 import Toggler from '../../../components/controls/Toggler';
@@ -68,7 +69,7 @@ export default class IssueChangelog extends React.PureComponent {
               <span className="issue-meta-label">
                 <DateFromNow date={this.props.creationDate} />
               </span>
-              <i className="icon-dropdown little-spacer-left" />
+              <DropdownIcon className="little-spacer-left" />
             </Button>
           </Tooltip>
         </Toggler>
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueMessage.js b/server/sonar-web/src/main/js/components/issue/components/IssueMessage.js
index 74bf39609ab..5b4e82d413b 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueMessage.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueMessage.js
@@ -20,6 +20,7 @@
 // @flow
 import React from 'react';
 import PropTypes from 'prop-types';
+import EllipsisIcon from '../../icons-components/EllipsisIcon';
 import Tooltip from '../../controls/Tooltip';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
 import { Button } from '../../ui/buttons';
@@ -50,9 +51,10 @@ export default class IssueMessage extends React.PureComponent {
         {this.props.message}
         <Button
           aria-label={translate('issue.rule_details')}
-          className="button-link issue-rule icon-ellipsis-h little-spacer-left"
-          onClick={this.handleClick}
-        />
+          className="button-link issue-rule little-spacer-left"
+          onClick={this.handleClick}>
+          <EllipsisIcon />
+        </Button>
         {this.props.engine && (
           <Tooltip
             overlay={translateWithParameters('issue.from_external_rule_engine', this.props.engine)}>
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.js b/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.js
index 781eebd1f06..b19581aea98 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.js
@@ -81,7 +81,7 @@ export default function IssueTitleBar(props /*: Props */) {
       />
 
       <div className="issue-row-meta">
-        <ul className="list-inline issue-meta-list">
+        <ul className="issue-meta-list">
           <li className="issue-meta">
             <IssueChangelog
               creationDate={issue.creationDate}
diff --git a/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.js b/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.js
index 5b900ac2e48..2ad9a5353f4 100644
--- a/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.js
+++ b/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.js
@@ -22,6 +22,7 @@ import React from 'react';
 import SimilarIssuesPopup from '../popups/SimilarIssuesPopup';
 import Toggler from '../../../components/controls/Toggler';
 import DropdownIcon from '../../../components/icons-components/DropdownIcon';
+import FilterIcon from '../../../components/icons-components/FilterIcon';
 import { Button } from '../../../components/ui/buttons';
 import { translate } from '../../../helpers/l10n';
 /*:: import type { Issue } from '../types'; */
@@ -68,8 +69,8 @@ export default class SimilarIssuesFilter extends React.PureComponent {
             aria-label={translate('issue.filter_similar_issues')}
             className="js-issue-filter button-link issue-action issue-action-with-options"
             onClick={this.handleClick}>
-            <i className="icon-filter icon-half-transparent" />
-            <DropdownIcon className="little-spacer-left" />
+            <FilterIcon className="icon-half-transparent" />
+            <DropdownIcon className="icon-half-transparent" />
           </Button>
         </Toggler>
       </div>
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.js.snap
index 0628de785bf..7ba9bfa806c 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.js.snap
@@ -48,8 +48,8 @@ exports[`should open the popup when the button is clicked 2`] = `
             date="2017-03-01T09:36:01+0100"
           />
         </span>
-        <i
-          className="icon-dropdown little-spacer-left"
+        <DropdownIcon
+          className="little-spacer-left"
         />
       </Button>
     </Tooltip>
@@ -96,8 +96,8 @@ exports[`should render correctly 1`] = `
             date="2017-03-01T09:36:01+0100"
           />
         </span>
-        <i
-          className="icon-dropdown little-spacer-left"
+        <DropdownIcon
+          className="little-spacer-left"
         />
       </Button>
     </Tooltip>
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.js.snap
index 91587572e88..edda212b2f0 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.js.snap
@@ -7,8 +7,10 @@ exports[`should render with the message and a link to open the rule 1`] = `
   Reduce the number of conditional operators (4) used in the expression
   <Button
     aria-label="issue.rule_details"
-    className="button-link issue-rule icon-ellipsis-h little-spacer-left"
+    className="button-link issue-rule little-spacer-left"
     onClick={[Function]}
-  />
+  >
+    <EllipsisIcon />
+  </Button>
 </div>
 `;
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.js.snap
index 93d4a3f72d2..47648a5f921 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.js.snap
@@ -19,7 +19,7 @@ exports[`should render the titlebar correctly 1`] = `
     className="issue-row-meta"
   >
     <ul
-      className="list-inline issue-meta-list"
+      className="issue-meta-list"
     >
       <li
         className="issue-meta"
@@ -102,7 +102,7 @@ exports[`should render the titlebar with the filter 1`] = `
     className="issue-row-meta"
   >
     <ul
-      className="list-inline issue-meta-list"
+      className="issue-meta-list"
     >
       <li
         className="issue-meta"
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.js b/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.js
index 2d3c2232f88..3a0a211f1d6 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.js
@@ -22,7 +22,7 @@ import React from 'react';
 import { translate } from '../../../helpers/l10n';
 import SelectList from '../../../components/common/SelectList';
 import SelectListItem from '../../../components/common/SelectListItem';
-import SeverityIcon from '../../../components/shared/SeverityIcon';
+import SeverityIcon from '../../../components/icons-components/SeverityIcon';
 import { DropdownOverlay } from '../../controls/Dropdown';
 /*:: import type { Issue } from '../types'; */
 
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.js b/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.js
index 7a28c6594ed..77273cd9f39 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.js
@@ -24,7 +24,8 @@ import SelectListItem from '../../../components/common/SelectListItem';
 import { DropdownOverlay } from '../../../components/controls/Dropdown';
 import SeverityHelper from '../../../components/shared/SeverityHelper';
 import StatusHelper from '../../../components/shared/StatusHelper';
-import QualifierIcon from '../../../components/shared/QualifierIcon';
+import QualifierIcon from '../../../components/icons-components/QualifierIcon';
+import TagsIcon from '../../../components/icons-components/TagsIcon';
 import IssueTypeIcon from '../../../components/ui/IssueTypeIcon';
 import Avatar from '../../../components/ui/Avatar';
 import { translate } from '../../../helpers/l10n';
@@ -116,8 +117,8 @@ export default class SimilarIssuesPopup extends React.PureComponent {
           {issue.tags != null &&
             issue.tags.map(tag => (
               <SelectListItem item={`tag###${tag}`} key={`tag###${tag}`}>
-                <i className="icon-tags icon-half-transparent little-spacer-right" />
-                {tag}
+                <TagsIcon className="icon-half-transparent little-spacer-right text-middle" />
+                <span className="text-middle">{tag}</span>
               </SelectListItem>
             ))}