Merge branch 'convert-trans-bg-to-css' into 'master'

Convert image diff background image to CSS

## What does this MR do?
Replaces the `trans_bg.gif` image used for image diff background image with a CSS implementation of the same background image

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

## Why was this MR needed?
Uses CSS to replace the use of an image so that webpage rendering is slightly improved

## What are the relevant issue numbers?
Closes #20500 

## Screenshots (if relevant)
Before:
![Screen_Shot_2016-08-01_at_12.29.10_PM](/uploads/8269877c561c29e6b0ca988079ff3fc6/Screen_Shot_2016-08-01_at_12.29.10_PM.png)

After:
![Screen_Shot_2016-08-01_at_12.29.16_PM](/uploads/cc88848b9c0e044445d19b889fd79271/Screen_Shot_2016-08-01_at_12.29.16_PM.png)

## Does this MR meet the acceptance criteria?

- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- [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)

See merge request !5598
This commit is contained in:
Jacob Schatz 2016-08-03 03:42:01 +00:00
commit 3552900733
3 changed files with 5 additions and 1 deletions

View file

@ -35,6 +35,7 @@ v 8.11.0 (unreleased)
- Bump gitlab_git to speedup DiffCollection iterations
- Make branches sortable without push permission !5462 (winniehell)
- Check for Ci::Build artifacts at database level on pipeline partial
- Convert image diff background image to CSS (ClemMakesApps)
- Make "New issue" button in Issue page less obtrusive !5457 (winniehell)
- Gitlab::Metrics.current_transaction needs to be public for RailsQueueDuration
- Fix search for notes which belongs to deleted objects

Binary file not shown.

Before

Width:  |  Height:  |  Size: 49 B

View file

@ -164,7 +164,10 @@
line-height: 0;
img {
border: 1px solid #fff;
background: image-url('trans_bg.gif');
background-image: linear-gradient(45deg, #e5e5e5 25%, transparent 25%, transparent 75%, #e5e5e5 75%, #e5e5e5 100%),
linear-gradient(45deg, #e5e5e5 25%, transparent 25%, transparent 75%, #e5e5e5 75%, #e5e5e5 100%);
background-size: 10px 10px;
background-position: 0 0, 5px 5px;
max-width: 100%;
}
&.deleted {