@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
Make Tables play well in PHUIObjectBoxView
Summary:
Updates table design to use new standards, work well in PHUIObjectBox. Fixes T4142
Comma
Test Plan: Tested on Diffusion, Settings, will roll out to more places soon
Reviewers: epriestley, btrahan
CC: Korvin, epriestley, aran
Maniphest Tasks: T4142
Differential Revision: https://secure.phabricator.com/D7901
+91
-81
+9
-9
resources/celerity/map.php
+9
-9
resources/celerity/map.php
···
7
7
return array(
8
8
'names' =>
9
9
array(
10
-
'core.pkg.css' => '2af78812',
10
+
'core.pkg.css' => '979bfb39',
11
11
'core.pkg.js' => 'c907bd96',
12
12
'darkconsole.pkg.js' => 'ca8671ce',
13
13
'differential.pkg.css' => '827749c1',
···
29
29
'rsrc/css/aphront/multi-column.css' => '05bbd016',
30
30
'rsrc/css/aphront/notification.css' => '6901121e',
31
31
'rsrc/css/aphront/pager-view.css' => '2e3539af',
32
-
'rsrc/css/aphront/panel-view.css' => 'c989513f',
32
+
'rsrc/css/aphront/panel-view.css' => '35c2458b',
33
33
'rsrc/css/aphront/phabricator-nav-view.css' => 'd0d4a509',
34
34
'rsrc/css/aphront/request-failure-view.css' => 'da14df31',
35
-
'rsrc/css/aphront/table-view.css' => '45f18395',
35
+
'rsrc/css/aphront/table-view.css' => '8fc5e730',
36
36
'rsrc/css/aphront/tokenizer.css' => 'd888465e',
37
37
'rsrc/css/aphront/tooltip.css' => '9c90229d',
38
38
'rsrc/css/aphront/transaction.css' => 'ce491938',
···
108
108
'rsrc/css/application/releeph/releeph-request-typeahead.css' => '667a48ae',
109
109
'rsrc/css/application/releeph/releeph-status.css' => 'a20631d9',
110
110
'rsrc/css/application/search/search-results.css' => 'f240504c',
111
-
'rsrc/css/application/settings/settings.css' => '3cc397fa',
111
+
'rsrc/css/application/settings/settings.css' => 'ea8f5915',
112
112
'rsrc/css/application/slowvote/slowvote.css' => '266df6a1',
113
113
'rsrc/css/application/tokens/tokens.css' => 'fb286311',
114
114
'rsrc/css/application/uiexample/example.css' => '4741b891',
···
130
130
'rsrc/css/phui/phui-button.css' => '8106a67a',
131
131
'rsrc/css/phui/phui-document.css' => '143b2ac8',
132
132
'rsrc/css/phui/phui-feed-story.css' => '3a59c2cf',
133
-
'rsrc/css/phui/phui-form-view.css' => 'bf1e2c0e',
133
+
'rsrc/css/phui/phui-form-view.css' => '3179980c',
134
134
'rsrc/css/phui/phui-form.css' => 'b78ec020',
135
135
'rsrc/css/phui/phui-header-view.css' => '875d0260',
136
136
'rsrc/css/phui/phui-icon.css' => '29e83226',
···
480
480
'aphront-multi-column-view-css' => '05bbd016',
481
481
'aphront-notes' => '6acadd3f',
482
482
'aphront-pager-view-css' => '2e3539af',
483
-
'aphront-panel-view-css' => 'c989513f',
483
+
'aphront-panel-view-css' => '35c2458b',
484
484
'aphront-request-failure-view-css' => 'da14df31',
485
-
'aphront-table-view-css' => '45f18395',
485
+
'aphront-table-view-css' => '8fc5e730',
486
486
'aphront-tokenizer-control-css' => 'd888465e',
487
487
'aphront-tooltip-css' => '9c90229d',
488
488
'aphront-two-column-view-css' => '16ab3ad2',
···
699
699
'phabricator-project-tag-css' => '095c9404',
700
700
'phabricator-remarkup-css' => '32cace73',
701
701
'phabricator-search-results-css' => 'f240504c',
702
-
'phabricator-settings-css' => '3cc397fa',
702
+
'phabricator-settings-css' => 'ea8f5915',
703
703
'phabricator-shaped-request' => 'dfa181a4',
704
704
'phabricator-side-menu-view-css' => '503699d0',
705
705
'phabricator-slowvote-css' => '266df6a1',
···
735
735
'phui-document-view-css' => '143b2ac8',
736
736
'phui-feed-story-css' => '3a59c2cf',
737
737
'phui-form-css' => 'b78ec020',
738
-
'phui-form-view-css' => 'bf1e2c0e',
738
+
'phui-form-view-css' => '3179980c',
739
739
'phui-header-view-css' => '875d0260',
740
740
'phui-icon-view-css' => '29e83226',
741
741
'phui-info-panel-css' => '27ea50a1',
+17
-23
src/applications/diffusion/controller/DiffusionRepositoryController.php
+17
-23
src/applications/diffusion/controller/DiffusionRepositoryController.php
···
123
123
124
124
if ($readme) {
125
125
$box = new PHUIBoxView();
126
-
$box->setShadow(true);
127
126
$box->appendChild($readme);
128
127
$box->addPadding(PHUI::PADDING_LARGE);
129
128
130
-
$panel = new AphrontPanelView();
131
-
$panel->setHeader(pht('README'));
132
-
$panel->setNoBackground();
129
+
$panel = new PHUIObjectBoxView();
130
+
$panel->setHeaderText(pht('README'));
133
131
$panel->appendChild($box);
134
132
$content[] = $panel;
135
133
}
···
288
286
->setBranches($branches)
289
287
->setCommits($commits);
290
288
291
-
$panel = id(new AphrontPanelView())
292
-
->setHeader(pht('Branches'))
293
-
->setNoBackground();
289
+
$panel = new PHUIObjectBoxView();
290
+
$header = new PHUIHeaderView();
291
+
$header->setHeader(pht('Branches'));
294
292
295
293
if ($more_branches) {
296
-
$panel->setCaption(pht('Showing %d branches.', $limit));
294
+
$header->setSubHeader(pht('Showing %d branches.', $limit));
297
295
}
298
296
299
-
$panel->addButton(
300
-
phutil_tag(
301
-
'a',
302
-
array(
303
-
'href' => $drequest->generateURI(
297
+
$button = new PHUIButtonView();
298
+
$button->setText(pht("Show All Branches"));
299
+
$button->setTag('a');
300
+
$button->setHref($drequest->generateURI(
304
301
array(
305
302
'action' => 'branches',
306
-
)),
307
-
'class' => 'grey button',
308
-
),
309
-
pht("Show All Branches \xC2\xBB")));
303
+
)));
310
304
305
+
$header->addActionLink($button);
306
+
$panel->setHeader($header);
311
307
$panel->appendChild($table);
312
308
313
309
return $panel;
···
471
467
),
472
468
pht('View Full Commit History'));
473
469
474
-
$panel = new AphrontPanelView();
475
-
$panel->setHeader(pht("Recent Commits · %s", $all));
470
+
$panel = new PHUIObjectBoxView();
471
+
$panel->setHeaderText(pht("Recent Commits · %s", $all));
476
472
$panel->appendChild($history_table);
477
-
$panel->setNoBackground();
478
473
479
474
return $panel;
480
475
}
···
513
508
514
509
$browse_uri = $drequest->generateURI(array('action' => 'browse'));
515
510
516
-
$browse_panel = new AphrontPanelView();
517
-
$browse_panel->setHeader(
511
+
$browse_panel = new PHUIObjectBoxView();
512
+
$browse_panel->setHeaderText(
518
513
phutil_tag(
519
514
'a',
520
515
array('href' => $browse_uri),
521
516
pht('Browse Repository')));
522
517
$browse_panel->appendChild($browse_table);
523
-
$browse_panel->setNoBackground();
524
518
525
519
return $browse_panel;
526
520
}
+23
-17
src/applications/settings/panel/PhabricatorSettingsPanelHomePreferences.php
+23
-17
src/applications/settings/panel/PhabricatorSettingsPanelHomePreferences.php
···
140
140
'checked' => $full_radio_button_status,
141
141
));
142
142
143
+
$desc = $app->getShortDescription();
143
144
$app_column = hsprintf(
144
-
"<strong>%s</strong><br /><em>Default: %s</em>"
145
-
, $app->getName(), $default_name);
145
+
"<strong>%s</strong><br/ >%s, <em>Default: %s</em>",
146
+
$app->getName(), $desc, $default_name);
146
147
147
148
$rows[] = array(
148
149
$app_column,
···
179
180
));
180
181
181
182
182
-
$panel = id(new AphrontPanelView())
183
-
->setHeader($group_name)
184
-
->addClass('phabricator-settings-panelview')
185
-
->appendChild($table)
186
-
->setNoBackground();
183
+
$panel = id(new PHUIObjectBoxView())
184
+
->setHeaderText($group_name)
185
+
->appendChild($table);
187
186
188
187
$output[] = $panel;
189
188
}
190
189
191
-
$form
192
-
->appendChild($output)
193
-
->appendChild(
194
-
id(new AphrontFormSubmitControl())
195
-
->setValue(pht('Save Preferences')));
190
+
$save_button =
191
+
id(new AphrontFormSubmitControl())
192
+
->setValue(pht('Save Preferences'));
193
+
194
+
$output[] = id(new PHUIBoxView())
195
+
->addPadding(PHUI::PADDING_LARGE)
196
+
->addClass('phabricator-settings-homepagetable-button')
197
+
->appendChild($save_button);
198
+
199
+
$form->appendChild($output);
196
200
197
201
$error_view = null;
198
202
if ($request->getStr('saved') === 'true') {
···
202
206
->setErrors(array(pht('Your preferences have been saved.')));
203
207
}
204
208
205
-
$form_box = id(new PHUIObjectBoxView())
206
-
->setHeaderText(pht('Home Page Preferences'))
207
-
->setFormError($error_view)
208
-
->setForm($form);
209
+
$header = id(new PHUIHeaderView())
210
+
->setHeader(pht('Home Page Preferences'));
209
211
210
-
return $form_box;
212
+
$form = id(new PHUIBoxView())
213
+
->addClass('phabricator-settings-homepagetable-wrap')
214
+
->appendChild($form);
215
+
216
+
return array($header, $error_view, $form);
211
217
}
212
218
}
213
219
+2
-2
src/applications/uiexample/examples/PhabricatorSortTableExample.php
+2
-2
src/applications/uiexample/examples/PhabricatorSortTableExample.php
+3
-3
webroot/rsrc/css/aphront/panel-view.css
+3
-3
webroot/rsrc/css/aphront/panel-view.css
···
7
7
background: {$lightgreybackground};
8
8
border: 1px solid #c0c0c0;
9
9
border-width: 1px 0 0;
10
-
padding: 1em 2em;
11
-
margin: 20px 20px 40px 20px;
10
+
padding: 8px 16px;
11
+
margin: 20px 16px 40px 16px;
12
12
}
13
13
14
14
.device-phone .aphront-panel-view {
15
-
margin: 20px 10px 40px 10px;
15
+
margin: 20px 8px 40px 8px;
16
16
}
17
17
18
18
.aphront-unpadded-panel-view {
+23
-17
webroot/rsrc/css/aphront/table-view.css
+23
-17
webroot/rsrc/css/aphront/table-view.css
···
11
11
width: 100%;
12
12
border-collapse: collapse;
13
13
background: #fff;
14
-
border: 1px solid #d5dae0;
14
+
border: 1px solid {$lightblueborder};
15
+
border-bottom: 1px solid {$blueborder};
15
16
}
16
17
17
18
.aphront-table-view tr.alt {
18
-
background: #f1f3f8;
19
+
background: {$lightgreybackground};
19
20
}
20
21
21
22
.aphront-table-view th {
22
23
font-weight: bold;
24
+
font-size: 13px;
23
25
white-space: nowrap;
24
-
color: #525252;
26
+
color: {$bluetext};
25
27
text-shadow: 0 1px 0 white;
26
28
font-weight: bold;
27
-
background-color: #d9dde2;
28
-
background-image: url(/rsrc/image/texture/table_header.png);
29
-
background-repeat: repeat-x;
29
+
border-bottom: 1px solid {$thinblueborder};
30
+
background-color: {$lightbluebackground};
30
31
}
31
32
32
33
th.aphront-table-view-sortable-selected {
33
-
background-image: url(/rsrc/image/texture/table_header_hover.png);
34
+
background-color: {$greybackground};
34
35
}
35
36
36
37
.aphront-table-view th a,
37
38
.aphront-table-view th a:hover,
38
39
.aphront-table-view th a:link {
39
-
color: #525252;
40
+
color: {$bluetext};
40
41
text-shadow: 0 1px 0 white;
41
42
display: block;
42
43
text-decoration: none;
···
44
45
45
46
.aphront-table-view th a:hover {
46
47
text-decoration: underline;
48
+
color: {$darkbluetext};
47
49
}
48
50
49
51
.aphront-table-view td.header {
50
52
padding: 4px 8px;
51
53
white-space: nowrap;
52
54
text-align: right;
53
-
color: #525252;
55
+
color: {$bluetext};
54
56
font-weight: bold;
55
57
}
56
58
···
65
67
width: 0;
66
68
height: 0;
67
69
vertical-align: top;
68
-
border-top: 4px solid black;
70
+
border-top: 4px solid {$bluetext};
69
71
border-right: 4px solid transparent;
70
72
border-left: 4px solid transparent;
71
73
content: "";
···
77
79
width: 0;
78
80
height: 0;
79
81
vertical-align: top;
80
-
border-bottom: 4px solid black;
82
+
border-bottom: 4px solid {$bluetext};
81
83
border-right: 4px solid transparent;
82
84
border-left: 4px solid transparent;
83
85
content: "";
···
94
96
95
97
.aphront-table-view th {
96
98
padding: 8px 10px;
97
-
font-size: 12px;
99
+
font-size: 13px;
98
100
}
99
101
100
102
.aphront-table-view td {
···
124
126
}
125
127
126
128
.aphront-table-view td.sorted-column {
127
-
background: #f1f3f8;
129
+
background: {$lightbluebackground};
128
130
}
129
131
130
132
.aphront-table-view tr.alt td.sorted-column {
131
-
background: #e4e6eb;
133
+
background: {$greybackground};
132
134
}
133
135
134
136
.aphront-table-view td.action {
···
175
177
}
176
178
177
179
.aphront-table-view td.narrow {
178
-
width: 1px;
180
+
width: 1px;
179
181
}
180
182
181
183
div.single-display-line-bounds {
···
198
200
}
199
201
200
202
.aphront-table-view tr.no-data td {
201
-
padding: 1em;
203
+
padding: 12px;
202
204
text-align: center;
203
-
color: {$lightgreytext};
205
+
color: {$lightgreytext};
204
206
font-style: italic;
205
207
}
206
208
···
247
249
padding: 6px 8px;
248
250
font-weight: bold;
249
251
}
252
+
253
+
.phui-object-box .aphront-table-view {
254
+
border: none;
255
+
}
+14
-9
webroot/rsrc/css/application/settings/settings.css
+14
-9
webroot/rsrc/css/application/settings/settings.css
···
2
2
* @provides phabricator-settings-css
3
3
*/
4
4
5
-
.phabricator-settings-homepagetable {
6
-
width: 60% !important;
7
-
margin: auto;
5
+
.phabricator-settings-homepagetable .fixed {
6
+
width: 48px;
7
+
text-align: center;
8
8
}
9
9
10
-
.phabricator-settings-homepagetable td.fixed {
11
-
width: 24px;
12
-
text-align: center;
10
+
.phabricator-settings-homepagetable td em {
11
+
color: {$lightgreytext};
12
+
}
13
13
14
+
.phabricator-settings-homepagetable-button .aphront-form-input {
15
+
margin: 0;
16
+
width: auto;
14
17
}
15
18
16
-
.phabricator-settings-panelview h1 {
17
-
text-align: center;
19
+
.phabricator-settings-homepagetable-button .aphront-form-control {
20
+
padding: 0;
18
21
}
19
22
20
-
23
+
.phabricator-settings-homepagetable-wrap .phui-form-view {
24
+
padding: 0;
25
+
}