Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on Dec 15, 2022. It is now read-only.

Diff color tweaks #1949

Merged
merged 4 commits into from
Feb 18, 2019
Merged

Diff color tweaks #1949

merged 4 commits into from
Feb 18, 2019

Conversation

simurai
Copy link
Contributor

@simurai simurai commented Feb 7, 2019 •
edited
Loading

Description of the Change

This makes the blue-ish background color weaker when selecting the whole hunk. But keeps it stronger when selecting individual lines/words/characters.

Some additional changes:

  • Tweaked the diff colors
  • Replaced the gutter icons to be text based. The icons felt a bit too bold.

Screenshot/Gif

Before After
screen shot 2019-02-07 at 5 40 10 pm screen shot 2019-02-07 at 5 39 34 pm

diff

Alternate Designs

  1. When clicking the "See All Staged Changes" button with the mouse, we could keep the focus on the button and not move it to the first hunk. That would also match the behaviour of single file diffs.
  2. We could differentiate between making a selections of single characters/words and selecting the whole line. Maybe have two classes github-FilePatchView-line--selected and github-FilePatchView-line--partiallySelected.
  3. Separate "selecting text/code" and "select to staging". Same behaviour as in Desktop. Maybe necessary for editable diffs.
  4. Also add diff coloring (red/green) to the gutters. Then when selecting characters/words, it's still easy to see if a line is deleted or added.

/cc @kuychaco ☝️

Benefits

Easier to read the diff when the first hunk gets automatically selected in commit previews.

Possible Drawbacks

The difference between a selected hunk and selected lines might be confusing?

Applicable Issues

Closes #1933

Metrics

N/A

Tests

Tested with Atom's bundled themes and a few community themes. Certain themes work better than others.

Documentation

N/A

Release Notes

N/A

User Experience Research (Optional)

N/A

@simurai simurai requested a review from a team February 7, 2019 08:49
@todo

This comment has been minimized.

Sign in to view
@codecov
Copy link

codecov bot commented Feb 7, 2019 •
edited
Loading

Codecov Report

Merging #1949 into master will increase coverage by <.01%.
The diff coverage is n/a.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #1949      +/-   ##
==========================================
+ Coverage   92.12%   92.13%   +<.01%     
==========================================
  Files         188      188              
  Lines       10807    10807              
  Branches     1581     1581              
==========================================
+ Hits         9956     9957       +1     
+ Misses        851      850       -1
Impacted Files Coverage Δ
lib/github-package.js 68.48% <0%> (+0.38%) ⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update d846182...ed7e328. Read the comment docs.

@simurai simurai mentioned this pull request Feb 7, 2019
Closed
@simurai
Copy link
Contributor Author

simurai commented Feb 18, 2019

Ok, let's merge this, regardless of potentially implementing one of the alternatives above ☝️.

@simurai simurai merged commit 81dbde7 into master Feb 18, 2019
@simurai simurai deleted the sm/diff-colors branch February 18, 2019 07:04
@vanessayuenn vanessayuenn mentioned this pull request Mar 6, 2019
Closed
9 tasks
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@simurai