@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
Update PHUIInfoView
Summary: Just some minor UI tweaks. Make AphrontTagView, add Icons, whiten background.
Test Plan: Legalpad, Settings, Auth, UIExamples, Differential... desktop, mobile.
Reviewers: epriestley
Reviewed By: epriestley
Subscribers: Korvin
Differential Revision: https://secure.phabricator.com/D16850
+128
-71
+5
-5
resources/celerity/map.php
+5
-5
resources/celerity/map.php
···
9
9
'names' => array(
10
10
'conpherence.pkg.css' => '0b64e988',
11
11
'conpherence.pkg.js' => '6249a1cf',
12
-
'core.pkg.css' => 'c30f462d',
12
+
'core.pkg.css' => '1bc01ec9',
13
13
'core.pkg.js' => '9dc857ed',
14
14
'darkconsole.pkg.js' => 'e7393ebb',
15
15
'differential.pkg.css' => 'a4ba74b5',
···
135
135
'rsrc/css/phui/phui-comment-form.css' => '4ecc56ef',
136
136
'rsrc/css/phui/phui-crumbs-view.css' => '195ac419',
137
137
'rsrc/css/phui/phui-curtain-view.css' => '947bf1a4',
138
-
'rsrc/css/phui/phui-document-pro.css' => 'ca1fed81',
138
+
'rsrc/css/phui/phui-document-pro.css' => 'd4559738',
139
139
'rsrc/css/phui/phui-document-summary.css' => '9ca48bdf',
140
140
'rsrc/css/phui/phui-document.css' => 'c32e8dec',
141
141
'rsrc/css/phui/phui-feed-story.css' => '44a9c8e9',
···
149
149
'rsrc/css/phui/phui-icon.css' => '417f80fb',
150
150
'rsrc/css/phui/phui-image-mask.css' => 'a8498f9c',
151
151
'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
152
-
'rsrc/css/phui/phui-info-view.css' => '28efab79',
152
+
'rsrc/css/phui/phui-info-view.css' => 'ec92802a',
153
153
'rsrc/css/phui/phui-invisible-character-view.css' => '6993d9f0',
154
154
'rsrc/css/phui/phui-list.css' => '9da2aa00',
155
155
'rsrc/css/phui/phui-object-box.css' => '6b487c57',
···
851
851
'phui-curtain-view-css' => '947bf1a4',
852
852
'phui-document-summary-view-css' => '9ca48bdf',
853
853
'phui-document-view-css' => 'c32e8dec',
854
-
'phui-document-view-pro-css' => 'ca1fed81',
854
+
'phui-document-view-pro-css' => 'd4559738',
855
855
'phui-feed-story-css' => '44a9c8e9',
856
856
'phui-font-icon-base-css' => '870a7360',
857
857
'phui-fontkit-css' => '9cda225e',
···
865
865
'phui-icon-view-css' => '417f80fb',
866
866
'phui-image-mask-css' => 'a8498f9c',
867
867
'phui-info-panel-css' => '27ea50a1',
868
-
'phui-info-view-css' => '28efab79',
868
+
'phui-info-view-css' => 'ec92802a',
869
869
'phui-inline-comment-view-css' => '5953c28e',
870
870
'phui-invisible-character-view-css' => '6993d9f0',
871
871
'phui-list-view-css' => '9da2aa00',
+1
-1
src/__phutil_library_map__.php
+1
-1
src/__phutil_library_map__.php
···
6436
6436
'PHUIInfoExample' => 'PhabricatorUIExample',
6437
6437
'PHUIInfoPanelExample' => 'PhabricatorUIExample',
6438
6438
'PHUIInfoPanelView' => 'AphrontView',
6439
-
'PHUIInfoView' => 'AphrontView',
6439
+
'PHUIInfoView' => 'AphrontTagView',
6440
6440
'PHUIInvisibleCharacterTestCase' => 'PhabricatorTestCase',
6441
6441
'PHUIInvisibleCharacterView' => 'AphrontView',
6442
6442
'PHUIListExample' => 'PhabricatorUIExample',
+79
-26
src/view/form/PHUIInfoView.php
+79
-26
src/view/form/PHUIInfoView.php
···
1
1
<?php
2
2
3
-
final class PHUIInfoView extends AphrontView {
3
+
final class PHUIInfoView extends AphrontTagView {
4
4
5
5
const SEVERITY_ERROR = 'error';
6
6
const SEVERITY_WARNING = 'warning';
···
10
10
11
11
private $title;
12
12
private $errors;
13
-
private $severity;
13
+
private $severity = null;
14
14
private $id;
15
15
private $buttons = array();
16
16
private $isHidden;
17
17
private $flush;
18
+
private $icon;
18
19
19
20
public function setTitle($title) {
20
21
$this->title = $title;
···
26
27
return $this;
27
28
}
28
29
30
+
private function getSeverity() {
31
+
$severity = $this->severity ? $this->severity : self::SEVERITY_ERROR;
32
+
return $severity;
33
+
}
34
+
29
35
public function setErrors(array $errors) {
30
36
$this->errors = $errors;
31
37
return $this;
···
46
52
return $this;
47
53
}
48
54
55
+
public function setIcon(PHUIIconView $icon) {
56
+
$this->icon = $icon;
57
+
return $this;
58
+
}
59
+
60
+
private function getIcon() {
61
+
if ($this->icon) {
62
+
return $this->icon;
63
+
}
64
+
65
+
switch ($this->getSeverity()) {
66
+
case self::SEVERITY_ERROR:
67
+
$icon = 'fa-exclamation-circle';
68
+
break;
69
+
case self::SEVERITY_WARNING:
70
+
$icon = 'fa-exclamation-triangle';
71
+
break;
72
+
case self::SEVERITY_NOTICE:
73
+
$icon = 'fa-info-circle';
74
+
break;
75
+
case self::SEVERITY_NODATA:
76
+
return null;
77
+
break;
78
+
case self::SEVERITY_SUCCESS:
79
+
$icon = 'fa-check-circle';
80
+
break;
81
+
}
82
+
83
+
$icon = id(new PHUIIconView())
84
+
->setIcon($icon)
85
+
->addClass('phui-info-icon');
86
+
return $icon;
87
+
}
88
+
49
89
public function addButton(PHUIButtonView $button) {
90
+
$button->setColor(PHUIButtonView::GREY);
50
91
$this->buttons[] = $button;
51
92
return $this;
52
93
}
53
94
54
-
public function render() {
95
+
protected function getTagAttributes() {
96
+
$classes = array();
97
+
$classes[] = 'phui-info-view';
98
+
$classes[] = 'phui-info-severity-'.$this->getSeverity();
99
+
$classes[] = 'grouped';
100
+
if ($this->flush) {
101
+
$classes[] = 'phui-info-view-flush';
102
+
}
103
+
if ($this->getIcon()) {
104
+
$classes[] = 'phui-info-has-icon';
105
+
}
106
+
107
+
return array(
108
+
'id' => $this->id,
109
+
'class' => implode(' ', $classes),
110
+
'style' => $this->isHidden ? 'display: none;' : null,
111
+
);
112
+
}
113
+
114
+
protected function getTagContent() {
55
115
require_celerity_resource('phui-info-view-css');
56
116
57
117
$errors = $this->errors;
···
87
147
$title = null;
88
148
}
89
149
90
-
$this->severity = nonempty($this->severity, self::SEVERITY_ERROR);
91
-
92
-
$classes = array();
93
-
$classes[] = 'phui-info-view';
94
-
$classes[] = 'phui-info-severity-'.$this->severity;
95
-
$classes[] = 'grouped';
96
-
if ($this->flush) {
97
-
$classes[] = 'phui-info-view-flush';
98
-
}
99
-
$classes = implode(' ', $classes);
100
-
101
150
$children = $this->renderChildren();
102
151
if ($list) {
103
152
$children[] = $list;
···
123
172
$this->buttons);
124
173
}
125
174
126
-
return phutil_tag(
127
-
'div',
128
-
array(
129
-
'id' => $this->id,
130
-
'class' => $classes,
131
-
'style' => $this->isHidden ? 'display: none;' : null,
132
-
),
133
-
array(
134
-
$buttons,
135
-
$title,
136
-
$body,
137
-
));
175
+
$icon = null;
176
+
if ($this->getIcon()) {
177
+
$icon = phutil_tag(
178
+
'div',
179
+
array(
180
+
'class' => 'phui-info-view-icon',
181
+
),
182
+
$this->getIcon());
183
+
}
184
+
185
+
return array(
186
+
$icon,
187
+
$buttons,
188
+
$title,
189
+
$body,
190
+
);
138
191
}
139
192
}
+1
-1
webroot/rsrc/css/phui/phui-document-pro.css
+1
-1
webroot/rsrc/css/phui/phui-document-pro.css
+42
-38
webroot/rsrc/css/phui/phui-info-view.css
+42
-38
webroot/rsrc/css/phui/phui-info-view.css
···
5
5
.phui-info-view {
6
6
border-style: solid;
7
7
border-width: 1px;
8
+
background: #fff;
8
9
margin: 16px;
9
10
padding: 12px;
10
11
border-radius: 3px;
···
22
23
padding: 0;
23
24
}
24
25
26
+
.phui-info-view-icon {
27
+
width: 24px;
28
+
float: left;
29
+
}
30
+
25
31
.phui-info-view-body {
26
32
line-height: 1.6em;
33
+
}
34
+
35
+
.phui-info-view.phui-info-has-icon .phui-info-view-body {
36
+
margin-left: 24px;
27
37
}
28
38
29
39
.phui-info-view-body tt {
···
48
58
h1.phui-info-view-head {
49
59
font-weight: bold;
50
60
font-size: {$biggerfontsize};
51
-
line-height: 1.2em;
61
+
line-height: 1.3em;
52
62
}
53
63
54
64
.phui-info-view-list {
55
-
margin: 0 0 0 16px;
56
-
list-style: disc;
57
-
line-height: 1.5em;
65
+
margin: 0;
66
+
list-style: none;
67
+
line-height: 1.6em;
58
68
}
59
69
60
-
.phui-info-view .phui-info-view-actions .button:hover {
61
-
background: #fff;
62
-
box-shadow: none;
70
+
.phui-info-view .phui-info-icon {
71
+
padding-top: 1px;
72
+
font-size: 16px;
63
73
}
64
74
65
-
.phui-info-severity-error,
66
-
.phui-info-severity-error a.button {
67
-
border-color: {$sh-redborder};
68
-
background: {$sh-redbackground};
75
+
.phui-info-severity-error {
76
+
border-color: {$red};
77
+
border-left-width: 6px;
69
78
}
70
79
71
-
.phui-info-severity-error a.button {
72
-
color: {$sh-redtext};
80
+
.phui-info-severity-error .phui-info-icon {
81
+
color: {$red};
73
82
}
74
83
75
-
.phui-info-severity-warning,
76
-
.phui-info-severity-warning a.button {
77
-
border-color: {$sh-yellowborder};
78
-
background: {$sh-yellowbackground};
84
+
.phui-info-severity-warning {
85
+
border-color: {$yellow};
86
+
border-left-width: 6px;
79
87
}
80
88
81
-
.phui-info-severity-warning a.button {
82
-
color: {$sh-yellowtext};
89
+
.phui-info-severity-warning .phui-info-icon {
90
+
color: {$yellow};
83
91
}
84
92
85
-
.phui-info-severity-notice,
86
-
.phui-info-severity-notice a.button {
87
-
border-color: {$sh-blueborder};
88
-
background: {$sh-bluebackground};
93
+
.phui-info-severity-notice {
94
+
border-color: {$blue};
95
+
border-left-width: 6px;
89
96
}
90
97
91
-
.phui-info-severity-notice a.button {
92
-
color: {$sh-bluetext};
98
+
.phui-info-severity-notice .phui-info-icon {
99
+
color: {$blue};
93
100
}
94
101
95
-
.phui-info-severity-nodata,
96
-
.phui-info-severity-nodata a.button {
102
+
.phui-info-severity-nodata {
97
103
border-color: {$lightgreyborder};
98
-
background: #fff;
99
-
}
100
-
101
-
.phui-info-severity-nodata a.button {
102
-
color: {$greytext};
103
104
}
104
105
105
-
.phui-info-severity-success,
106
-
.phui-info-severity-success a.button {
107
-
border-color: {$sh-greenborder};
108
-
background: {$sh-greenbackground};
106
+
.phui-info-severity-success {
107
+
border-color: {$green};
108
+
border-left-width: 6px;
109
109
}
110
110
111
-
.phui-info-severity-success a.button {
112
-
color: {$sh-greentext};
111
+
.phui-info-severity-success .phui-info-icon {
112
+
color: {$green};
113
113
}
114
114
115
115
.aphront-dialog-body .phui-info-view {
···
123
123
.phui-crumbs-view.phui-crumbs-border + .phui-info-view {
124
124
margin-top: 16px;
125
125
}
126
+
127
+
div.phui-object-box .phui-header-shell + .phui-info-view {
128
+
margin: 16px 0 8px;
129
+
}