Problem/Motivation

In a revision diff view, text changes are highlighted with background colour (deletions in pink, additions in green), but image changes are not affected by these styles.

Steps to reproduce

1. edit a node and add or delete an image
2. compare the revision
3. inspect the image

Proposed resolution

tbc - add a border/margin around the image?

Remaining tasks

User interface changes

API changes

Data model changes

Issue fork diff-3328297

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

malcomio created an issue. See original summary.

malcomio’s picture

Not sure about the approach in https://git.drupalcode.org/project/diff/-/merge_requests/25 - adding padding may be intrusive.

malcomio’s picture

Status: Active » Needs review

heddn made their first commit to this issue’s fork.

heddn’s picture

Version: 8.x-1.x-dev » 2.x-dev
Status: Needs review » Needs work
Issue tags: +Needs screenshots

Can we post some screenshots of the before/after?

malcomio’s picture

Status: Needs work » Needs review
StatusFileSize
new1.21 MB

Here's how it looks:
before and after screenshot of diff tool

heddn’s picture

Status: Needs review » Reviewed & tested by the community
Issue tags: -Needs screenshots

Seems like a relatively helpful change.

acbramley’s picture

Status: Reviewed & tested by the community » Needs work

Pipeline is failing.

malcomio’s picture

Status: Needs work » Needs review

The test failures relate to PHP code sniffer issues in files that aren't being changed - this change is only a CSS change.

Have merged 2.x into this branch and pushed, and the pipeline succeeded.

acbramley’s picture

StatusFileSize
new393.25 KB

This is looking good, however I don't think we should add the padding to non img diffs. I've added a :has selector to fix that. Here's what it looks like now:

diff example