@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
1/**
2 * @provides phui-document-view-pro-css
3 */
4
5.phui-document-view.phui-document-view-pro {
6 max-width: 800px;
7 padding: 16px 16px 32px 16px;
8 margin: 0 auto;
9}
10
11.phui-document-view.phui-document-view-pro.has-curtain {
12 max-width: 1132px;
13}
14
15.printable .phui-document-view.phui-document-view-pro.has-curtain {
16 max-width: none;
17}
18
19.device-desktop .phui-document-inner {
20 overflow: hidden;
21}
22
23.device-desktop .has-curtain .phui-document-content-view {
24 display: table-cell;
25}
26
27.printable .phui-document-content-view {
28 padding-right: 0;
29}
30
31.device-desktop .phui-document-content-outer {
32 display: table;
33 width: 100%;
34}
35
36/* Force very wide content, like tables with many columns, to scroll inside
37 the frame. See T13202. */
38.phui-document-content-view {
39 max-width: 800px;
40}
41
42.device-desktop .phui-document-content-inner {
43 display: table-row;
44}
45
46.device-desktop .phui-document-curtain {
47 display: table-cell;
48 width: 300px;
49}
50
51.printable .phui-document-curtain {
52 display: none;
53}
54
55.phui-document-container {
56 background-color: {$page.content};
57 position: relative;
58 border-bottom: 1px solid {$document.border};
59}
60
61.phui-document-view-pro-box {
62 max-width: 800px;
63 margin: 0 auto;
64}
65
66body.printable {
67 background-color: #fff;
68}
69
70.printable .phui-document-view-pro-box {
71 display: none;
72}
73
74.printable .phui-document-container {
75 border: none;
76}
77
78.printable .phui-document-container .phui-header-view .phui-header-subheader {
79 display: none;
80}
81
82.printable .phui-document-container .phui-header-view .phui-header-col3 {
83 display: none;
84}
85
86.device .phui-document-view-pro-box {
87 margin: 0 8px;
88}
89
90.phui-document-view-pro-box .phui-property-list-section {
91 margin: 16px auto;
92}
93
94.device .phui-document-view-pro-box .phui-property-list-section {
95 margin: 0 8px 16px;
96}
97
98.device .phui-document-view-pro-box .phui-property-list-container {
99 padding: 24px 0 0 0;
100}
101
102.device-phone .phui-document-view.phui-document-view-pro {
103 padding: 0 12px;
104 margin: 0 auto;
105}
106
107.phui-document-view-pro .phui-document-toc {
108 position: absolute;
109 top: 34px;
110 left: -44px;
111}
112
113.printable .phui-document-view-pro a.phui-document-toc {
114 display: none;
115}
116
117.phui-document-view-pro .phui-document-toc-list {
118 margin: 8px;
119 border: 1px solid {$lightgreyborder};
120 border-radius: 3px;
121 box-shadow: {$dropshadow};
122 width: 260px;
123 position: absolute;
124 z-index: 30;
125 background-color: {$page.content};
126 top: 52px;
127 left: -40px;
128}
129
130.device .phui-document-view-pro .phui-document-toc {
131 display: none;
132}
133
134.phui-document-toc-list {
135 display: none;
136}
137
138.phui-document-toc-open .phui-document-toc-list {
139 display: block;
140}
141
142.phui-document-toc-open .phui-document-toc {
143 border-color: {$blueborder};
144}
145
146.phui-document-view-pro .phui-document-toc-content {
147 margin: 8px 16px;
148}
149
150.phui-document-view-pro .phui-document-toc-header {
151 font-weight: bold;
152 color: {$bluetext};
153 margin-bottom: 8px;
154 text-transform: uppercase;
155 font-size: {$smallerfontsize};
156}
157
158.phui-document-view-pro .phui-document-toc-content li {
159 margin: 4px 8px 4px 0;
160}
161
162.phui-document-view-pro .phui-document-toc-content a {
163 padding: 2px 0;
164 display: block;
165 text-decoration: none;
166 color: {$darkbluetext};
167 text-overflow: ellipsis;
168 overflow: hidden;
169 white-space: nowrap;
170}
171
172.phui-document-view-pro .phui-document-toc-content a:hover,
173.phui-document-view-pro .phui-document-toc-content a:hover
174span.visual-only.phui-icon-view.phui-font-fa.fa-users {
175 color: {$anchor};
176 text-decoration: underline;
177 background-color: {$navigation-menu-hover-background};
178}
179
180.phui-document-view-pro .phui-document-toc-content li + ul {
181 margin: 4px 0 4px 8px;
182}
183
184.phui-document-view-pro .phui-document-content .phabricator-remarkup {
185 padding: 16px 0;
186 line-height: 1.7em;
187}
188
189.device-desktop .phui-document-view.phui-document-view-pro {
190 border: 0;
191}
192
193.phui-document-view.phui-document-view-pro .phui-header-shell {
194 background: transparent;
195 border-bottom: 1px solid {$thinblueborder};
196}
197
198.phui-document-view.phui-document-view-pro .phui-header-shell {
199 margin: 0;
200 padding: 16px 0 32px;
201}
202
203.device-phone .phui-document-view.phui-document-view-pro .phui-header-shell {
204 margin: 0;
205 padding: 16px 0 20px;
206}
207
208.phui-document-view.phui-document-view-pro .phui-header-tall
209 .phui-header-header {
210 font-size: 24px;
211 line-height: 30px;
212 color: {$blacktext};
213}
214
215.device-phone .phui-document-view.phui-document-view-pro .phui-header-tall
216 .phui-header-header {
217 font-size: 18px;
218 }
219
220.device-phone .phui-document-view-pro .phui-header-subheader {
221 display: flex;
222}
223
224.phui-document-view-pro .phui-info-view {
225 margin: 16px 0;
226}
227
228.phui-document-view-pro .phabricator-remarkup-embed-image-wide {
229 margin-left: -300px;
230 margin-right: -300px;
231 width: auto;
232}
233
234.phui-document-view-pro .phabricator-remarkup-embed-image-wide img {
235 max-width: 1200px;
236}
237
238@media (max-width: 1200px) {
239 .phui-document-view-pro .phabricator-remarkup-embed-image-wide {
240 margin-left: 0;
241 margin-right: 0;
242 width: auto;
243 }
244
245 .phui-document-view-pro .phabricator-remarkup-embed-image-wide img {
246 max-width: inherit;
247 }
248}
249
250.phui-document-view-pro-box {
251 margin-bottom: 24px;
252}
253
254.phui-document-view-pro-box .phui-timeline-view {
255 padding: 16px 0 0 0;
256 background: none;
257}
258
259.phui-document-view-pro-box .phui-timeline-wedge {
260 display: none;
261}
262
263.phui-document-view-pro-box .phui-timeline-major-event .phui-timeline-group {
264 border: none;
265}
266
267.phui-document-view-pro-box .phui-timeline-major-event .phui-timeline-content {
268 border: none;
269}
270
271.device-desktop .phui-document-view-pro-box
272 .phui-timeline-event-view.phui-timeline-minor-event {
273 margin-left: 62px;
274}
275
276.phui-document-view-pro-box .phui-timeline-title {
277 border-top-right-radius: 3px;
278 border-top-left-radius: 3px;
279 background-color: {$page.content};
280 border-bottom: 1px solid #F1F1F4;
281}
282
283.phui-document-view-pro-box .phui-timeline-title-with-icon {
284 padding-left: 12px;
285}
286
287.phui-document-view-pro-box .phui-timeline-icon-fill {
288 display: none;
289}
290
291.phui-document-view-pro-box .phui-object-box {
292 margin: 0;
293}
294
295.phui-document-view-pro-box .phui-object-box .remarkup-assist-textarea {
296 height: 9em;
297}
298
299.document-has-foot .phui-document-view-pro {
300 padding-bottom: 0;
301}
302
303.phui-document-foot-content {
304 margin: 64px 0 32px;
305}
306
307@media (min-width: 1792px) {
308 .device-desktop .phui-document-content-outer {
309 display: table;
310 width: calc(100% - 300px);
311 }
312
313 div.phui-document-view.phui-document-view-pro.has-curtain {
314 max-width: 1332px;
315 left: 50px;
316 }
317
318 .device-desktop div.phui-document-view.phui-document-view-pro.has-curtain
319 div.phui-document-content-outer {
320 width: 1332px;
321 }
322
323 div.phui-document-content {
324 margin-left: -300px;
325 }
326
327 div.phui-document-curtain {
328 top: 130px;
329 position: sticky;
330 right: 15%;
331 }
332
333 div.phui-document-content-outer,
334 div.phui-document-view.phui-document-view-pro
335 div.phui-header-shell.phui-header-tall {
336 margin-left: 300px;
337 }
338
339 div.phui-document-toc-container > a.phui-document-toc {
340 display: none;
341 }
342
343 .device-desktop div.phui-document-inner {
344 overflow: inherit;
345 }
346
347 div.phui-list-sidenav.phui-document-toc-list {
348 top: -16px;
349 margin-top: 23px;
350 box-shadow: 0px 0px;
351 overflow-y: auto;
352 max-height: calc(100vh - 120px);
353 border: solid 1px {$lightgreyborder};
354 }
355
356 div.has-curtain div.phui-list-sidenav.phui-document-toc-list {
357 left: -185px;
358 margin-left: 175px;
359 }
360
361 .device-desktop .has-curtain div.phui-document-content-view {
362 display: block;
363 }
364
365 div.phui-document-container {
366 position: relative;
367 }
368
369 div.phui-document-toc-container {
370 position: sticky;
371 left: 0px;
372 top: 0;
373 margin-left: 32px;
374 }
375
376 div.phui-list-sidenav.phui-document-toc-list {
377 display: block;
378 }
379
380 div.phui-document-view-pro div.phui-document-toc-content li a {
381 white-space: break-spaces;
382 text-indent: -10px;
383 padding-left: 10px;
384 }
385
386 div.phui-document-view-pro div.phui-document-toc-content
387 span.visual-only.phui-icon-view.phui-font-fa {
388 text-indent: 0px;
389 }
390}