@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 lightbox buttons more roundy
Summary: Ref T3612. Mobilizes the new lightbox, changes large buttons to circle icons like Conpherence.
Test Plan: Click each new button on desktop, mobile.
Reviewers: epriestley
Reviewed By: epriestley
Subscribers: Korvin
Maniphest Tasks: T3612
Differential Revision: https://secure.phabricator.com/D16961
+83
-42
+22
-22
resources/celerity/map.php
+22
-22
resources/celerity/map.php
···
9
9
'names' => array(
10
10
'conpherence.pkg.css' => '0b64e988',
11
11
'conpherence.pkg.js' => '6249a1cf',
12
-
'core.pkg.css' => 'e5fbe031',
13
-
'core.pkg.js' => '426f2dac',
12
+
'core.pkg.css' => '417800a6',
13
+
'core.pkg.js' => '9d208f10',
14
14
'darkconsole.pkg.js' => 'e7393ebb',
15
15
'differential.pkg.css' => 'a4ba74b5',
16
16
'differential.pkg.js' => '634399e9',
···
132
132
'rsrc/css/phui/phui-chart.css' => '6bf6f78e',
133
133
'rsrc/css/phui/phui-cms.css' => 'be43c8a8',
134
134
'rsrc/css/phui/phui-comment-form.css' => '4ecc56ef',
135
-
'rsrc/css/phui/phui-comment-panel.css' => '5659325f',
135
+
'rsrc/css/phui/phui-comment-panel.css' => 'c40ce0ea',
136
136
'rsrc/css/phui/phui-crumbs-view.css' => '195ac419',
137
137
'rsrc/css/phui/phui-curtain-view.css' => '947bf1a4',
138
138
'rsrc/css/phui/phui-document-pro.css' => 'c354e312',
···
146
146
'rsrc/css/phui/phui-header-view.css' => '6ec8f155',
147
147
'rsrc/css/phui/phui-hovercard.css' => 'de1a2119',
148
148
'rsrc/css/phui/phui-icon-set-selector.css' => '1ab67aad',
149
-
'rsrc/css/phui/phui-icon.css' => '417f80fb',
149
+
'rsrc/css/phui/phui-icon.css' => '09f46dd9',
150
150
'rsrc/css/phui/phui-image-mask.css' => 'a8498f9c',
151
151
'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
152
152
'rsrc/css/phui/phui-info-view.css' => 'ec92802a',
153
153
'rsrc/css/phui/phui-invisible-character-view.css' => '6993d9f0',
154
-
'rsrc/css/phui/phui-lightbox.css' => '67a017b2',
154
+
'rsrc/css/phui/phui-lightbox.css' => '9d65cfb5',
155
155
'rsrc/css/phui/phui-list.css' => '9da2aa00',
156
156
'rsrc/css/phui/phui-object-box.css' => '6b487c57',
157
157
'rsrc/css/phui/phui-object-item-list-view.css' => '87278fa0',
···
505
505
'rsrc/js/core/behavior-hovercard.js' => 'bcaccd64',
506
506
'rsrc/js/core/behavior-keyboard-pager.js' => 'a8da01f0',
507
507
'rsrc/js/core/behavior-keyboard-shortcuts.js' => '01fca1f0',
508
-
'rsrc/js/core/behavior-lightbox-attachments.js' => '24afe1a8',
508
+
'rsrc/js/core/behavior-lightbox-attachments.js' => 'c0a04fd9',
509
509
'rsrc/js/core/behavior-line-linker.js' => '1499a8cb',
510
510
'rsrc/js/core/behavior-more.js' => 'a80d0378',
511
511
'rsrc/js/core/behavior-object-selector.js' => 'e0ec7f2f',
···
651
651
'javelin-behavior-history-install' => '7ee2b591',
652
652
'javelin-behavior-icon-composer' => '8499b6ab',
653
653
'javelin-behavior-launch-icon-composer' => '48086888',
654
-
'javelin-behavior-lightbox-attachments' => '24afe1a8',
654
+
'javelin-behavior-lightbox-attachments' => 'c0a04fd9',
655
655
'javelin-behavior-line-chart' => 'e4232876',
656
656
'javelin-behavior-load-blame' => '42126667',
657
657
'javelin-behavior-maniphest-batch-editor' => '782ab6e7',
···
847
847
'phui-chart-css' => '6bf6f78e',
848
848
'phui-cms-css' => 'be43c8a8',
849
849
'phui-comment-form-css' => '4ecc56ef',
850
-
'phui-comment-panel-css' => '5659325f',
850
+
'phui-comment-panel-css' => 'c40ce0ea',
851
851
'phui-crumbs-view-css' => '195ac419',
852
852
'phui-curtain-view-css' => '947bf1a4',
853
853
'phui-document-summary-view-css' => '9ca48bdf',
···
863
863
'phui-hovercard' => '1bd28176',
864
864
'phui-hovercard-view-css' => 'de1a2119',
865
865
'phui-icon-set-selector-css' => '1ab67aad',
866
-
'phui-icon-view-css' => '417f80fb',
866
+
'phui-icon-view-css' => '09f46dd9',
867
867
'phui-image-mask-css' => 'a8498f9c',
868
868
'phui-info-panel-css' => '27ea50a1',
869
869
'phui-info-view-css' => 'ec92802a',
870
870
'phui-inline-comment-view-css' => '5953c28e',
871
871
'phui-invisible-character-view-css' => '6993d9f0',
872
-
'phui-lightbox-css' => '67a017b2',
872
+
'phui-lightbox-css' => '9d65cfb5',
873
873
'phui-list-view-css' => '9da2aa00',
874
874
'phui-object-box-css' => '6b487c57',
875
875
'phui-object-item-list-view-css' => '87278fa0',
···
1106
1106
'javelin-workflow',
1107
1107
'javelin-util',
1108
1108
),
1109
-
'24afe1a8' => array(
1110
-
'javelin-behavior',
1111
-
'javelin-stratcom',
1112
-
'javelin-dom',
1113
-
'javelin-mask',
1114
-
'javelin-util',
1115
-
'phuix-icon-view',
1116
-
'phabricator-busy',
1117
-
),
1118
1109
'2926fff2' => array(
1119
1110
'javelin-behavior',
1120
1111
'javelin-dom',
···
1360
1351
'javelin-workflow',
1361
1352
'phabricator-drag-and-drop-file-upload',
1362
1353
'javelin-workboard-board',
1363
-
),
1364
-
'5659325f' => array(
1365
-
'phui-timeline-view-css',
1366
1354
),
1367
1355
'58dea2fa' => array(
1368
1356
'javelin-install',
···
1968
1956
'bff6884b' => array(
1969
1957
'javelin-install',
1970
1958
'javelin-dom',
1959
+
),
1960
+
'c0a04fd9' => array(
1961
+
'javelin-behavior',
1962
+
'javelin-stratcom',
1963
+
'javelin-dom',
1964
+
'javelin-mask',
1965
+
'javelin-util',
1966
+
'phuix-icon-view',
1967
+
'phabricator-busy',
1968
+
),
1969
+
'c40ce0ea' => array(
1970
+
'phui-timeline-view-css',
1971
1971
),
1972
1972
'c587b80f' => array(
1973
1973
'javelin-install',
+4
-4
src/view/page/PhabricatorStandardPageView.php
+4
-4
src/view/page/PhabricatorStandardPageView.php
···
277
277
'action' => '#',
278
278
'method' => 'POST',
279
279
'class' => 'lightbox-download-form',
280
-
'sigil' => 'download',
280
+
'sigil' => 'download lightbox-download-submit',
281
281
),
282
282
phutil_tag(
283
-
'button',
283
+
'a',
284
284
array(
285
-
'class' => 'button grey has-icon',
285
+
'class' => 'lightbox-download phui-icon-circle hover-green',
286
+
'href' => '#',
286
287
),
287
288
array(
288
289
$icon,
289
-
pht('Download'),
290
290
)));
291
291
292
292
Javelin::initBehavior(
+5
webroot/rsrc/css/phui/phui-comment-panel.css
+5
webroot/rsrc/css/phui/phui-comment-panel.css
+12
webroot/rsrc/css/phui/phui-icon.css
+12
webroot/rsrc/css/phui/phui-icon.css
···
49
49
text-align: center;
50
50
display: inline-block;
51
51
cursor: pointer;
52
+
background: transparent;
53
+
padding: 0;
52
54
}
53
55
54
56
.phui-icon-circle.circle-medium {
···
109
111
110
112
a.phui-icon-circle.hover-green:hover .phui-icon-view {
111
113
color: {$green};
114
+
}
115
+
116
+
a.phui-icon-circle.hover-red:hover {
117
+
text-decoration: none;
118
+
border-color: {$red};
119
+
cursor: pointer;
120
+
}
121
+
122
+
a.phui-icon-circle.hover-red:hover .phui-icon-view {
123
+
color: {$red};
112
124
}
113
125
114
126
/* - Icon in a Square ------------------------------------------------------- */
+21
-11
webroot/rsrc/css/phui/phui-lightbox.css
+21
-11
webroot/rsrc/css/phui/phui-lightbox.css
···
77
77
opacity: 1;
78
78
}
79
79
80
+
.device-phone .comment-panel-open .lightbox-comment-frame {
81
+
width: auto;
82
+
left: 0;
83
+
}
84
+
80
85
.jx-mask + .lightbox-attachment {
81
86
background: {$lightgreybackground};
82
87
}
···
100
105
color: {$greytext};
101
106
}
102
107
108
+
.device-phone .lightbox-attachment .lightbox-status {
109
+
padding: 0 12px;
110
+
}
111
+
103
112
.lightbox-attachment .lightbox-status .lightbox-download {
104
113
float: right;
105
114
}
106
115
107
-
.lightbox-attachment .lightbox-status a {
116
+
.lightbox-attachment .lightbox-status-txt a {
108
117
color: #000;
109
118
margin-right: 12px;
110
119
font-size: {$biggerfontsize};
111
120
}
112
121
113
-
.lightbox-download button.has-icon {
114
-
padding-left: 28px;
122
+
.lightbox-attachment .lightbox-status .phui-icon-view {
123
+
height: 18px;
124
+
width: 24px;
125
+
font-size: 14px;
126
+
line-height: 23px;
127
+
display: block;
115
128
}
116
129
117
130
.lightbox-attachment .lightbox-status .lightbox-download
···
119
132
display: inline;
120
133
}
121
134
122
-
.lightbox-attachment .lightbox-comment {
135
+
.lightbox-attachment a.lightbox-download,
136
+
.lightbox-attachment a.lightbox-comment,
137
+
.lightbox-attachment a.lightbox-close {
123
138
float: right;
124
139
margin: 9px 0 0 8px;
125
-
padding-left: 28px;
126
140
}
127
141
128
-
.lightbox-attachment.comment-panel-open .lightbox-comment,
142
+
.lightbox-attachment.comment-panel-open .lightbox-comment.phui-icon-circle,
129
143
.lightbox-attachment.comment-panel-open .lightbox-comment .phui-icon-view {
130
144
color: {$sky};
131
-
}
132
-
133
-
.lightbox-attachment .lightbox-close {
134
-
float: right;
135
-
margin: 9px 0 0 8px;
145
+
border-color: {$sky};
136
146
}
137
147
138
148
.lightbox-attachment .lightbox-left {
+19
-5
webroot/rsrc/js/core/behavior-lightbox-attachments.js
+19
-5
webroot/rsrc/js/core/behavior-lightbox-attachments.js
···
166
166
);
167
167
168
168
var commentIcon = new JX.PHUIXIconView()
169
-
.setIcon('fa-comment-o')
169
+
.setIcon('fa-comments')
170
170
.getNode();
171
171
var commentButton =
172
172
JX.$N('a',
173
173
{
174
-
className : 'lightbox-comment button grey has-icon',
174
+
className : 'lightbox-comment phui-icon-circle hover-sky',
175
175
href : '#',
176
176
sigil : 'lightbox-comment'
177
177
},
178
-
[commentIcon, 'Comment']
178
+
commentIcon
179
179
);
180
+
var closeIcon = new JX.PHUIXIconView()
181
+
.setIcon('fa-times')
182
+
.getNode();
180
183
var closeButton =
181
184
JX.$N('a',
182
185
{
183
-
className : 'lightbox-close button grey',
186
+
className : 'lightbox-close phui-icon-circle hover-red',
184
187
href : '#'
185
188
},
186
-
'Close');
189
+
closeIcon);
187
190
var statusHTML =
188
191
JX.$N('div',
189
192
{
···
356
359
['submit', 'didSyntheticSubmit'],
357
360
'lightbox-comment-form',
358
361
_sendMessage);
362
+
363
+
var _startDownload = function(e) {
364
+
e.kill();
365
+
var form = e.getNode('tag:form');
366
+
form.submit();
367
+
};
368
+
369
+
JX.Stratcom.listen(
370
+
'click',
371
+
'lightbox-download-submit',
372
+
_startDownload);
359
373
360
374
});