Merge branch 'remove-pinto-from-flash' into 'master'

Remove pinTo from Flash

## What does this MR do?

- replace `pinTo` of `Flash` by `parent` parameter in constructor
- move positioning of layout containers from CoffeeScript to layout files
- adjust styling of inline flash messages

## Are there points in the code the reviewer needs to double check?

- display of flash messages in general

## Why was this MR needed?

- allow finding and positioning flash message containers within layout files
- allow adding different CSS classes to flash containers within layout files (necessary for fixing #18908)
- allow multiple flash messages to be displayed at different places at the same time
- make inline flash messages look nicer

## What are the relevant issue numbers?

closes #18908, closes part of #18897

## Screenshots

### Inline flash message (before)
![before](/uploads/c5b3cc05140eaeb9d14e481fa506ebbf/before.png)
![before-mobile](/uploads/004b1f2b9510bd97f4f8a7a6e56f17ef/before-mobile.png)

### Inline flash message (after)
![inline-flash-message](/uploads/fe2a23b63623612b696d529e81fa459e/inline-flash-message.png)
![inline-flash-mobile](/uploads/6207604acfebcf7402d77d5638c89ca8/inline-flash-mobile.png)

### Other flash messages (after)

![flash-message-issue](/uploads/d7e12bd0da68cfa333471ed102428cec/flash-message-issue.png)
---
![flash-new-project](/uploads/3465967dba83296068f154f149d26f64/flash-new-project.png)
---
![flash-sign-in](/uploads/4a5b317d5a369034f43343031607a0c2/flash-sign-in.png)
---
![flash-file-comment](/uploads/488a1119374be7e2173c0a590cfd8821/flash-file-comment.png)
---
![flash-fork](/uploads/f41964e8b910801e03eef3d7649e5009/flash-fork.png)
---
![flash-update-profile](/uploads/9fd972d6c6609fbbf86afcd99d343b5f/flash-update-profile.png)
---

### This is possible now

![flashs-everywhere](/uploads/07f425534511fb4ecaa1d7e2a9870787/flashs-everywhere.png)


See merge request !4854

1 files changed, 4 insertions, 4 deletions

diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee
index 0b7d8f64456..0ea54faae1a 100644
--- a/app/assets/javascripts/notes.js.coffee
+++ b/app/assets/javascripts/notes.js.coffee
@@ -194,8 +194,7 @@ class @Notes
   renderNote: (note) ->
     unless note.valid
       if note.award
-        flash = new Flash('You have already awarded this emoji!', 'alert')
-        flash.pinTo('.header-content')
+        new Flash('You have already awarded this emoji!', 'alert')
       return
 
     if note.award
@@ -325,6 +324,8 @@ class @Notes
     form.find("#note_position").remove()
     form.find("#note_type").remove()
 
+    @parentTimeline = form.parents('.timeline')
+
   ###
   General note form setup.
 
@@ -357,8 +358,7 @@ class @Notes
     @renderNote(note)
 
   addNoteError: (xhr, note, status) =>
-    flash = new Flash('Your comment could not be submitted! Please check your network connection and try again.', 'alert')
-    flash.pinTo('.md-area')
+    new Flash('Your comment could not be submitted! Please check your network connection and try again.', 'alert', @parentTimeline)
 
   ###
   Called in response to the new note form being submitted