@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
Separate Phriction style into PHUIDocumentView
Summary:
Ref T988. Fixes T3150. I want to use this element in Diviner, so separate it from Phriction.
This makes no changes to the actual display except for fixing {T3150} by adding `overflow: hidden;`.
Test Plan: Viewed Phriction documents in mobile and desktop views.
Reviewers: chad, btrahan
Reviewed By: btrahan
CC: aran
Maniphest Tasks: T988, T3150
Differential Revision: https://secure.phabricator.com/D6101
+160
-103
+10
-1
src/__celerity_resource_map__.php
+10
-1
src/__celerity_resource_map__.php
···
3636
3636
),
3637
3637
'phriction-document-css' =>
3638
3638
array(
3639
-
'uri' => '/res/14e08350/rsrc/css/application/phriction/phriction-document-css.css',
3639
+
'uri' => '/res/97a9ef40/rsrc/css/application/phriction/phriction-document-css.css',
3640
3640
'type' => 'css',
3641
3641
'requires' =>
3642
3642
array(
···
3651
3651
array(
3652
3652
),
3653
3653
'disk' => '/rsrc/css/phui/phui-box.css',
3654
+
),
3655
+
'phui-document-view-css' =>
3656
+
array(
3657
+
'uri' => '/res/ca376da1/rsrc/css/phui/phui-document.css',
3658
+
'type' => 'css',
3659
+
'requires' =>
3660
+
array(
3661
+
),
3662
+
'disk' => '/rsrc/css/phui/phui-document.css',
3654
3663
),
3655
3664
'phui-feed-story-css' =>
3656
3665
array(
+2
src/__phutil_library_map__.php
+2
src/__phutil_library_map__.php
···
682
682
'PHUI' => 'view/phui/PHUI.php',
683
683
'PHUIBoxExample' => 'applications/uiexample/examples/PHUIBoxExample.php',
684
684
'PHUIBoxView' => 'view/phui/PHUIBoxView.php',
685
+
'PHUIDocumentView' => 'view/phui/PHUIDocumentView.php',
685
686
'PHUIFeedStoryExample' => 'applications/uiexample/examples/PHUIFeedStoryExample.php',
686
687
'PHUIFeedStoryView' => 'view/phui/PHUIFeedStoryView.php',
687
688
'PHUIFormDividerControl' => 'view/form/control/PHUIFormDividerControl.php',
···
2494
2495
'OwnersPackageReplyHandler' => 'PhabricatorMailReplyHandler',
2495
2496
'PHUIBoxExample' => 'PhabricatorUIExample',
2496
2497
'PHUIBoxView' => 'AphrontTagView',
2498
+
'PHUIDocumentView' => 'AphrontTagView',
2497
2499
'PHUIFeedStoryExample' => 'PhabricatorUIExample',
2498
2500
'PHUIFeedStoryView' => 'AphrontView',
2499
2501
'PHUIFormDividerControl' => 'AphrontFormControl',
+28
-21
src/applications/phriction/controller/PhrictionDocumentController.php
+28
-21
src/applications/phriction/controller/PhrictionDocumentController.php
···
163
163
$header = id(new PhabricatorHeaderView())
164
164
->setHeader($page_title);
165
165
166
-
$page_content = hsprintf(
167
-
'<div class="phriction-wrap">
168
-
<div class="phriction-content">
169
-
%s%s%s%s%s
170
-
</div>
171
-
<div class="phriction-fake-space"></div>
172
-
</div>',
173
-
$header,
174
-
$actions,
175
-
$properties,
176
-
$move_notice,
177
-
$core_content);
166
+
$page_content = id(new PHUIDocumentView())
167
+
->setOffset(true)
168
+
->appendChild(
169
+
array(
170
+
$header,
171
+
$actions,
172
+
$properties,
173
+
$move_notice,
174
+
$core_content,
175
+
));
178
176
179
177
$core_page = phutil_tag(
180
178
'div',
···
420
418
$list[] = phutil_tag('li', array(), pht('More...'));
421
419
}
422
420
423
-
return hsprintf(
424
-
'<div class="phriction-wrap">
425
-
<div class="phriction-children">
426
-
<div class="phriction-children-header">%s</div>
427
-
%s
428
-
</div>
429
-
</div>',
430
-
pht('Document Hierarchy'),
431
-
phutil_tag('ul', array(), $list));
421
+
$content = array(
422
+
phutil_tag(
423
+
'div',
424
+
array(
425
+
'class' => 'phriction-children-header',
426
+
),
427
+
pht('Document Hierarchy')),
428
+
phutil_tag(
429
+
'div',
430
+
array(
431
+
'class' => 'phriction-children',
432
+
),
433
+
phutil_tag('ul', array(), $list)),
434
+
);
435
+
436
+
return id(new PHUIDocumentView())
437
+
->setOffset(true)
438
+
->appendChild($content);
432
439
}
433
440
434
441
private function renderChildDocumentLink(array $info) {
+40
src/view/phui/PHUIDocumentView.php
+40
src/view/phui/PHUIDocumentView.php
···
1
+
<?php
2
+
3
+
final class PHUIDocumentView extends AphrontTagView {
4
+
5
+
private $offset;
6
+
7
+
public function setOffset($offset) {
8
+
$this->offset = $offset;
9
+
return $this;
10
+
}
11
+
12
+
public function getTagAttributes() {
13
+
$classes = array();
14
+
15
+
if ($this->offset) {
16
+
$classes[] = 'phui-document-offset';
17
+
};
18
+
19
+
return array(
20
+
'class' => $classes,
21
+
);
22
+
}
23
+
24
+
public function getTagContent() {
25
+
require_celerity_resource('phui-document-view-css');
26
+
27
+
return phutil_tag(
28
+
'div',
29
+
array(
30
+
'class' => 'phui-document-view',
31
+
),
32
+
phutil_tag(
33
+
'div',
34
+
array(
35
+
'class' => 'phui-document-content',
36
+
),
37
+
$this->renderChildren()));
38
+
}
39
+
40
+
}
+2
-81
webroot/rsrc/css/application/phriction/phriction-document-css.css
+2
-81
webroot/rsrc/css/application/phriction/phriction-document-css.css
···
17
17
margin: .25em 0;
18
18
}
19
19
20
-
.device-desktop .phriction-offset {
21
-
padding-right: 160px;
22
-
}
23
-
24
-
.phriction-wrap {
25
-
margin-bottom: 20px;
26
-
}
27
-
28
-
.device-desktop .phriction-wrap {
29
-
position: relative;
30
-
border-left: 1px solid #e7e7e7;
31
-
border-right: 1px solid #e7e7e7;
32
-
border-bottom: 1px solid #c0c5d1;
33
-
max-width: 800px;
34
-
margin: 20px auto;
35
-
}
36
-
37
-
.phriction-content {
38
-
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
39
-
min-height: 240px;
40
-
background: #fff;
41
-
}
42
-
43
-
.device-desktop .phriction-wrap {
44
-
}
45
-
46
-
.device-desktop .phriction-content .phabricator-action-list-view {
47
-
margin: 10px 10px 0 0;
48
-
background: #f7f7f7;
49
-
}
50
-
51
-
.device-phone .phriction-content .phabricator-action-list-view {
52
-
margin: 0;
53
-
border-bottom: 1px solid #c0c5d1;
54
-
background: #f7f7f7;
55
-
}
56
-
57
-
.phriction-content .phabricator-header-shell {
58
-
border-top: none;
59
-
}
60
-
61
-
.phriction-content .phabricator-remarkup {
62
-
padding: 20px;
63
-
}
64
-
65
-
.device-phone .phriction-content .phabricator-remarkup {
66
-
padding: 10px;
67
-
}
68
-
69
-
.phriction-content .phriction-link {
70
-
font-weight: bold;
71
-
}
72
-
73
20
.phriction-breadcrumbs {
74
21
font-size: 12px;
75
22
color: #666666;
···
79
26
font-weight: bold;
80
27
}
81
28
82
-
.phriction-children {
83
-
max-width: 800px;
84
-
background: #fff;
85
-
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
86
-
}
87
-
88
29
.phriction-children ul {
89
30
margin-left: 30px;
90
31
padding-bottom: 10px;
···
99
40
margin-bottom: 15px;
100
41
}
101
42
102
-
.device-desktop .phriction-content .phabricator-action-list-view {
103
-
position: absolute;
104
-
top: 50px;
105
-
right: -172px;
106
-
float: none;
107
-
background: #fff;
108
-
border-radius: 0;
109
-
box-shadow: none;
110
-
border: none;
111
-
border-top: 1px solid #e7e7e7;
112
-
border-bottom: 1px solid #e7e7e7;
113
-
border-right: 1px solid #e7e7e7;
114
-
width: 160px;
115
-
}
116
-
117
43
.phriction-document-preview-header {
118
44
color: #666666;
119
45
margin-bottom: 1em;
···
147
73
text-align: right;
148
74
}
149
75
150
-
.device-phone .phriction-content .phabricator-remarkup-toc {
151
-
width: 120px;
152
-
}
153
-
154
-
.phriction-content .phabricator-remarkup .remarkup-code-block {
155
-
clear: both;
156
-
margin: 20px 0;
76
+
.phui-document-content .phriction-link {
77
+
font-weight: bold;
157
78
}
+78
webroot/rsrc/css/phui/phui-document.css
+78
webroot/rsrc/css/phui/phui-document.css
···
1
+
/**
2
+
* @provides phui-document-view-css
3
+
*/
4
+
5
+
.phui-document-view {
6
+
margin-bottom: 20px;
7
+
}
8
+
9
+
.device-desktop .phui-document-view {
10
+
position: relative;
11
+
border-left: 1px solid #e7e7e7;
12
+
border-right: 1px solid #e7e7e7;
13
+
border-bottom: 1px solid #c0c5d1;
14
+
max-width: 800px;
15
+
margin: 20px auto;
16
+
}
17
+
18
+
.phui-document-content {
19
+
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
20
+
min-height: 240px;
21
+
background: #fff;
22
+
23
+
/* NOTE: This fixes margins, not floats, and can not be replaced with
24
+
the ".group" class. See T3150.
25
+
*/
26
+
overflow: hidden;
27
+
}
28
+
29
+
.device-desktop .phui-document-content .phabricator-action-list-view {
30
+
margin: 10px 10px 0 0;
31
+
background: #f7f7f7;
32
+
}
33
+
34
+
.device-phone .phui-document-content .phabricator-action-list-view {
35
+
margin: 0;
36
+
border-bottom: 1px solid #c0c5d1;
37
+
background: #f7f7f7;
38
+
}
39
+
40
+
.phui-document-content .phabricator-header-shell {
41
+
border-top: none;
42
+
}
43
+
44
+
.phui-document-content .phabricator-remarkup {
45
+
padding: 20px;
46
+
}
47
+
48
+
.device-phone .phui-document-content .phabricator-remarkup {
49
+
padding: 10px;
50
+
}
51
+
52
+
.device-desktop .phui-document-content .phabricator-action-list-view {
53
+
position: absolute;
54
+
top: 50px;
55
+
right: -172px;
56
+
float: none;
57
+
background: #fff;
58
+
border-radius: 0;
59
+
box-shadow: none;
60
+
border: none;
61
+
border-top: 1px solid #e7e7e7;
62
+
border-bottom: 1px solid #e7e7e7;
63
+
border-right: 1px solid #e7e7e7;
64
+
width: 160px;
65
+
}
66
+
67
+
.device-phone .phui-document-content .phabricator-remarkup-toc {
68
+
width: 120px;
69
+
}
70
+
71
+
.phui-document-content .phabricator-remarkup .remarkup-code-block {
72
+
clear: both;
73
+
margin: 20px 0;
74
+
}
75
+
76
+
.device-desktop .phui-document-offset {
77
+
padding-right: 160px;
78
+
}