d0aa41673cff10d4948075989390a5e47fdfaefd
[lhc/web/wiklou.git] / resources / lib / ooui / oojs-ui-widgets-apex.css
1 /*!
2 * OOUI v0.30.0
3 * https://www.mediawiki.org/wiki/OOUI
4 *
5 * Copyright 2011–2018 OOUI Team and other contributors.
6 * Released under the MIT license
7 * http://oojs.mit-license.org
8 *
9 * Date: 2018-12-20T06:10:36Z
10 */
11 .oo-ui-draggableElement-handle:not( .oo-ui-draggableElement-undraggable ).oo-ui-widget {
12 cursor: move;
13 cursor: url(images/grab.cur );
14 cursor: -webkit-grab;
15 cursor: -moz-grab;
16 cursor: grab;
17 }
18 .oo-ui-draggableElement-handle:not( .oo-ui-draggableElement-undraggable ):active {
19 cursor: url(images/grabbing.cur );
20 cursor: -webkit-grabbing;
21 cursor: -moz-grabbing;
22 cursor: grabbing;
23 }
24 .oo-ui-draggableElement-handle.oo-ui-widget-disabled,
25 .oo-ui-widget-disabled .oo-ui-draggableElement-handle {
26 cursor: default;
27 }
28 .oo-ui-draggableElement-placeholder {
29 opacity: 0.2;
30 }
31 .oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement {
32 display: inline-block;
33 }
34
35
36
37 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous > .oo-ui-panelLayout-scrollable {
38 overflow: hidden;
39 }
40 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout {
41 width: 100%;
42 -webkit-box-sizing: border-box;
43 -moz-box-sizing: border-box;
44 box-sizing: border-box;
45 }
46 .oo-ui-bookletLayout-outlinePanel-editable > .oo-ui-outlineSelectWidget {
47 height: auto;
48 position: absolute;
49 top: 0;
50 left: 0;
51 right: 0;
52 bottom: 2.5em;
53 overflow: auto;
54 -webkit-overflow-scrolling: touch;
55 }
56 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
57 position: absolute;
58 bottom: 0;
59 left: 0;
60 right: 0;
61 height: 2.5em;
62 }
63 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout {
64 padding: 1.5em;
65 }
66 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
67 box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25);
68 }
69 .oo-ui-bookletLayout > .oo-ui-menuLayout-menu {
70 border-right: 1px solid #ddd;
71 }
72
73 .oo-ui-indexLayout {
74 /* Use two classes to ensure increased specificity over menuLayout */
75 }
76 .oo-ui-indexLayout.oo-ui-menuLayout > .oo-ui-menuLayout-menu {
77 height: auto;
78 }
79 .oo-ui-indexLayout.oo-ui-menuLayout.oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu {
80 height: 3em;
81 white-space: nowrap;
82 }
83 .oo-ui-indexLayout.oo-ui-menuLayout.oo-ui-menuLayout-expanded > .oo-ui-menuLayout-content {
84 top: 3em;
85 }
86 .oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout {
87 padding: 1.5em;
88 }
89
90 .oo-ui-menuLayout {
91 top: 0;
92 left: 0;
93 right: 0;
94 bottom: 0;
95 }
96 .oo-ui-menuLayout-expanded,
97 .oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu,
98 .oo-ui-menuLayout-expanded > .oo-ui-menuLayout-content {
99 position: absolute;
100 }
101 .oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu {
102 z-index: 1;
103 }
104 .oo-ui-menuLayout-static.oo-ui-menuLayout-after,
105 .oo-ui-menuLayout-static.oo-ui-menuLayout-before {
106 display: table;
107 width: 100%;
108 }
109 .oo-ui-menuLayout-static.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu,
110 .oo-ui-menuLayout-static.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu,
111 .oo-ui-menuLayout-static.oo-ui-menuLayout-after > .oo-ui-menuLayout-content,
112 .oo-ui-menuLayout-static.oo-ui-menuLayout-before > .oo-ui-menuLayout-content {
113 display: table-cell;
114 vertical-align: top;
115 }
116 .oo-ui-menuLayout > .oo-ui-menuLayout-menu,
117 .oo-ui-menuLayout > .oo-ui-menuLayout-content {
118 -webkit-transition: height 250ms, width 250ms, top 250ms, left 250ms, right 250ms, bottom 250ms;
119 -moz-transition: height 250ms, width 250ms, top 250ms, left 250ms, right 250ms, bottom 250ms;
120 transition: height 250ms, width 250ms, top 250ms, left 250ms, right 250ms, bottom 250ms;
121 }
122 .oo-ui-menuLayout > .oo-ui-menuLayout-menu {
123 height: 15.625em;
124 width: 15.625em;
125 }
126 .oo-ui-menuLayout > .oo-ui-menuLayout-content {
127 top: 15.625em;
128 left: 15.625em;
129 right: 15.625em;
130 bottom: 15.625em;
131 }
132 .oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu {
133 width: 0 !important;
134 height: 0 !important;
135 overflow: hidden;
136 }
137 .oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content {
138 top: 0 !important;
139 left: 0 !important;
140 right: 0 !important;
141 bottom: 0 !important;
142 }
143 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu {
144 width: auto !important;
145 left: 0;
146 top: 0;
147 right: 0;
148 }
149 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content {
150 right: 0 !important;
151 bottom: 0 !important;
152 left: 0 !important;
153 }
154 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu {
155 height: auto !important;
156 top: 0;
157 right: 0;
158 bottom: 0;
159 }
160 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content {
161 bottom: 0 !important;
162 left: 0 !important;
163 top: 0 !important;
164 }
165 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu {
166 width: auto !important;
167 right: 0;
168 bottom: 0;
169 left: 0;
170 }
171 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content {
172 left: 0 !important;
173 top: 0 !important;
174 right: 0 !important;
175 }
176 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu {
177 height: auto !important;
178 bottom: 0;
179 left: 0;
180 top: 0;
181 }
182 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content {
183 top: 0 !important;
184 right: 0 !important;
185 bottom: 0 !important;
186 }
187
188
189
190 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
191 display: block;
192 position: relative;
193 }
194
195 .oo-ui-buttonSelectWidget {
196 display: inline-block;
197 border-radius: 3px;
198 margin-right: 0.5em;
199 z-index: 0;
200 position: relative;
201 padding-bottom: 1px;
202 }
203 .oo-ui-buttonSelectWidget:last-child {
204 margin-right: 0;
205 }
206 .oo-ui-buttonSelectWidget:focus {
207 outline: 0;
208 }
209 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
210 border-radius: 0;
211 margin-right: -1px;
212 margin-bottom: -1px;
213 }
214 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button {
215 border-bottom-left-radius: 3px;
216 border-top-left-radius: 3px;
217 }
218 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonElement-button {
219 border-bottom-right-radius: 3px;
220 border-top-right-radius: 3px;
221 margin-right: 0;
222 }
223 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
224 border-color: #ace;
225 box-shadow: 0 0 2px 2px #ace;
226 }
227 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
228 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active {
229 z-index: 1;
230 }
231 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
232 z-index: 3;
233 }
234 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
235 z-index: -1;
236 }
237
238 .oo-ui-buttonOptionWidget {
239 display: inline-block;
240 padding: 0;
241 background-color: transparent;
242 }
243 .oo-ui-buttonOptionWidget.oo-ui-buttonElement-active .oo-ui-buttonElement-button {
244 cursor: default;
245 }
246 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected,
247 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
248 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted {
249 background-color: transparent;
250 }
251 .oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon,
252 .oo-ui-buttonOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
253 position: static;
254 display: inline-block;
255 vertical-align: middle;
256 }
257
258
259 .oo-ui-toggleButtonWidget {
260 margin-right: 0.5em;
261 }
262 .oo-ui-toggleButtonWidget:last-child {
263 margin-right: 0;
264 }
265
266 .oo-ui-toggleSwitchWidget {
267 position: relative;
268 display: inline-block;
269 vertical-align: middle;
270 overflow: hidden;
271 -webkit-box-sizing: border-box;
272 -moz-box-sizing: border-box;
273 box-sizing: border-box;
274 -webkit-transform: translateZ(0);
275 transform: translateZ(0);
276 background-color: #ebebeb;
277 background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #ddd), color-stop(100%, #fafafa));
278 background-image: -webkit-linear-gradient(top, #ddd 0, #fafafa 100%);
279 background-image: -moz-linear-gradient(top, #ddd 0, #fafafa 100%);
280 background-image: linear-gradient(to bottom, #ddd 0, #fafafa 100%);
281 width: 4em;
282 height: 2em;
283 margin-right: 0.5em;
284 border: 1px solid #ccc;
285 border-radius: 1em;
286 box-shadow: 0 0 0 #fff, inset 0 0.1em 0.2em #ddd;
287 }
288 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled {
289 cursor: pointer;
290 }
291 .oo-ui-toggleSwitchWidget-grip {
292 position: absolute;
293 display: block;
294 -webkit-box-sizing: border-box;
295 -moz-box-sizing: border-box;
296 box-sizing: border-box;
297 }
298 .oo-ui-toggleSwitchWidget:last-child {
299 margin-right: 0;
300 }
301 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
302 opacity: 0.5;
303 }
304 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover,
305 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
306 border-color: #aaa;
307 }
308 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {
309 outline: 0;
310 border-color: #ace;
311 box-shadow: 0 0 2px 2px #ace;
312 }
313 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip {
314 border-color: #ace;
315 }
316 .oo-ui-toggleSwitchWidget-grip {
317 background-color: #ebebeb;
318 background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #fafafa), color-stop(100%, #ddd));
319 background-image: -webkit-linear-gradient(top, #fafafa 0, #ddd 100%);
320 background-image: -moz-linear-gradient(top, #fafafa 0, #ddd 100%);
321 background-image: linear-gradient(to bottom, #fafafa 0, #ddd 100%);
322 top: 0.25em;
323 left: 0.25em;
324 width: 1.5em;
325 height: 1.5em;
326 margin-top: -1px;
327 border: 1px solid #ccc;
328 border-radius: 1em;
329 box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
330 -webkit-transition: left 250ms, margin-left 250ms;
331 -moz-transition: left 250ms, margin-left 250ms;
332 transition: left 250ms, margin-left 250ms;
333 }
334 .oo-ui-toggleSwitchWidget-glow {
335 position: absolute;
336 top: 0;
337 bottom: 0;
338 right: 0;
339 left: 0;
340 border-radius: 1em;
341 box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
342 -webkit-transition: opacity 250ms;
343 -moz-transition: opacity 250ms;
344 transition: opacity 250ms;
345 background-color: #cde7f4;
346 background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #b0d9ee), color-stop(100%, #eaf4fa));
347 background-image: -webkit-linear-gradient(top, #b0d9ee 0, #eaf4fa 100%);
348 background-image: -moz-linear-gradient(top, #b0d9ee 0, #eaf4fa 100%);
349 background-image: linear-gradient(to bottom, #b0d9ee 0, #eaf4fa 100%);
350 -webkit-touch-callout: none;
351 -webkit-user-select: none;
352 -moz-user-select: none;
353 -ms-user-select: none;
354 user-select: none;
355 }
356 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
357 opacity: 0;
358 }
359 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
360 left: 0.25em;
361 margin-left: 0;
362 }
363 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow {
364 opacity: 1;
365 }
366 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
367 left: 2.25em;
368 margin-left: -2px;
369 }
370
371 .oo-ui-selectFileWidget {
372 display: inline-block;
373 vertical-align: middle;
374 width: 100%;
375 max-width: 50em;
376 margin-right: 0.5em;
377 }
378 .oo-ui-selectFileWidget-selectButton {
379 display: table-cell;
380 }
381 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
382 position: relative;
383 overflow: hidden;
384 }
385 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > [type='file'] {
386 position: absolute;
387 top: 0;
388 bottom: 0;
389 left: 0;
390 right: 0;
391 width: 100%;
392 height: 100%;
393 opacity: 0;
394 z-index: 1;
395 cursor: pointer;
396 padding-top: 100px;
397 }
398 .oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > [type='file'] {
399 display: none;
400 }
401 .oo-ui-selectFileWidget-info {
402 width: 100%;
403 display: table-cell;
404 vertical-align: middle;
405 position: relative;
406 overflow: hidden;
407 -webkit-box-sizing: border-box;
408 -moz-box-sizing: border-box;
409 box-sizing: border-box;
410 }
411 .oo-ui-widget-disabled .oo-ui-selectFileWidget-info {
412 cursor: default;
413 -webkit-touch-callout: none;
414 -webkit-user-select: none;
415 -moz-user-select: none;
416 -ms-user-select: none;
417 user-select: none;
418 }
419 .oo-ui-selectFileWidget-label {
420 position: absolute;
421 top: 0;
422 bottom: 0;
423 left: 0;
424 right: 0;
425 text-overflow: ellipsis;
426 }
427 .oo-ui-selectFileWidget-clearButton {
428 position: absolute;
429 z-index: 2;
430 }
431 .oo-ui-selectFileWidget-dropTarget {
432 position: relative;
433 cursor: default;
434 height: 8.815em;
435 }
436 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel,
437 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
438 display: none;
439 }
440 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail {
441 width: 7.815em;
442 position: absolute;
443 top: 0.5em;
444 bottom: 0.5em;
445 left: 0.5em;
446 background-position: center center;
447 background-repeat: no-repeat;
448 background-size: contain;
449 }
450 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail.oo-ui-pendingElement-pending {
451 background-repeat: repeat;
452 background-size: auto;
453 }
454 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail > .oo-ui-selectFileWidget-noThumbnail-icon {
455 opacity: 0.4;
456 height: 7.815em;
457 width: 7.815em;
458 }
459 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
460 display: block;
461 height: 100%;
462 width: auto;
463 margin-left: 8.815em;
464 border: 0;
465 }
466 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-label {
467 display: block;
468 position: relative;
469 top: inherit;
470 }
471 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-fileName {
472 display: block;
473 }
474 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail,
475 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
476 display: none;
477 }
478 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
479 display: block;
480 margin: 2.2em 1em 1em;
481 }
482 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget,
483 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
484 text-align: center;
485 }
486 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
487 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
488 margin: 0;
489 }
490 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton,
491 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton {
492 display: none;
493 }
494 .oo-ui-selectFileWidget-empty.oo-ui-widget-enabled .oo-ui-selectFileWidget-label {
495 cursor: default;
496 }
497 .oo-ui-selectFileWidget-empty.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropLabel {
498 display: block;
499 }
500 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
501 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
502 -webkit-touch-callout: none;
503 -webkit-user-select: none;
504 -moz-user-select: none;
505 -ms-user-select: none;
506 user-select: none;
507 }
508 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
509 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget,
510 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget .oo-ui-buttonElement-button,
511 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget .oo-ui-buttonElement-button {
512 cursor: no-drop;
513 }
514 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
515 height: auto;
516 }
517 .oo-ui-selectFileWidget:last-child {
518 margin-right: 0;
519 }
520 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
521 border-radius: 0 3px 3px 0;
522 }
523 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button .oo-ui-iconElement-icon,
524 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator {
525 display: none;
526 }
527 .oo-ui-selectFileWidget-info {
528 height: 2.4em;
529 background-color: #fff;
530 border: 1px solid #ccc;
531 border-width: 1px 0 1px 1px;
532 border-radius: 3px 0 0 3px;
533 }
534 .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator,
535 .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon {
536 position: absolute;
537 top: 0;
538 height: 100%;
539 }
540 .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon {
541 left: 0.3em;
542 }
543 .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
544 right: 0.775em;
545 }
546 .oo-ui-selectFileWidget-label {
547 -webkit-box-sizing: border-box;
548 -moz-box-sizing: border-box;
549 box-sizing: border-box;
550 left: 0.5em;
551 right: 2.175em;
552 line-height: 2.3em;
553 margin: 0;
554 overflow: hidden;
555 white-space: nowrap;
556 text-overflow: ellipsis;
557 }
558 .oo-ui-selectFileWidget-clearButton {
559 top: 0;
560 right: 0;
561 height: 1.5625em;
562 margin: 0.15625em;
563 }
564 .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
565 height: 2.3em;
566 }
567 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label {
568 color: #ccc;
569 }
570 .oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-label {
571 left: 2.475em;
572 }
573 .oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-label {
574 right: 4.2625em;
575 }
576 .oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-clearButton {
577 right: 2.0875em;
578 }
579 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label,
580 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-label {
581 right: 0.5em;
582 }
583 .oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-label,
584 .oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-label,
585 .oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-label,
586 .oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-label {
587 right: 2em;
588 }
589 .oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop.oo-ui-selectFileWidget-dropTarget {
590 background-color: #e1f3ff;
591 }
592 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-label {
593 padding: 1em;
594 }
595 .oo-ui-selectFileWidget-dropTarget {
596 background-color: #fff;
597 border: 1px solid #aaa;
598 border-radius: 3px;
599 vertical-align: middle;
600 }
601 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
602 border-radius: 3px;
603 }
604 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-label {
605 line-height: 1.4;
606 overflow: inherit;
607 white-space: normal;
608 }
609 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-fileName {
610 padding-top: 0.5em;
611 padding-right: 2.375em;
612 }
613 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-clearButton {
614 right: 0.5em;
615 }
616 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget {
617 border-style: dashed;
618 }
619 .oo-ui-selectFileWidget.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
620 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
621 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
622 background-color: #f3f3f3;
623 color: #ccc;
624 border-color: #ddd;
625 text-shadow: 0 1px 1px #fff;
626 }
627 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info,
628 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-info,
629 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info {
630 background-color: #f3f3f3;
631 color: #ccc;
632 border-color: #ddd;
633 text-shadow: 0 1px 1px #fff;
634 }
635 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon,
636 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon,
637 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon,
638 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator,
639 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator,
640 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
641 opacity: 0.2;
642 }
643
644
645 .oo-ui-outlineOptionWidget {
646 -webkit-touch-callout: none;
647 -webkit-user-select: none;
648 -moz-user-select: none;
649 -ms-user-select: none;
650 user-select: none;
651 font-size: 1.1em;
652 padding: 0.75em;
653 }
654 .oo-ui-outlineOptionWidget .oo-ui-iconElement-icon {
655 font-size: 90.90909%;
656 }
657 .oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label {
658 padding-right: 1.5em;
659 }
660 .oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
661 opacity: 0.5;
662 }
663 .oo-ui-outlineOptionWidget-level-0.oo-ui-iconElement {
664 padding-left: 2.5em;
665 }
666 .oo-ui-outlineOptionWidget-level-1 {
667 padding-left: 2.5em;
668 }
669 .oo-ui-outlineOptionWidget-level-1.oo-ui-iconElement {
670 padding-left: 4.5em;
671 }
672 .oo-ui-outlineOptionWidget-level-1.oo-ui-iconElement .oo-ui-iconElement-icon {
673 left: 2.5em;
674 }
675 .oo-ui-outlineOptionWidget-level-2 {
676 padding-left: 5em;
677 }
678 .oo-ui-outlineOptionWidget-level-2.oo-ui-iconElement {
679 padding-left: 7em;
680 }
681 .oo-ui-outlineOptionWidget-level-2.oo-ui-iconElement .oo-ui-iconElement-icon {
682 left: 5em;
683 }
684 .oo-ui-selectWidget-depressed .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
685 background-color: #a7dcff;
686 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
687 }
688
689 .oo-ui-outlineControlsWidget {
690 background-color: #fff;
691 }
692 .oo-ui-outlineControlsWidget-items,
693 .oo-ui-outlineControlsWidget-movers {
694 float: left;
695 -webkit-box-sizing: border-box;
696 -moz-box-sizing: border-box;
697 box-sizing: border-box;
698 }
699 .oo-ui-outlineControlsWidget-items {
700 float: left;
701 }
702 .oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget {
703 float: left;
704 }
705 .oo-ui-outlineControlsWidget-movers {
706 float: right;
707 }
708 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
709 float: right;
710 }
711 .oo-ui-outlineControlsWidget-items > .oo-ui-buttonWidget,
712 .oo-ui-outlineControlsWidget-movers > .oo-ui-buttonWidget {
713 height: 2.5em;
714 width: 2.5em;
715 /* There's a lot of weird specific margins with weird specific selectors */
716 margin: 0 !important;
717 /* stylelint-disable-line declaration-no-important */
718 }
719
720 .oo-ui-tabSelectWidget {
721 text-align: left;
722 overflow-x: auto;
723 overflow-y: hidden;
724 -webkit-overflow-scrolling: touch;
725 background-color: #eee;
726 box-shadow: inset 0 -0.015em 0.1em rgba(0, 0, 0, 0.1);
727 }
728 .oo-ui-tabSelectWidget.oo-ui-widget-enabled:focus {
729 outline: 0;
730 }
731
732 .oo-ui-tabOptionWidget {
733 display: inline-block;
734 -webkit-box-sizing: border-box;
735 -moz-box-sizing: border-box;
736 box-sizing: border-box;
737 vertical-align: bottom;
738 color: #333;
739 margin: 0.5em 0 0 0.75em;
740 border-color: transparent;
741 border-style: solid;
742 border-width: 1px 1px 0 1px;
743 border-top-left-radius: 3px;
744 border-top-right-radius: 3px;
745 padding: 0.5em 1em;
746 }
747 .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
748 background-color: #fff;
749 color: #000;
750 border-color: #ddd;
751 }
752 .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
753 background-color: rgba(255, 255, 255, 0.2);
754 color: #000;
755 border-color: #ddd;
756 }
757 .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active {
758 background-color: #fff;
759 color: #000;
760 border-color: #ddd;
761 }
762 .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {
763 background-color: #fff;
764 color: #000;
765 cursor: default;
766 }
767 .oo-ui-tabSelectWidget.oo-ui-widget-enabled:focus .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected {
768 box-shadow: 0 0 2px 2px #ace;
769 }
770
771 .oo-ui-tagMultiselectWidget {
772 display: inline-block;
773 position: relative;
774 width: 100%;
775 max-width: 50em;
776 }
777 .oo-ui-tagMultiselectWidget-handle {
778 width: 100%;
779 display: block;
780 position: relative;
781 }
782 .oo-ui-tagMultiselectWidget-handle > .oo-ui-iconElement-icon,
783 .oo-ui-tagMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
784 position: absolute;
785 top: 0;
786 height: 100%;
787 }
788 .oo-ui-tagMultiselectWidget-content {
789 position: relative;
790 }
791 .oo-ui-tagMultiselectWidget-group {
792 display: inline;
793 }
794 .oo-ui-tagMultiselectWidget-outlined {
795 width: 100%;
796 }
797 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined .oo-ui-tagMultiselectWidget-handle {
798 cursor: text;
799 }
800 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-content > input {
801 display: none;
802 }
803 .oo-ui-tagMultiselectWidget-focusTrap {
804 display: inline-block;
805 height: 1px;
806 width: 1px;
807 }
808 .oo-ui-tagMultiselectWidget-focusTrap:focus {
809 outline: 0;
810 }
811 .oo-ui-tagMultiselectWidget-handle {
812 background-color: #fff;
813 cursor: text;
814 min-height: 2.4em;
815 margin-right: 0.5em;
816 padding: 0.15em 0.25em;
817 border: 1px solid rgba(0, 0, 0, 0.1);
818 border-radius: 3px;
819 -webkit-box-sizing: border-box;
820 -moz-box-sizing: border-box;
821 box-sizing: border-box;
822 }
823 .oo-ui-tagMultiselectWidget-handle:last-child {
824 margin-right: 0;
825 }
826 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input {
827 border: 0;
828 line-height: 1.675em;
829 margin: 0;
830 margin-left: 0.2em;
831 padding: 0;
832 font-size: inherit;
833 font-family: inherit;
834 background-color: transparent;
835 color: #000;
836 vertical-align: middle;
837 }
838 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::-webkit-input-placeholder {
839 color: #767676;
840 opacity: 1;
841 }
842 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input:-ms-input-placeholder {
843 color: #767676;
844 opacity: 1;
845 }
846 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::-moz-placeholder {
847 color: #767676;
848 opacity: 1;
849 }
850 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input:-moz-placeholder {
851 color: #767676;
852 opacity: 1;
853 }
854 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::placeholder {
855 color: #767676;
856 opacity: 1;
857 }
858 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input:focus {
859 outline: 0;
860 }
861 .oo-ui-tagMultiselectWidget.oo-ui-iconElement .oo-ui-tagMultiselectWidget-handle {
862 padding-left: 2.475em;
863 }
864 .oo-ui-tagMultiselectWidget.oo-ui-iconElement .oo-ui-tagMultiselectWidget-handle > .oo-ui-iconElement-icon {
865 left: 0;
866 margin: 0 0.3em;
867 }
868 .oo-ui-tagMultiselectWidget.oo-ui-indicatorElement .oo-ui-tagMultiselectWidget-handle {
869 padding-right: 2.4875em;
870 }
871 .oo-ui-tagMultiselectWidget.oo-ui-indicatorElement .oo-ui-tagMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
872 right: 0;
873 margin: 0 0.775em;
874 }
875 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined-handle {
876 border-color: rgba(0, 0, 0, 0.2);
877 }
878 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle {
879 border-color: #ace;
880 outline: 0;
881 box-shadow: 0 0 2px 2px #ace;
882 }
883 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid .oo-ui-tagMultiselectWidget-handle,
884 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid:hover .oo-ui-tagMultiselectWidget-handle {
885 border-color: #d45353;
886 }
887 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagMultiselectWidget-handle {
888 border-bottom: 0;
889 border-bottom-left-radius: 0;
890 border-bottom-right-radius: 0;
891 }
892 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
893 background-color: #fff;
894 }
895 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-inputWidget-input {
896 border-top-left-radius: 0;
897 border-top-right-radius: 0;
898 }
899 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
900 border-color: #d45353;
901 }
902 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
903 color: #d45353;
904 }
905 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle {
906 color: #ccc;
907 border-color: #ddd;
908 background-color: #f3f3f3;
909 text-shadow: 0 1px 1px #fff;
910 cursor: default;
911 }
912 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle > .oo-ui-iconElement-icon,
913 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
914 opacity: 0.2;
915 }
916 .oo-ui-tagMultiselectWidget-popup > .oo-ui-popupWidget-popup {
917 border: 0;
918 }
919
920
921 .oo-ui-tagItemWidget {
922 position: relative;
923 display: inline-block;
924 cursor: default;
925 white-space: nowrap;
926 background-color: #ebebeb;
927 background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0, #fafafa), color-stop(100%, #ddd));
928 background-image: -webkit-linear-gradient(top, #fafafa 0, #ddd 100%);
929 background-image: -moz-linear-gradient(top, #fafafa 0, #ddd 100%);
930 background-image: linear-gradient(to bottom, #fafafa 0, #ddd 100%);
931 color: #333;
932 width: auto;
933 max-width: 100%;
934 -webkit-box-sizing: border-box;
935 -moz-box-sizing: border-box;
936 box-sizing: border-box;
937 height: 1.7em;
938 margin: 0.1em;
939 border: 1px solid #ccc;
940 border-radius: 3px;
941 padding: 0 0.4em;
942 line-height: 1.7em;
943 vertical-align: middle;
944 }
945 .oo-ui-tagItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
946 display: inline-block;
947 max-width: 100%;
948 text-overflow: ellipsis;
949 overflow: hidden;
950 }
951 .oo-ui-tagItemWidget.oo-ui-labelElement:not( .oo-ui-tagItemWidget-fixed ) .oo-ui-labelElement-label {
952 cursor: text;
953 }
954 .oo-ui-tagItemWidget:focus {
955 border-color: #ace;
956 outline: 0;
957 box-shadow: 0 0 2px 2px #ace;
958 }
959 .oo-ui-tagItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
960 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
961 }
962 .oo-ui-tagItemWidget > .oo-ui-buttonElement {
963 margin-top: -1.25em;
964 padding-left: 0.3em;
965 }
966 .oo-ui-tagItemWidget > .oo-ui-buttonElement > .oo-ui-buttonElement-button {
967 padding: 0;
968 }
969 .oo-ui-tagItemWidget > .oo-ui-buttonElement > .oo-ui-buttonElement-button .oo-ui-iconElement-icon {
970 min-width: 14px;
971 width: 1.09375em;
972 margin-right: -0.3em;
973 }
974 .oo-ui-tagItemWidget > .oo-ui-buttonElement > .oo-ui-buttonElement-button .oo-ui-labelElement-label,
975 .oo-ui-tagItemWidget > .oo-ui-buttonElement > .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator {
976 display: none;
977 }
978 .oo-ui-tagItemWidget.oo-ui-widget-disabled {
979 opacity: 0.5;
980 -webkit-transform: translateZ(0);
981 transform: translateZ(0);
982 box-shadow: none;
983 color: #333;
984 background: #eee;
985 border-color: #ccc;
986 }
987
988 .oo-ui-searchWidget-query {
989 position: absolute;
990 top: 0;
991 left: 0;
992 right: 0;
993 }
994 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
995 width: 100%;
996 }
997 .oo-ui-searchWidget-results {
998 position: absolute;
999 bottom: 0;
1000 left: 0;
1001 right: 0;
1002 overflow-x: hidden;
1003 overflow-y: auto;
1004 -webkit-overflow-scrolling: touch;
1005 }
1006 .oo-ui-searchWidget-query {
1007 height: 4em;
1008 padding: 0 1em;
1009 box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2);
1010 }
1011 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1012 margin: 0.75em 0;
1013 }
1014 .oo-ui-searchWidget-results {
1015 top: 4em;
1016 padding: 1em;
1017 line-height: 0;
1018 }