Make diff line-marker non-selectable

[zeripath]

This PR makes the first character of the diff line non-selectable.

Fixes #4076

[codecov-io]

Codecov Report

Merging #7279 into master will decrease coverage by 0.01%.
The diff coverage is 70%.

@@            Coverage Diff             @@
##           master    #7279      +/-   ##
==========================================
- Coverage   41.17%   41.15%   -0.02%     
==========================================
  Files         464      464              
  Lines       62771    62763       -8     
==========================================
- Hits        25846    25832      -14     
  Misses      33537    33537              
- Partials     3388     3394       +6

Impacted Files	Coverage Δ
models/git_diff.go	68.04% <70%> (-0.45%)	⬇️
models/issue_list.go	66.06% <0%> (-1.78%)	⬇️
models/repo_list.go	72.08% <0%> (-1.02%)	⬇️
models/issue.go	48.74% <0%> (+0.08%)	⬆️
modules/log/event.go	65.64% <0%> (+1.02%)	⬆️

---

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 baefea3...c8d8539. Read the comment docs.

[mrsdizzie]

While testing this I found out that while webkit obeys the "don't select" part, it still copies the contents if something around it has been selected:

Then the copied text is:

# repo38
2	
+
3	
+Description for repo38

This appears to be an old issue unfortunately, https://bugs.webkit.org/show_bug.cgi?id=80159

I don't have this issue on Github or other similar sites, so I tried to see what was different:

It appears Github gets this to work through adding the line numbers and +/- using a pseudo class, like:

.blob-num:before {
content: attr(data-line-number);
}

Probably similar to what @silverwind was mentioning in the linked Issue.

I tried to create a really small example of how this might look to see if it would work on Safari and it does seem to:

https://codepen.io/mrsdizzie/pen/agWNwL

Knowledge of HTML/CSS is pretty limited though

[zeripath]

@mrsdizzie OK done.

[mrsdizzie]

Should this have been in .diff-file-box not .non-diff-file-content ? Or maybe it belongs in both? I don't see the line numbers in a commit diff with the latest push

[zeripath]

Damn you're right. Don't know how I missed that.

[mrsdizzie]

Aside from the comment above about line numbers the copy/paste now works in Safari, thanks!!

Also this is totally non blocking but since you are changing it:

I think it would nice if the +/- were in their own as well, since it would/could give a bit more padding like in most the diffs here on Github (but not the comments on diffs strangely). Also on Safari when it is part of the same content it still lets you visually select the +/- chars on lines that also have selectable text, which might make people think that it will copy them as well.

It doesn't actually copy them any more so the real problem is solved and that is just a slight cosmetic issue at that point. Could be done in a separate PR if needed though.

[zeripath]

OK @mrsdizzie I think that's done

[mrsdizzie]

Nice, looks great!

[zeripath]

make lg-tm work

[silverwind]

Thanks, the +/- issue looks solved nicely. In Firefox, I do observe extraneous newlines being copied (4 newlines for each actual newline). Probably need to remove some whitespace inside the HTML tags holding the code lines.

[zeripath]

Hmm is that new? I haven't actually changed the template part that renders the code line.

[silverwind]

I think previously it was 3 newlines per line, with the introduction of .lines-type-marker it became 4. #7288 should solve it at least for Firefox.