@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
Clean up image file diffs UI
Summary: Uses AphrontTable now, cleans up interactions. Fixes T5874, Fixes T4910
Test Plan:
tested a large image
{F192585}
Reviewers: btrahan, epriestley
Reviewed By: epriestley
Subscribers: epriestley, Korvin
Maniphest Tasks: T4910, T5874
Differential Revision: https://secure.phabricator.com/D10296
+49
-61
+14
-12
resources/celerity/map.php
+14
-12
resources/celerity/map.php
···
7
7
*/
8
8
return array(
9
9
'names' => array(
10
-
'core.pkg.css' => '5e4bb6d1',
11
-
'core.pkg.js' => '7c8455ef',
10
+
'core.pkg.css' => '740b85f8',
11
+
'core.pkg.js' => 'f67c8265',
12
12
'darkconsole.pkg.js' => 'df001cab',
13
-
'differential.pkg.css' => '4a93db37',
13
+
'differential.pkg.css' => '8f46d832',
14
14
'differential.pkg.js' => 'eb182ccd',
15
15
'diffusion.pkg.css' => '591664fa',
16
16
'diffusion.pkg.js' => 'bfc0737b',
···
55
55
'rsrc/css/application/dashboard/dashboard.css' => 'a2bfdcbf',
56
56
'rsrc/css/application/diff/inline-comment-summary.css' => '8cfd34e8',
57
57
'rsrc/css/application/differential/add-comment.css' => 'c478bcaa',
58
-
'rsrc/css/application/differential/changeset-view.css' => 'ff8eacf8',
58
+
'rsrc/css/application/differential/changeset-view.css' => 'a6626a0c',
59
59
'rsrc/css/application/differential/core.css' => '7ac3cabc',
60
60
'rsrc/css/application/differential/results-table.css' => '239924f9',
61
61
'rsrc/css/application/differential/revision-comment.css' => '48186045',
···
104
104
'rsrc/css/application/tokens/tokens.css' => '3d0f239e',
105
105
'rsrc/css/application/uiexample/example.css' => '528b19de',
106
106
'rsrc/css/core/core.css' => '40151074',
107
-
'rsrc/css/core/remarkup.css' => '7fd5585f',
107
+
'rsrc/css/core/remarkup.css' => 'da8f5d5b',
108
108
'rsrc/css/core/syntax.css' => '863f3cd8',
109
109
'rsrc/css/core/z-index.css' => '44e1d311',
110
110
'rsrc/css/diviner/diviner-shared.css' => '38813222',
···
447
447
'rsrc/js/core/Notification.js' => '0c6946e7',
448
448
'rsrc/js/core/Prefab.js' => 'bbae734c',
449
449
'rsrc/js/core/ShapedRequest.js' => '7cbe244b',
450
-
'rsrc/js/core/TextAreaUtils.js' => 'b3ec3cfc',
450
+
'rsrc/js/core/TextAreaUtils.js' => '5c93c52c',
451
451
'rsrc/js/core/ToolTip.js' => '3915d490',
452
452
'rsrc/js/core/behavior-active-nav.js' => 'e379b58e',
453
453
'rsrc/js/core/behavior-audio-source.js' => '59b251eb',
···
520
520
'conpherence-notification-css' => '04a6e10a',
521
521
'conpherence-update-css' => '1099a660',
522
522
'conpherence-widget-pane-css' => 'bf275a6c',
523
-
'differential-changeset-view-css' => 'ff8eacf8',
523
+
'differential-changeset-view-css' => 'a6626a0c',
524
524
'differential-core-view-css' => '7ac3cabc',
525
525
'differential-inline-comment-editor' => 'f2441746',
526
526
'differential-results-table-css' => '239924f9',
···
732
732
'phabricator-phtize' => 'd254d646',
733
733
'phabricator-prefab' => 'bbae734c',
734
734
'phabricator-profile-css' => 'b459416e',
735
-
'phabricator-remarkup-css' => '7fd5585f',
735
+
'phabricator-remarkup-css' => 'da8f5d5b',
736
736
'phabricator-search-results-css' => 'f240504c',
737
737
'phabricator-shaped-request' => '7cbe244b',
738
738
'phabricator-side-menu-view-css' => 'a2ccd7bd',
739
739
'phabricator-slowvote-css' => '266df6a1',
740
740
'phabricator-source-code-view-css' => '7d346aa4',
741
741
'phabricator-standard-page-view' => '517cdfb1',
742
-
'phabricator-textareautils' => 'b3ec3cfc',
742
+
'phabricator-textareautils' => '5c93c52c',
743
743
'phabricator-tooltip' => '3915d490',
744
744
'phabricator-transaction-view-css' => '5d0cae25',
745
745
'phabricator-ui-example-css' => '528b19de',
···
1194
1194
'javelin-stratcom',
1195
1195
'javelin-dom',
1196
1196
),
1197
+
'5c93c52c' => array(
1198
+
'javelin-install',
1199
+
'javelin-dom',
1200
+
'javelin-vector',
1201
+
),
1197
1202
'5fefb143' => array(
1198
1203
'javelin-behavior',
1199
1204
'javelin-dom',
···
1551
1556
'phabricator-prefab',
1552
1557
),
1553
1558
'b3e7d692' => array(
1554
-
'javelin-install',
1555
-
),
1556
-
'b3ec3cfc' => array(
1557
1559
'javelin-install',
1558
1560
),
1559
1561
'b42eddc7' => array(
+21
-16
src/applications/differential/render/DifferentialChangesetHTMLRenderer.php
+21
-16
src/applications/differential/render/DifferentialChangesetHTMLRenderer.php
···
325
325
326
326
$readable_key = idx($key_map, $key, $key);
327
327
328
-
$rows[] = phutil_tag('tr', array(), array(
329
-
phutil_tag('th', array(), $readable_key),
330
-
phutil_tag('td', array('class' => 'oval'), $oval),
331
-
phutil_tag('td', array('class' => 'nval'), $nval),
332
-
));
328
+
$row = array(
329
+
$readable_key,
330
+
$oval,
331
+
$nval
332
+
);
333
+
$rows[] = $row;
334
+
333
335
}
334
336
}
335
337
336
-
array_unshift(
337
-
$rows,
338
-
phutil_tag('tr', array('class' => 'property-table-header'), array(
339
-
phutil_tag('th', array(), pht('Property Changes')),
340
-
phutil_tag('td', array('class' => 'oval'), pht('Old Value')),
341
-
phutil_tag('td', array('class' => 'nval'), pht('New Value')),
342
-
)));
343
-
338
+
$classes = array('', 'oval', 'nval');
339
+
$headers = array(
340
+
pht('Property'),
341
+
pht('Old Value'),
342
+
pht('New Value'),
343
+
);
344
+
$table = id(new AphrontTableView($rows))
345
+
->setHeaders($headers)
346
+
->setColumnClasses($classes);
344
347
return phutil_tag(
345
-
'table',
346
-
array('class' => 'differential-property-table'),
347
-
$rows);
348
+
'div',
349
+
array(
350
+
'class' => 'differential-property-table',
351
+
),
352
+
$table);
348
353
}
349
354
350
355
public function renderShield($message, $force = 'default') {
+14
-33
webroot/rsrc/css/application/differential/changeset-view.css
+14
-33
webroot/rsrc/css/application/differential/changeset-view.css
···
212
212
background-image: url(/rsrc/image/checker_dark.png);
213
213
}
214
214
215
+
.differential-diff .differential-image-diff td {
216
+
padding: 8px;
217
+
}
218
+
219
+
.differential-image-stage {
220
+
overflow: scroll;
221
+
}
222
+
215
223
.differential-meta-notice {
216
224
border-top: 1px solid {$yellow};
217
225
border-bottom: 1px solid {$yellow};
···
324
332
}
325
333
326
334
.differential-property-table {
327
-
width: auto;
328
-
margin: 12px auto;
329
-
background: #e3e3e3;
330
-
}
331
-
332
-
.differential-property-table th {
333
-
text-align: right;
334
-
width: 10em;
335
-
font-weight: bold;
336
-
color: {$greytext};
337
-
white-space: nowrap;
338
-
padding: 4px 8px;
339
-
border-right: 1px solid {$greytext};
340
-
}
341
-
342
-
.differential-property-table td {
343
-
padding: 4px 8px;
344
-
width: 35em;
335
+
margin: 12px;
336
+
background: {$lightgreybackground};
337
+
border: 1px solid {$lightblueborder};
338
+
border-bottom: 1px solid {$blueborder};
345
339
}
346
340
347
341
.differential-property-table td em {
348
342
color: {$lightgreytext};
349
343
}
350
344
351
-
.differential-property-table tr.property-table-header th,
352
-
.differential-property-table tr.property-table-header td {
353
-
text-align: center;
354
-
font-weight: bold;
355
-
border-bottom: 1px solid {$greytext};
356
-
}
357
-
358
345
.differential-property-table td.oval {
359
346
background: #ffd0d0;
347
+
width: 50%;
360
348
}
361
349
362
350
.differential-property-table td.nval {
363
351
background: #d0ffd0;
364
-
}
365
-
366
-
.differential-property-table tr.property-table-header td.oval {
367
-
background: #ffaaaa;
368
-
}
369
-
370
-
.differential-property-table tr.property-table-header td.nval {
371
-
background: #aaffaa;
352
+
width: 50%;
372
353
}
373
354
374
355
.differential-inline-undo {