Merge branch '24737-labeling-system-notes-downcase-labels' into 'master'

Resolve "Labeling system notes downcase labels"

## What does this MR do?
This MR fixes issues of label gets lowercase in system note as describe in #24737

## Are there points in the code the reviewer needs to double check?
NR
## Why was this MR needed?
This MR fixes the regression of becoming labels and its description and title lowercase in system note
  
## Screenshots (if relevant)
**Before:**
![before](/uploads/ac99fd5d1219ee3b4b7c699319267087/before.png)

**After:** 
![after](/uploads/d1b6413c857d18f122252f421ac498b0/after.png)

## Does this MR meet the acceptance criteria?

- [x] [Changelog entry](https://docs.gitlab.com/ce/development/changelog.html) added
- [ ] [Documentation created/updated](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/doc/development/doc_styleguide.md)
- [ ] API support added
- Tests
  - [ ] Added for this feature/bug
  - [x] All builds are passing
- [x] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if it does - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)

## What are the relevant issue numbers?


Closes #24737 
Closes #24751

See merge request !7636

app/assets/javascripts/notes.js

@@ -113,6 +113,7 @@
       $(document).off("click", ".js-note-discard");
       $(document).off("keydown", ".js-note-text");
       $(document).off('click', '.js-comment-resolve-button');
+      $(document).off("click", '.system-note-commit-list-toggler');
       $('.note .js-task-list-container').taskList('disable');
       return $(document).off('tasklist:changed', '.note .js-task-list-container');
     };

app/assets/stylesheets/pages/notes.scss

@@ -43,12 +43,25 @@ ul.notes {
     }
 
     .system-note-message {
+      display: inline-block;
+
+      &::first-letter {
         text-transform: lowercase;
+      }
 
       a {
         color: $gl-link-color;
         text-decoration: none;
       }
+
+      p {
+        display: inline-block;
+        margin: 0;
+
+        &::first-letter {
+          text-transform: lowercase;
+        }
+      }
     }
 
     .timeline-content {
@@ -62,6 +75,11 @@ ul.notes {
         display: none;
         padding: 10px 0 0;
         cursor: pointer;
+
+        &:hover {
+          color: $gl-link-color;
+          text-decoration: underline;
+        }
       }
 
       .note-text {
@@ -87,6 +105,16 @@ ul.notes {
             display: none;
           }
 
+          p:last-child {
+            a {
+              color: $gl-text-color;
+
+              &:hover {
+                color: $gl-link-color;
+              }
+            }
+          }
+
           &::after {
             content: '';
             width: 100%;
@@ -188,11 +216,6 @@ ul.notes {
       padding-bottom: 3px;
       padding-right: 20px;
 
-      p {
-        display: inline;
-        margin: 0;
-      }
-
       @media (min-width: $screen-sm-min) {
         padding-right: 0;
       }

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

@@ -16,7 +16,7 @@
             commented
           - if note.system
             %span{class: 'system-note-message'}
-              = h(note.note_html.downcase.html_safe)
+              = note.redacted_note_html
           %a{ href: "##{dom_id(note)}" }
             = time_ago_with_tooltip(note.created_at, placement: 'bottom', html_class: 'note-created-ago')
         - unless note.system?