diff options
author | Fatih Acet <acetfatih@gmail.com> | 2016-10-05 21:34:37 +0000 |
---|---|---|
committer | Fatih Acet <acetfatih@gmail.com> | 2016-10-05 21:34:37 +0000 |
commit | 7e493b11546f15f7871a249474edf6afd418af89 (patch) | |
tree | 440c62febc6e00443a5c9022e9158d58f0247d79 | |
parent | 2d9c8f44659ffd09dd073358a7862f033ca468d8 (diff) | |
parent | 485a2a7af4ddeb861861c0669be8158ff54d90c9 (diff) | |
download | gitlab-ce-7e493b11546f15f7871a249474edf6afd418af89.tar.gz |
Merge branch 'flash-cherry-pick-error' into 'master'
Prevent flash alert text from being obscured when container is fluid
## What does this MR do?
Fixes [a regression](https://gitlab.com/gitlab-org/gitlab-ce/commit/a2af7790) that causes the text within server-initiated flash *alerts* (not flash *notices*) to be obscured when `.container-fluid` is applied. It was reported in relation to a cherry-picking flash alert, but the problem occurs with all server-initiated flash alerts contained by a fluid container.
## Are there points in the code the reviewer needs to double check?
Note that as part of this fix, I combined some duplicate code and removed `.flash-text` & `.content-wrapper` selectors as they didn't seem to be necessary.
I manually tested JS-initiated Flash alerts to make sure this doesn't affect their appearance. I also grepped around for anything else that might depend on these styles. Everything checked out. But... can *you* see something this is going to break?
## Why was this MR needed?
Affected users can't read flash alerts.
## Screenshots (if relevant)
Before:
![Screen_Shot_2016-10-05_at_3.02.38_PM](/uploads/af258585e428d82dc2b293434661790b/Screen_Shot_2016-10-05_at_3.02.38_PM.png)
After:
![Screen_Shot_2016-10-05_at_3.02.47_PM](/uploads/75a93235440e2b83088e66bbe53d6cee/Screen_Shot_2016-10-05_at_3.02.47_PM.png)
JS-initiated flash alert (unaffected):
![Screen_Shot_2016-10-05_at_3.39.57_PM](/uploads/ba678cfaeb09c639499059712a33abe8/Screen_Shot_2016-10-05_at_3.39.57_PM.png)
## Does this MR meet the acceptance criteria?
- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- [x] [Documentation created/updated](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/doc/development/doc_styleguide.md)
- [x] API support added
- Tests
- [] Added for this feature/bug
- [ ] 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 you do - 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?
https://gitlab.com/gitlab-org/gitlab-ce/issues/22915
cc: @jschatz1
See merge request !6694
-rw-r--r-- | CHANGELOG | 1 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/flash.scss | 9 |
2 files changed, 3 insertions, 7 deletions
diff --git a/CHANGELOG b/CHANGELOG index 07b2b23003b..856fb2849f5 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -33,6 +33,7 @@ v 8.13.0 (unreleased) - Only update issuable labels if they have been changed - Take filters in account in issuable counters. !6496 - Use custom Ruby images to test builds (registry.dev.gitlab.org/gitlab/gitlab-build-images:*) + - Prevent flash alert text from being obscured when container is fluid - Append issue template to existing description !6149 (Joseph Frazier) - Trending projects now only show public projects and the list of projects is cached for a day - Revoke button in Applications Settings underlines on hover. diff --git a/app/assets/stylesheets/framework/flash.scss b/app/assets/stylesheets/framework/flash.scss index 3ac1678dd05..a55dcf4a699 100644 --- a/app/assets/stylesheets/framework/flash.scss +++ b/app/assets/stylesheets/framework/flash.scss @@ -21,7 +21,8 @@ .flash-notice, .flash-alert { border-radius: $border-radius-default; - .container-fluid.container-limited.flash-text { + .container-fluid, + .container-fluid.container-limited { background: transparent; } } @@ -35,12 +36,6 @@ } } -.content-wrapper { - .flash-notice .container-fluid { - background-color: transparent; - } -} - @media (max-width: $screen-md-min) { ul.notes { .flash-container.timeline-content { |