diff options
author | Jacob Schatz <jschatz@gitlab.com> | 2016-06-30 02:13:56 +0300 |
---|---|---|
committer | Jacob Schatz <jschatz@gitlab.com> | 2016-06-30 02:13:56 +0300 |
commit | dbac53aa26e20f6aa9f2e6f9f355a3c983e474e1 (patch) | |
tree | 882fddafbe423a233da0bb24eabd16596632af4a /app/assets | |
parent | f7eceed64483ecc831156d2ab2541a6793e92868 (diff) | |
parent | c8d66594e0104a6647b403faea1283e430e158a5 (diff) |
Merge branch 'left-align-flash-messages' into 'master'
Align flash messages with left side of page content
## What does this MR do?
- align flash messages with left side of page content
## Are there points in the code the reviewer needs to double check?
- flash messages in general
## Why was this MR needed?
- flash messages didn't fit new design
## What are the relevant issue numbers?
closes #18688
## Screenshots
# Before
![failed-login](/uploads/fb57d288fb7ae775cc0b8dbb0c7b6af2/failed-login.png)
---
![explore-blocked-account](/uploads/aa6d5ff74a4c9ed29ed361f2ffdf5c8e/explore-blocked-account.png)
---
![project-blocked-account](/uploads/4f36118f5438d661ea202b180bf9cb8d/project-blocked-account.png)
---
![issue-blocked-account](/uploads/68e87385ec30952797dc5c1f8f36216d/issue-blocked-account.png)
---
![inline-flash](/uploads/c0aba047f90d56001265e37ba9751e19/inline-flash.png)
---
# After
![failed-login](/uploads/d45d2d832a16af8e1854f1832e7b87a4/failed-login.png)
---
![blocked-account](/uploads/ddcd3d23569ded403700c01934df61df/blocked-account.png)
---
![project-blocked-account](/uploads/9e286c3b95f70cae1819930a09cc1307/project-blocked-account.png)
---
![issue-blocked-account](/uploads/4fde8e770eab0dae03b25e1402f171a1/issue-blocked-account.png)
---
The left padding will be fixed by !4854
![inline-flash](/uploads/081b824b99d8ca65d67e9d15778a991d/inline-flash.png)
---
![flash-dismissed](/uploads/641e6227050de22e0df9a85ffca4ced1/flash-dismissed.png)
See merge request !4959
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/flash.js.coffee | 12 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/flash.scss | 7 |
2 files changed, 17 insertions, 2 deletions
diff --git a/app/assets/javascripts/flash.js.coffee b/app/assets/javascripts/flash.js.coffee index 4f73d215b85..b76d214790a 100644 --- a/app/assets/javascripts/flash.js.coffee +++ b/app/assets/javascripts/flash.js.coffee @@ -4,11 +4,19 @@ class @Flash @flash.html("") innerDiv = $('<div/>', - class: "flash-#{type}", - text: message + class: "flash-#{type}" ) innerDiv.appendTo(".flash-container") + textDiv = $("<div/>", + class: "flash-text", + text: message + ) + textDiv.appendTo(innerDiv) + + if @flash.parent().hasClass('content-wrapper') + textDiv.addClass('container-fluid container-limited') + @flash.click -> $(@).fadeOut() @flash.show() diff --git a/app/assets/stylesheets/framework/flash.scss b/app/assets/stylesheets/framework/flash.scss index 1bfd0213995..a951a2b97fe 100644 --- a/app/assets/stylesheets/framework/flash.scss +++ b/app/assets/stylesheets/framework/flash.scss @@ -16,4 +16,11 @@ @extend .alert-danger; margin: 0; } + + .flash-notice, .flash-alert { + .container-fluid.flash-text { + background: transparent; + } + } } + |