Replace arrow icons in notes

app/assets/javascripts/notes.js

@@ -1336,11 +1336,12 @@ export default class Notes {
   toggleCommitList(e) {
     const $element = $(e.currentTarget);
     const $closestSystemCommitList = $element.siblings('.system-note-commit-list');
+    const $svgChevronUpElement = $element.find('svg.js-chevron-up');
+    const $svgChevronDownElement = $element.find('svg.js-chevron-down');
+
+    $svgChevronUpElement.toggleClass('gl-display-none');
+    $svgChevronDownElement.toggleClass('gl-display-none');
 
-    $element
-      .find('.fa')
-      .toggleClass('fa-angle-down')
-      .toggleClass('fa-angle-up');
     $closestSystemCommitList.toggleClass('hide-shade');
   }
 

app/views/shared/notes/_note.html.haml

@@ -63,7 +63,8 @@
         - if note.system
           .system-note-commit-list-toggler.hide
             = _("Toggle commit list")
-            %i.fa.fa-angle-down
+            = sprite_icon('chevron-down', size: 16, css_class: 'js-chevron-down gl-ml-1 gl-vertical-align-text-bottom')
+            = sprite_icon('chevron-up', size: 16, css_class: 'js-chevron-up gl-ml-1 gl-vertical-align-text-bottom gl-display-none')
       - if note.attachment.url
         .note-attachment
           - if note.attachment.image?

changelogs/unreleased/225893-replace-fa-angle-up-icons-with-gitlab-svg-angle-up-icon-2.yml

+---
+title: Replace fa-angle-up icons with GitLab SVG
+merge_request: 36429
+author:
+type: changed