2011-01-25 20:31:40 +01:00
|
|
|
/**
|
|
|
|
* @provides differential-changeset-view-css
|
|
|
|
*/
|
|
|
|
|
2011-06-10 17:34:17 +02:00
|
|
|
.differential-changeset {
|
|
|
|
z-index: 2;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
2011-01-25 20:31:40 +01:00
|
|
|
.differential-diff {
|
2011-06-10 17:34:17 +02:00
|
|
|
background: transparent;
|
2011-01-25 20:31:40 +01:00
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td {
|
|
|
|
/* using monospace fonts makes ex/em most useful:
|
|
|
|
*
|
|
|
|
* Unfortunately, firefox 3.6 renders diffs columns for added and removed
|
|
|
|
* files "way-too-wide" when given em as the dimension measurement, so we
|
|
|
|
* use an eyeballed ex equivalent and reset it to the ch character width
|
|
|
|
* measurement for browsers that support that css3 measurement.
|
|
|
|
*/
|
|
|
|
width: 88ex;
|
|
|
|
width: 81ch;
|
|
|
|
/*
|
|
|
|
Disable ligatures in Firefox. Firefox 3 has fancypants ligature support, but
|
|
|
|
it gets applied to monospaced fonts, which sucks because it means that the
|
|
|
|
"fi" ligature only takes up one character, e.g. It's probably the font's
|
|
|
|
fault that it even specifies ligatures (seriously, what the hell?) but
|
|
|
|
that's hard to fix and this is "easy" to "fix": custom letter spacing
|
|
|
|
disables ligatures, as long as it's at least 0.008333-repeating pixels of
|
|
|
|
custom letter spacing. I have no idea where this number comes from, but note
|
|
|
|
that .83333.. = 5/6. -epriestley
|
|
|
|
*/
|
|
|
|
letter-spacing: 0.0083334px;
|
|
|
|
vertical-align: top;
|
|
|
|
white-space: pre;
|
|
|
|
padding: 0 8px 1px;
|
|
|
|
line-height: 16px;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff th {
|
|
|
|
text-align: right;
|
|
|
|
padding: 2px 6px;
|
|
|
|
width: 44px;
|
|
|
|
vertical-align: top;
|
|
|
|
background: #eeeeee;
|
|
|
|
color: #888888;
|
2012-04-11 00:00:09 +02:00
|
|
|
cursor: pointer;
|
2011-01-25 20:31:40 +01:00
|
|
|
border-style: solid;
|
|
|
|
border-width: 0px 1px;
|
|
|
|
border-color: #eeeeee #999999 #eeeeee #dddddd;
|
|
|
|
font-weight: bold;
|
|
|
|
font-family: "Verdana";
|
|
|
|
font-size: 11px;
|
|
|
|
overflow: hidden;
|
Use "user-select: none" to provide a visual cue about copy/paste JS magic
Summary:
- For line numbers, use "user-select: none" to make them unselectable. This provides a stronger visual cue that copy/paste is enchanted.
- In Paste, make it look sensible again after the blame-on-blame refactor in Diffusion. See also TODO to share this code formally.
- In Diffusion, use the "phabricator-oncopy" behavior.
NOTE: I left blame/commit columns selectable in Diffusion, since you might reasonably want to copy/paste them?
NOTE: In Differential, the left side of the diff still highlights, even though it will be copied only if you select part of a line on the left and nothing else. But this seemed like a reasonable behavior, so I left it.
Test Plan:
- Looked at Paste. Saw a nice line number column. Selected text, got the expected selection. Copied text, got the expected copy.
- Looked at Diffusion. Saw a nice line number column, still. Selected text, got expected selection. Copied text, got expected copy.
- Looked at Differential. Highlighted stuff, got expected results. Copied stuff, got expected results.
Reviewers: btrahan, vrana, jungejason
Reviewed By: vrana
CC: aran
Maniphest Tasks: T1123
Differential Revision: https://secure.phabricator.com/D2242
2012-04-17 00:55:16 +02:00
|
|
|
|
|
|
|
-moz-user-select: -moz-none;
|
|
|
|
-khtml-user-select: none;
|
|
|
|
-webkit-user-select: none;
|
|
|
|
-ms-user-select: none;
|
|
|
|
user-select: none;
|
2011-01-25 20:31:40 +01:00
|
|
|
}
|
|
|
|
|
2012-04-11 00:00:09 +02:00
|
|
|
.differential-changeset-immutable .differential-diff th {
|
|
|
|
cursor: auto;
|
|
|
|
}
|
|
|
|
|
2011-01-25 20:31:40 +01:00
|
|
|
.differential-diff td.old {
|
|
|
|
background: #ffd0d0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td.new {
|
|
|
|
background: #d0ffd0;
|
|
|
|
}
|
|
|
|
|
2012-06-15 09:53:26 +02:00
|
|
|
.differential-diff td.old-rebase {
|
|
|
|
background: #ffeeee;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td.new-rebase {
|
|
|
|
background: #eeffee;
|
|
|
|
}
|
|
|
|
|
2011-01-25 20:31:40 +01:00
|
|
|
.differential-diff td.old-full,
|
|
|
|
.differential-diff td.old span.bright {
|
|
|
|
background: #ffaaaa;
|
|
|
|
}
|
|
|
|
|
2012-05-05 02:41:06 +02:00
|
|
|
.differential-diff td.new-full,
|
|
|
|
.differential-diff td.new span.bright {
|
|
|
|
background: #aaffaa;
|
2012-04-30 06:35:43 +02:00
|
|
|
}
|
|
|
|
|
2012-05-05 02:41:06 +02:00
|
|
|
.differential-diff td.copy {
|
|
|
|
width: 6px;
|
|
|
|
padding: 0;
|
2012-05-05 02:41:06 +02:00
|
|
|
}
|
|
|
|
|
2012-05-05 02:41:06 +02:00
|
|
|
.differential-diff td.new-copy,
|
|
|
|
.differential-diff td.new-copy span.bright {
|
|
|
|
background: #ffffaa;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td.new-move,
|
|
|
|
.differential-diff td.new-move span.bright {
|
|
|
|
background: #eeee44;
|
2011-01-25 20:31:40 +01:00
|
|
|
}
|
|
|
|
|
2012-03-15 00:45:40 +01:00
|
|
|
.differential-diff td.comment {
|
|
|
|
background: #dddddd;
|
|
|
|
}
|
|
|
|
|
Show coverage information in Differential
Summary:
Render coverage information in the right gutter, if available.
We could render some kind of summary report deal too but this seems like a good
start.
Test Plan:
- Looked at diffs with coverage.
- Looked at diffs without coverage.
- Used inline comments, diff-of-diff, "show more", "show entire file", "show
generated file", "undo". Nothing seemed disrupted by the addition of a 5th
column.
Reviewers: btrahan, tuomaspelkonen, jungejason
Reviewed By: btrahan
CC: zeeg, aran, epriestley
Maniphest Tasks: T140
Differential Revision: https://secure.phabricator.com/D1527
2012-01-31 21:07:47 +01:00
|
|
|
.differential-diff td.cov {
|
|
|
|
width: 12px;
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
td.cov-U {
|
2012-03-13 04:04:12 +01:00
|
|
|
background: #dd8866;
|
Show coverage information in Differential
Summary:
Render coverage information in the right gutter, if available.
We could render some kind of summary report deal too but this seems like a good
start.
Test Plan:
- Looked at diffs with coverage.
- Looked at diffs without coverage.
- Used inline comments, diff-of-diff, "show more", "show entire file", "show
generated file", "undo". Nothing seemed disrupted by the addition of a 5th
column.
Reviewers: btrahan, tuomaspelkonen, jungejason
Reviewed By: btrahan
CC: zeeg, aran, epriestley
Maniphest Tasks: T140
Differential Revision: https://secure.phabricator.com/D1527
2012-01-31 21:07:47 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
td.cov-C {
|
2012-03-13 04:04:12 +01:00
|
|
|
background: #66bbff;
|
Show coverage information in Differential
Summary:
Render coverage information in the right gutter, if available.
We could render some kind of summary report deal too but this seems like a good
start.
Test Plan:
- Looked at diffs with coverage.
- Looked at diffs without coverage.
- Used inline comments, diff-of-diff, "show more", "show entire file", "show
generated file", "undo". Nothing seemed disrupted by the addition of a 5th
column.
Reviewers: btrahan, tuomaspelkonen, jungejason
Reviewed By: btrahan
CC: zeeg, aran, epriestley
Maniphest Tasks: T140
Differential Revision: https://secure.phabricator.com/D1527
2012-01-31 21:07:47 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
td.cov-N {
|
|
|
|
background: #ddeeff;
|
|
|
|
}
|
|
|
|
|
|
|
|
td.cov-X {
|
|
|
|
background: #aa00aa;
|
|
|
|
}
|
|
|
|
|
2012-05-05 01:47:39 +02:00
|
|
|
.differential-diff td.source-cov-C,
|
|
|
|
.differential-diff td.source-cov-C span.bright {
|
2012-03-13 04:04:12 +01:00
|
|
|
background: #cceeff;
|
|
|
|
}
|
|
|
|
|
2012-05-05 01:47:39 +02:00
|
|
|
.differential-diff td.source-cov-U,
|
|
|
|
.differential-diff td.source-cov-U span.bright {
|
2012-03-13 04:04:12 +01:00
|
|
|
background: #ffbb99;
|
|
|
|
}
|
|
|
|
|
2012-05-05 01:47:39 +02:00
|
|
|
.differential-diff td.source-cov-N,
|
|
|
|
.differential-diff td.source-cov-N span.bright {
|
2012-03-13 04:04:12 +01:00
|
|
|
background: #f3f6ff;
|
|
|
|
}
|
|
|
|
|
2011-01-25 20:31:40 +01:00
|
|
|
.differential-diff td.show-more,
|
|
|
|
.differential-diff td.differential-shield {
|
|
|
|
background: #ffffee;
|
|
|
|
padding: 1em;
|
|
|
|
text-align: center;
|
|
|
|
font-family: "Verdana";
|
|
|
|
font-size: 11px;
|
|
|
|
border: 1px solid #ccccaa;
|
|
|
|
white-space: normal;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td.show-more {
|
|
|
|
color: #999966;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td.differential-shield {
|
|
|
|
text-align: center;
|
|
|
|
max-width: 1160px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-diff td.differential-shield a {
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-meta-notice {
|
|
|
|
border: 1px solid #ffdd99;
|
|
|
|
background: #ffeeaa;
|
|
|
|
font-family: "Verdana";
|
|
|
|
font-size: 11px;
|
|
|
|
padding: 1em;
|
|
|
|
margin: 0 0 6px 0;
|
|
|
|
}
|
2011-01-26 00:19:06 +01:00
|
|
|
|
|
|
|
.differential-changeset h1 {
|
|
|
|
font-size: 14px;
|
|
|
|
font-weight: bold;
|
|
|
|
padding: 2px 0 8px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-changeset {
|
|
|
|
margin: 0.5em 0;
|
|
|
|
padding: 10px 0px 20px;
|
|
|
|
}
|
2011-02-02 00:52:04 +01:00
|
|
|
|
|
|
|
.differential-reticle {
|
|
|
|
background: #ffeeaa;
|
|
|
|
border: 1px solid #ffcc00;
|
|
|
|
position: absolute;
|
|
|
|
z-index: 2;
|
|
|
|
opacity: 0.5;
|
|
|
|
top: 0px;
|
|
|
|
left: 0px;
|
|
|
|
}
|
|
|
|
|
2012-02-29 23:28:48 +01:00
|
|
|
.differential-inline-comment,
|
|
|
|
.differential-inline-comment-edit {
|
2011-02-02 01:42:36 +01:00
|
|
|
background: #f9f9f1;
|
|
|
|
border: 1px solid #aaaa88;
|
|
|
|
font-family: Verdana;
|
|
|
|
font-size: 11px;
|
2012-02-29 23:28:48 +01:00
|
|
|
margin: 6px 0px;
|
2011-02-02 01:42:36 +01:00
|
|
|
padding: 8px 10px;
|
|
|
|
width: 100%;
|
|
|
|
-moz-box-sizing: border-box;
|
|
|
|
-webkit-box-sizing: border-box;
|
2011-02-14 01:00:21 +01:00
|
|
|
overflow: hidden;
|
|
|
|
max-width: 520px;
|
|
|
|
white-space: normal;
|
2011-02-02 01:42:36 +01:00
|
|
|
}
|
|
|
|
|
2011-06-14 21:42:27 +02:00
|
|
|
.differential-inline-comment-unsaved-draft {
|
|
|
|
background: #f1f1f1;
|
|
|
|
border: 1px dashed #666666;
|
|
|
|
}
|
|
|
|
|
2011-02-02 01:42:36 +01:00
|
|
|
.differential-inline-comment-head {
|
|
|
|
font-weight: bold;
|
|
|
|
color: #333333;
|
|
|
|
border-bottom: 1px solid #ccccaa;
|
|
|
|
padding-bottom: 6px;
|
|
|
|
margin-bottom: 4px;
|
|
|
|
}
|
|
|
|
|
2011-06-14 21:42:27 +02:00
|
|
|
.differential-inline-comment-unsaved-draft .differential-inline-comment-head {
|
|
|
|
border-bottom: 1px solid #aaaaaa;
|
|
|
|
}
|
|
|
|
|
2012-01-04 18:10:37 +01:00
|
|
|
.differential-inline-comment-synthetic {
|
|
|
|
background: #efffff;
|
|
|
|
border: 1px solid #20dfdf;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-inline-comment-synthetic .differential-inline-comment-head {
|
|
|
|
border-bottom: 1px solid #20dfdf;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2011-02-02 01:42:36 +01:00
|
|
|
.differential-inline-comment-links,
|
|
|
|
.differential-inline-comment-line {
|
|
|
|
font-weight: normal;
|
|
|
|
font-style: italic;
|
|
|
|
color: #666666;
|
|
|
|
float: right;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
|
2011-02-02 19:10:25 +01:00
|
|
|
.differential-inline-comment-links {
|
|
|
|
margin-left: 8px;
|
2011-02-02 01:42:36 +01:00
|
|
|
font-style: normal;
|
|
|
|
}
|
2011-02-05 02:53:14 +01:00
|
|
|
|
|
|
|
|
|
|
|
.differential-inline-comment-edit-textarea {
|
2012-02-29 23:28:48 +01:00
|
|
|
width: 99%;
|
2011-02-05 02:53:14 +01:00
|
|
|
height: 12em;
|
|
|
|
}
|
2011-05-06 21:58:53 +02:00
|
|
|
|
|
|
|
.differential-changeset-buttons {
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-changeset-buttons a.button {
|
|
|
|
margin-left: 8px;
|
|
|
|
}
|
2011-06-08 03:59:42 +02:00
|
|
|
|
|
|
|
.differential-property-table {
|
|
|
|
width: auto;
|
|
|
|
margin: .75em auto;
|
|
|
|
background: #e3e3e3;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table th {
|
|
|
|
text-align: right;
|
|
|
|
width: 10em;
|
|
|
|
font-weight: bold;
|
|
|
|
color: #666666;
|
|
|
|
white-space: nowrap;
|
|
|
|
padding: 4px 8px;
|
|
|
|
border-right: 1px solid #666666;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table td {
|
|
|
|
padding: 4px 8px;
|
|
|
|
width: 35em;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table td em {
|
|
|
|
color: #888888;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table tr.property-table-header th,
|
|
|
|
.differential-property-table tr.property-table-header td {
|
|
|
|
text-align: center;
|
|
|
|
font-weight: bold;
|
|
|
|
border-bottom: 1px solid #666666;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table td.oval {
|
|
|
|
background: #ffd0d0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table td.nval {
|
|
|
|
background: #d0ffd0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table tr.property-table-header td.oval {
|
|
|
|
background: #ffaaaa;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-property-table tr.property-table-header td.nval {
|
|
|
|
background: #aaffaa;
|
|
|
|
}
|
Add "Undo" for editing Differential inline comments
Summary:
When a user hits 'cancel' on a 'new', 'edit', or 'reply' operation, add a little
"Changes discarded. __Undo__" insert so they can get their change back. No undo
for delete since there's an explicit prompt. Once this lands we can make
'escape' work again to close dialogs.
This change started feeling really good when I was merging all the duplicate
code and making things more consistent, but by the time I started writing client
rendering it felt gross. I'm not really thrilled with it but I guess it's a step
forward? The feature seems pretty OK in practice. Let me know how much barfing
this causes and I can try to remedy the most acute concerns.
This also fixes a bug where replies always (?) appear on the 'new' side of the
diff (I think?).
Test Plan:
Applied 'new', 'edit', 'delete' and 'reply' operations, pressed 'cancel' and
'okay' in each case, with and without changing text where relevant. All
behaviors seem to conform with expectations, except that canceling out of 'edit'
without changing the text gives you an option to undo when it shouldn't really.
There's no super easy way to get at the original text right now.
Reviewed By: aran
Reviewers: aran, jungejason, tuomaspelkonen
CC: simpkins, aran, epriestley
Differential Revision: 406
2011-06-08 01:11:10 +02:00
|
|
|
|
|
|
|
.differential-inline-undo {
|
|
|
|
padding: 4px;
|
|
|
|
text-align: center;
|
|
|
|
background: #ffeeaa;
|
|
|
|
margin: 3px 0 1px;
|
|
|
|
font: 11px "Verdana";
|
|
|
|
color: 444444;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-inline-undo a {
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
2012-02-29 23:28:48 +01:00
|
|
|
|
|
|
|
.differential-inline-comment-edit {
|
|
|
|
padding: 8px 18px 8px 12px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-inline-comment-edit-buttons {
|
|
|
|
padding: 2px 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-inline-comment-edit-buttons button {
|
|
|
|
float: right;
|
|
|
|
margin-left: 6px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-inline-comment-edit-title {
|
|
|
|
font-weight: bold;
|
|
|
|
color: #333333;
|
|
|
|
border-bottom: 1px solid #ccccaa;
|
|
|
|
padding-bottom: 2px;
|
|
|
|
margin-bottom: 6px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* When the inline editor is active, disable all the other inline comment links
|
|
|
|
on the page ("Edit", "Reply", "Delete", etc). The goal here is to prevent
|
|
|
|
issues where you open up multiple editors and run into problems with
|
|
|
|
assumptions about modalness. They are disabled explicitly by the JS, but
|
|
|
|
render them in a disabled state as well.
|
|
|
|
*/
|
|
|
|
.inline-editor-active .differential-inline-comment-links a,
|
|
|
|
.inline-editor-active .differential-inline-comment-links a:hover,
|
|
|
|
.inline-editor-active .differential-inline-comment-links a:active {
|
|
|
|
color: #888888;
|
|
|
|
cursor: normal;
|
|
|
|
text-decoration: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Create a wide band of color behind the inline edit interface so it is easy
|
|
|
|
to find by skimming the page while scrolling.
|
|
|
|
*/
|
|
|
|
tr.inline-comment-splint {
|
|
|
|
background: #f9f1d5;
|
|
|
|
}
|
|
|
|
|
|
|
|
tr.differential-inline-hidden {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
tr.differential-inline-loading {
|
|
|
|
opacity: 0.5;
|
|
|
|
}
|
2012-03-27 06:57:51 +02:00
|
|
|
|
|
|
|
|
|
|
|
/* In the document, the anchor is positioned inside the inline comment, but
|
|
|
|
this makes the browser jump into the comment so the top isn't visible.
|
|
|
|
Instead, artificially position it a bit above the comment so we'll jump a
|
|
|
|
bit before the comment. This allows us to see the entire comment (and
|
|
|
|
generally the commented-on lines, at least in the case of one or two-line
|
|
|
|
comments) after the jump.
|
|
|
|
*/
|
|
|
|
.differential-inline-comment-anchor {
|
|
|
|
position: absolute;
|
|
|
|
display: block;
|
|
|
|
margin-top: -72px;
|
|
|
|
}
|
2012-05-01 21:09:50 +02:00
|
|
|
|
|
|
|
.differential-loading a {
|
|
|
|
color: #3b5998;
|
|
|
|
}
|
|
|
|
|
|
|
|
.differential-loading {
|
|
|
|
color: #999966;
|
|
|
|
background: #ffffee;
|
|
|
|
border: 1px solid #ccccaa;
|
|
|
|
padding: 1em;
|
|
|
|
text-align: center;
|
|
|
|
font-size: 11px;
|
|
|
|
}
|