|
1 /*------------------------------------------------------------------------------ |
|
2 11.2 - Post Revisions |
|
3 ------------------------------------------------------------------------------*/ |
|
4 .revisions-control-frame, |
|
5 .revisions-diff-frame { |
|
6 position: relative; |
|
7 } |
|
8 |
|
9 .revisions-controls { |
|
10 padding-top: 40px; |
|
11 height: 100px; |
|
12 z-index: 1; |
|
13 } |
|
14 |
|
15 .revisions-controls input[type="checkbox"] { |
|
16 position: relative; |
|
17 top: -1px; |
|
18 vertical-align: text-bottom; |
|
19 } |
|
20 |
|
21 .revisions.pinned .revisions-controls { |
|
22 position: fixed; |
|
23 top: 0; |
|
24 height: 82px; |
|
25 background: #fff; |
|
26 -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
27 box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
28 } |
|
29 |
|
30 .revisions-tickmarks { |
|
31 position: relative; |
|
32 margin: 0 auto; |
|
33 height: 0.7em; |
|
34 top: 7px; |
|
35 max-width: 70%; |
|
36 -webkit-box-sizing: border-box; |
|
37 -moz-box-sizing: border-box; |
|
38 box-sizing: border-box; |
|
39 background-color: #fff; |
|
40 } |
|
41 |
|
42 .revisions-tickmarks > div { |
|
43 position: absolute; |
|
44 height: 100%; |
|
45 border-right: 1px solid #a0a5aa; |
|
46 -webkit-box-sizing: border-box; |
|
47 -moz-box-sizing: border-box; |
|
48 box-sizing: border-box; |
|
49 } |
|
50 |
|
51 .revisions-tickmarks > div:first-child { |
|
52 border-width: 0; |
|
53 } |
|
54 |
|
55 .comparing-two-revisions .revisions-controls { |
|
56 height: 140px; |
|
57 } |
|
58 |
|
59 .comparing-two-revisions.pinned .revisions-controls { |
|
60 height: 124px; |
|
61 } |
|
62 |
|
63 .revisions .diff-error { |
|
64 position: absolute; |
|
65 text-align: center; |
|
66 margin: 0 auto; |
|
67 width: 100%; |
|
68 display: none; |
|
69 } |
|
70 |
|
71 .revisions.diff-error .diff-error { |
|
72 display: block; |
|
73 } |
|
74 |
|
75 .revisions .loading-indicator { |
|
76 position: absolute; |
|
77 vertical-align: middle; |
|
78 opacity: 0; |
|
79 width: 100%; |
|
80 width: -webkit-calc( 100% - 30px ); |
|
81 width: calc( 100% - 30px ); |
|
82 top: 50%; |
|
83 top: -webkit-calc( 50% - 10px ); |
|
84 top: calc( 50% - 10px ); |
|
85 -webkit-transition: opacity 0.5s; |
|
86 transition: opacity 0.5s; |
|
87 filter: alpha(opacity=0); /* ie8 and earlier */ |
|
88 } |
|
89 |
|
90 body.folded .revisions .loading-indicator { |
|
91 margin-right: -32px; |
|
92 } |
|
93 |
|
94 .revisions .loading-indicator span.spinner { |
|
95 display: block; |
|
96 margin: 0 auto; |
|
97 float: none; |
|
98 } |
|
99 |
|
100 .revisions.loading .loading-indicator { |
|
101 opacity: 1; |
|
102 filter: alpha(opacity=100); /* ie8 and earlier */ |
|
103 } |
|
104 |
|
105 .revisions .diff { |
|
106 -webkit-transition: opacity 0.5s; |
|
107 transition: opacity 0.5s; |
|
108 } |
|
109 |
|
110 .revisions.loading .diff { |
|
111 opacity: 0.5; |
|
112 filter: alpha(opacity=50); /* ie8 and earlier */ |
|
113 } |
|
114 |
|
115 .revisions.diff-error .diff { |
|
116 visibility: hidden; |
|
117 } |
|
118 |
|
119 .revisions-meta { |
|
120 margin-top: 20px; |
|
121 background-color: #fff; |
|
122 -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
123 box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
124 } |
|
125 |
|
126 .revisions.pinned .revisions-meta { |
|
127 -webkit-box-shadow: none; |
|
128 box-shadow: none; |
|
129 } |
|
130 |
|
131 .revision-toggle-compare-mode { |
|
132 position: absolute; |
|
133 top: 0; |
|
134 left: 0; |
|
135 } |
|
136 |
|
137 .comparing-two-revisions .revisions-previous, |
|
138 .comparing-two-revisions .revisions-next, |
|
139 .revisions-meta .diff-meta-to strong { |
|
140 display: none; |
|
141 } |
|
142 |
|
143 .revisions-controls .author-card .date { |
|
144 color: #777; |
|
145 } |
|
146 |
|
147 .revisions-controls .author-card.autosave { |
|
148 color: #d54e21; |
|
149 } |
|
150 |
|
151 .revisions-controls .author-card .author-name { |
|
152 font-weight: bold; |
|
153 } |
|
154 |
|
155 .comparing-two-revisions .diff-meta-to strong { |
|
156 display: block; |
|
157 } |
|
158 |
|
159 .revisions.pinned .revisions-buttons { |
|
160 padding: 0 11px; |
|
161 } |
|
162 |
|
163 .revisions-previous, |
|
164 .revisions-next { |
|
165 position: relative; |
|
166 z-index: 1; |
|
167 } |
|
168 |
|
169 .revisions-previous { |
|
170 float: right; |
|
171 } |
|
172 |
|
173 .revisions-next { |
|
174 float: left; |
|
175 } |
|
176 |
|
177 .revisions-controls .wp-slider { |
|
178 max-width: 70%; |
|
179 margin: 0 auto; |
|
180 top: -3px; |
|
181 } |
|
182 |
|
183 .revisions-diff { |
|
184 padding: 15px; |
|
185 background-color: #fff; |
|
186 -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
187 box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
188 } |
|
189 |
|
190 .revisions-diff h3:first-child { |
|
191 margin-top: 0; |
|
192 } |
|
193 |
|
194 /* Revision meta box */ |
|
195 .post-revisions li img, |
|
196 #revisions-meta-restored img { |
|
197 vertical-align: middle; |
|
198 } |
|
199 |
|
200 table.diff tbody tr td:nth-child(2) { |
|
201 width: 4%; |
|
202 } |
|
203 |
|
204 table.diff { |
|
205 table-layout: fixed; |
|
206 width: 100%; |
|
207 white-space: pre-wrap; |
|
208 } |
|
209 |
|
210 table.diff col.content { |
|
211 width: auto; |
|
212 } |
|
213 |
|
214 table.diff col.content.diffsplit { |
|
215 width: 48%; |
|
216 } |
|
217 |
|
218 table.diff col.diffsplit.middle { |
|
219 width: auto; |
|
220 } |
|
221 |
|
222 table.diff col.ltype { |
|
223 width: 30px; |
|
224 } |
|
225 |
|
226 table.diff tr { |
|
227 background-color: transparent; |
|
228 } |
|
229 |
|
230 table.diff td, |
|
231 table.diff th { |
|
232 font-family: Consolas, Monaco, monospace; |
|
233 font-size: 14px; |
|
234 line-height: 1.618; |
|
235 padding: .5em; |
|
236 vertical-align: top; |
|
237 word-wrap: break-word; |
|
238 } |
|
239 |
|
240 table.diff td h1, |
|
241 table.diff td h2, |
|
242 table.diff td h3, |
|
243 table.diff td h4, |
|
244 table.diff td h5, |
|
245 table.diff td h6 { |
|
246 margin: 0; |
|
247 } |
|
248 |
|
249 table.diff .diff-deletedline del, |
|
250 table.diff .diff-addedline ins { |
|
251 text-decoration: none; |
|
252 } |
|
253 |
|
254 table.diff .diff-deletedline { |
|
255 background-color: #ffe9e9; |
|
256 } |
|
257 |
|
258 table.diff .diff-deletedline del { |
|
259 background-color: #faa; |
|
260 } |
|
261 |
|
262 table.diff .diff-addedline { |
|
263 background-color: #e9ffe9; |
|
264 } |
|
265 |
|
266 table.diff .diff-addedline ins { |
|
267 background-color: #afa; |
|
268 } |
|
269 |
|
270 .diff-meta { |
|
271 padding: 5px; |
|
272 clear: both; |
|
273 min-height: 32px; |
|
274 } |
|
275 |
|
276 .diff-title strong { |
|
277 line-height: 32px; |
|
278 min-width: 60px; |
|
279 text-align: left; |
|
280 float: right; |
|
281 margin-left: 5px; |
|
282 } |
|
283 |
|
284 .revisions-controls .author-card .author-info { |
|
285 font-size: 12px; |
|
286 line-height: 16px; |
|
287 } |
|
288 |
|
289 .revisions-controls .author-card .avatar, |
|
290 .revisions-controls .author-card .author-info { |
|
291 float: right; |
|
292 margin-right: 6px; |
|
293 margin-left: 6px; |
|
294 } |
|
295 |
|
296 .revisions-controls .author-card .byline { |
|
297 display: block; |
|
298 font-size: 12px; |
|
299 } |
|
300 |
|
301 .revisions-controls .author-card .avatar { |
|
302 vertical-align: middle; |
|
303 } |
|
304 |
|
305 .diff-meta input.restore-revision { |
|
306 float: left; |
|
307 margin-right: 6px; |
|
308 margin-left: 6px; |
|
309 margin-top: 4px; |
|
310 } |
|
311 |
|
312 .diff-meta-from { |
|
313 display: none; |
|
314 } |
|
315 |
|
316 .comparing-two-revisions .diff-meta-from { |
|
317 display: block; |
|
318 } |
|
319 |
|
320 .revisions-tooltip { |
|
321 position: absolute; |
|
322 bottom: 105px; |
|
323 margin-left: 0; |
|
324 margin-right: -69px; |
|
325 z-index: 0; |
|
326 max-width: 350px; |
|
327 min-width: 130px; |
|
328 padding: 8px 4px; |
|
329 display: none; |
|
330 opacity: 0; |
|
331 } |
|
332 |
|
333 .revisions-tooltip.flipped { |
|
334 margin-right: 0; |
|
335 margin-left: -70px; |
|
336 } |
|
337 |
|
338 .revisions.pinned .revisions-tooltip { |
|
339 display: none !important; |
|
340 } |
|
341 |
|
342 .comparing-two-revisions .revisions-tooltip { |
|
343 bottom: 145px; |
|
344 } |
|
345 |
|
346 .revisions-tooltip-arrow { |
|
347 width: 70px; |
|
348 height: 15px; |
|
349 overflow: hidden; |
|
350 position: absolute; |
|
351 right: 0; |
|
352 margin-right: 35px; |
|
353 bottom: -15px; |
|
354 } |
|
355 |
|
356 .revisions-tooltip.flipped .revisions-tooltip-arrow { |
|
357 margin-right: 0; |
|
358 margin-left: 35px; |
|
359 right: auto; |
|
360 left: 0; |
|
361 } |
|
362 |
|
363 .revisions-tooltip-arrow > span { |
|
364 content: ""; |
|
365 position: absolute; |
|
366 right: 20px; |
|
367 top: -20px; |
|
368 width: 25px; |
|
369 height: 25px; |
|
370 -webkit-transform: rotate(-45deg); |
|
371 -ms-transform: rotate(-45deg); |
|
372 transform: rotate(-45deg); |
|
373 } |
|
374 |
|
375 .revisions-tooltip.flipped .revisions-tooltip-arrow > span { |
|
376 right: auto; |
|
377 left: 20px; |
|
378 } |
|
379 |
|
380 .ie8 .revisions-tooltip-arrow > span { |
|
381 right: 15px; |
|
382 top: -25px; |
|
383 -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)"; |
|
384 } |
|
385 |
|
386 .ie8 .revisions-tooltip.flipped .revisions-tooltip-arrow > span { |
|
387 left: 25px; |
|
388 } |
|
389 |
|
390 .revisions-tooltip, |
|
391 .revisions-tooltip-arrow > span { |
|
392 border: 1px solid #d7d7d7; |
|
393 background-color: #fff; |
|
394 } |
|
395 |
|
396 .revisions-tooltip { |
|
397 display: none; |
|
398 } |
|
399 |
|
400 .arrow { |
|
401 width: 70px; |
|
402 height: 16px; |
|
403 overflow: hidden; |
|
404 position: absolute; |
|
405 right: 0; |
|
406 margin-right: -35px; |
|
407 bottom: 90px; |
|
408 z-index: 10000; |
|
409 } |
|
410 |
|
411 .arrow:after { |
|
412 z-index: 9999; |
|
413 background-color: #fff; |
|
414 -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
415 box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
|
416 } |
|
417 |
|
418 .arrow.top { |
|
419 top: -16px; |
|
420 bottom: auto; |
|
421 } |
|
422 |
|
423 .arrow.left { |
|
424 right: 20%; |
|
425 } |
|
426 |
|
427 .arrow:after { |
|
428 content: ""; |
|
429 position: absolute; |
|
430 right: 20px; |
|
431 top: -20px; |
|
432 width: 25px; |
|
433 height: 25px; |
|
434 -webkit-transform: rotate(-45deg); |
|
435 -ms-transform: rotate(-45deg); |
|
436 transform: rotate(-45deg); |
|
437 } |
|
438 |
|
439 .revisions-tooltip, |
|
440 .revisions-tooltip-arrow:after { |
|
441 border-width: 1px; |
|
442 border-style: solid; |
|
443 } |
|
444 |
|
445 div.revisions-controls > .wp-slider > .ui-slider-handle { |
|
446 margin-right: -10px; |
|
447 } |
|
448 |
|
449 .rtl div.revisions-controls > .wp-slider > .ui-slider-handle { |
|
450 margin-left: -10px; |
|
451 } |
|
452 |
|
453 /* jQuery UI Slider */ |
|
454 .wp-slider.ui-slider { |
|
455 position: relative; |
|
456 border: 1px solid #d7d7d7; |
|
457 text-align: right; |
|
458 cursor: pointer; |
|
459 } |
|
460 |
|
461 .wp-slider .ui-slider-handle { |
|
462 -webkit-border-radius: 50%; |
|
463 border-radius: 50%; |
|
464 height: 18px; |
|
465 margin-top: -3px; |
|
466 outline: none; |
|
467 position: absolute; |
|
468 width: 18px; |
|
469 z-index: 2; |
|
470 -ms-touch-action: none; |
|
471 touch-action: none; |
|
472 } |
|
473 |
|
474 .wp-slider .ui-slider-handle, |
|
475 .wp-slider .ui-slider-handle.ui-state-hover, |
|
476 .wp-slider .ui-slider-handle.focus { |
|
477 background: #00a0d2; |
|
478 border: 1px solid #0073aa; |
|
479 -webkit-box-shadow: inset 0 1px 0 #78c8e6, 0 1px 0 rgba(0,0,0,.15); |
|
480 box-shadow: inset 0 1px 0 #78c8e6, 0 1px 0 rgba(0,0,0,.15); |
|
481 } |
|
482 |
|
483 .wp-slider .ui-slider-handle:before { |
|
484 background: none; |
|
485 position: absolute; |
|
486 top: 0; |
|
487 right: 0; |
|
488 color: #fff; |
|
489 content: "\f229"; |
|
490 font: normal 18px/1 'dashicons'; |
|
491 speak: none; |
|
492 -webkit-font-smoothing: antialiased; |
|
493 -moz-osx-font-smoothing: grayscale; |
|
494 } |
|
495 |
|
496 .wp-slider .ui-slider-handle.from-handle:before, |
|
497 .wp-slider .ui-slider-handle.to-handle:before { |
|
498 font-size: 20px !important; |
|
499 margin: -1px -1px 0 0; |
|
500 } |
|
501 |
|
502 .wp-slider .ui-slider-handle.from-handle:before { |
|
503 content: '\f139'; |
|
504 } |
|
505 |
|
506 .wp-slider .ui-slider-handle.to-handle:before { |
|
507 content: '\f141'; |
|
508 } |
|
509 |
|
510 .rtl .wp-slider .ui-slider-handle.from-handle:before { |
|
511 content: '\f141'; |
|
512 } |
|
513 |
|
514 .rtl .wp-slider .ui-slider-handle.to-handle:before { |
|
515 content: '\f139'; |
|
516 left: -1px; |
|
517 } |
|
518 |
|
519 .wp-slider .ui-slider-range { |
|
520 position: absolute; |
|
521 font-size: .7em; |
|
522 display: block; |
|
523 border: 0; |
|
524 background-color: transparent; |
|
525 background-image: none; |
|
526 } |
|
527 |
|
528 .wp-slider.ui-slider-horizontal { |
|
529 height: .7em; |
|
530 } |
|
531 |
|
532 .wp-slider.ui-slider-horizontal .ui-slider-handle { |
|
533 top: -.25em; |
|
534 margin-right: -.6em; |
|
535 } |
|
536 |
|
537 .wp-slider.ui-slider-horizontal .ui-slider-range { |
|
538 top: 0; |
|
539 height: 100%; |
|
540 } |
|
541 |
|
542 .wp-slider.ui-slider-horizontal .ui-slider-range-min { |
|
543 right: 0; |
|
544 } |
|
545 |
|
546 .wp-slider.ui-slider-horizontal .ui-slider-range-max { |
|
547 left: 0; |
|
548 } |
|
549 |
|
550 /* =Media Queries |
|
551 -------------------------------------------------------------- */ |
|
552 |
|
553 /** |
|
554 * HiDPI Displays |
|
555 */ |
|
556 @media print, |
|
557 (-webkit-min-device-pixel-ratio: 1.25), |
|
558 (min-resolution: 120dpi) { |
|
559 .revision-tick.completed-false { |
|
560 background-image: url(../images/spinner-2x.gif); |
|
561 } |
|
562 } |
|
563 |
|
564 @media screen and ( max-width: 782px ) { |
|
565 #diff-next-revision, |
|
566 #diff-previous-revision { |
|
567 margin-top: -1em; |
|
568 } |
|
569 |
|
570 table.diff { |
|
571 -ms-word-break: break-all; |
|
572 word-break: break-all; |
|
573 word-wrap: break-word; |
|
574 } |
|
575 } |