Update OOjs UI to v0.1.0-pre (7b3672591f)
[mediawiki.git] / resources / lib / oojs-ui / oojs-ui.svg.css
blob68d73d9b783dc06a8357a75da79ee66aead8cdb6
1 /*!
2 * OOjs UI v0.1.0-pre (7b3672591f)
3 * https://www.mediawiki.org/wiki/OOjs_UI
5 * Copyright 2011–2014 OOjs Team and other contributors.
6 * Released under the MIT license
7 * http://oojs.mit-license.org
9 * Date: Fri May 09 2014 13:27:04 GMT+0200 (CEST)
12 /* Textures */
14 .oo-ui-texture-pending {
15 background-image: /* @embed */ url(images/textures/pending.gif);
18 .oo-ui-texture-transparency {
19 background-image: /* @embed */ url(images/textures/transparency.png);
22 /* RTL Definitions */
24 /* @noflip */
26 .oo-ui-rtl {
27 direction: rtl;
30 /* @noflip */
32 .oo-ui-ltr {
33 direction: ltr;
36 .oo-ui-dialog {
37 position: fixed;
38 top: 0;
39 right: 0;
40 bottom: 0;
41 left: 0;
42 padding: 1em;
43 line-height: 1em;
44 /* Fix for strange opacity-related rendering issues.
45 CAUTION: -webkit-backface-visibility: hidden; is EXTREMELY DANGEROUS.
46 If applied to a VE surface directly, it will break selection of
47 FocusableNodes, and in the past it's caused transparent PNGs to
48 render as opaque black images. For some reason applying it to the dialog
49 wrapper in the main document fixes opacity-related behavior in the iframe
50 document, but doesn't break the surface inside the iframe. */
52 -webkit-backface-visibility: hidden;
53 backface-visibility: hidden;
56 .oo-ui-dialog > .oo-ui-window-frame {
57 position: fixed;
58 right: 0;
59 left: 0;
60 min-height: 12em;
61 margin: auto;
62 overflow: hidden;
65 .oo-ui-dialog > .oo-ui-window-frame .oo-ui-frame {
66 width: 100%;
67 height: 100%;
70 .oo-ui-dialog-content .oo-ui-window-foot {
71 bottom: 0;
72 height: 4.8em;
73 padding: 1em;
76 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-framed {
77 float: left;
78 margin: 0.125em 0.25em;
81 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-flaggableElement-primary,
82 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-flaggableElement-constructive,
83 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-flaggableElement-destructive {
84 float: right;
87 .oo-ui-dialog-content-footless .oo-ui-window-foot {
88 display: none;
91 .oo-ui-frame {
92 padding: 0;
93 margin: 0;
96 .oo-ui-frame-body {
97 padding: 0;
98 margin: 0;
99 background: none;
102 .oo-ui-frame-content:focus {
103 outline: none;
106 .oo-ui-toolbar {
107 clear: both;
110 .oo-ui-toolbar-bar {
111 line-height: 1em;
114 .oo-ui-toolbar-bottom .oo-ui-toolbar-bar {
115 position: absolute;
118 .oo-ui-toolbar-actions {
119 float: right;
122 .oo-ui-toolbar-tools {
123 float: left;
126 .oo-ui-toolbar-tools,
127 .oo-ui-toolbar-actions,
128 .oo-ui-toolbar-shadow {
129 -webkit-user-select: none;
130 -moz-user-select: none;
131 -ms-user-select: none;
132 user-select: none;
133 -webkit-touch-callout: none;
136 .oo-ui-toolbar-actions .oo-ui-popupWidget {
137 -webkit-user-select: all;
138 -moz-user-select: all;
139 -ms-user-select: all;
140 user-select: all;
141 -webkit-touch-callout: default;
144 .oo-ui-toolbar-shadow {
145 position: absolute;
146 width: 100%;
147 pointer-events: none;
148 background-position: left top;
149 background-repeat: repeat-x;
152 .oo-ui-toolGroup {
153 display: inline-block;
154 margin: 0.3em;
155 vertical-align: middle;
158 .oo-ui-toolGroup-empty {
159 display: none;
162 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
163 background-position: center center;
164 background-repeat: no-repeat;
167 .oo-ui-window-head {
168 -webkit-user-select: none;
169 -moz-user-select: none;
170 -ms-user-select: none;
171 user-select: none;
172 -webkit-touch-callout: none;
175 .oo-ui-window-icon {
176 float: left;
177 background-position: center center;
178 background-repeat: no-repeat;
181 .oo-ui-window-title {
182 float: left;
183 white-space: nowrap;
184 cursor: default;
187 .oo-ui-window-overlay {
188 position: absolute;
189 top: 0;
190 left: 0;
193 .oo-ui-buttonedElement .oo-ui-buttonedElement-button {
194 display: inline-block;
195 vertical-align: middle;
196 cursor: pointer;
197 -webkit-user-select: none;
198 -moz-user-select: none;
199 -ms-user-select: none;
200 user-select: none;
201 -webkit-touch-callout: none;
204 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
205 display: none;
206 margin-left: 0;
209 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator {
210 display: none;
211 margin-right: -0.75em;
214 .oo-ui-buttonedElement.oo-ui-widget-disabled .oo-ui-buttonedElement-button {
215 cursor: default;
218 .oo-ui-buttonedElement.oo-ui-indicatedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
219 .oo-ui-buttonedElement.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
220 display: inline-block;
221 vertical-align: middle;
222 background-position: center center;
223 background-repeat: no-repeat;
226 .oo-ui-buttonedElement-frameless {
227 position: relative;
228 display: inline-block;
231 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
232 display: inline-block;
233 margin-left: 0.25em;
234 vertical-align: middle;
237 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
238 display: inline-block;
239 padding: 0.2em 0.8em;
240 margin: 0.1em 0;
241 text-align: center;
242 vertical-align: top;
245 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
246 display: inline-block;
247 line-height: 1.9em;
248 vertical-align: middle;
251 .oo-ui-buttonedElement-framed.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
252 margin-right: -0.5em;
253 margin-left: -0.5em;
256 .oo-ui-buttonedElement-framed.oo-ui-iconedElement.oo-ui-labeledElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
257 margin-right: 0.3em;
258 margin-left: -0.5em;
261 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button,
262 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
263 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
264 cursor: default;
267 .oo-ui-clippableElement-clippable {
268 -webkit-box-sizing: border-box;
269 -moz-box-sizing: border-box;
270 box-sizing: border-box;
273 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous .oo-ui-panelLayout-scrollable {
274 overflow-y: hidden;
277 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
278 width: 100%;
279 padding: 1.5em;
280 -webkit-box-sizing: border-box;
281 -moz-box-sizing: border-box;
282 box-sizing: border-box;
285 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-scrollable {
286 overflow-y: auto;
289 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-padded {
290 padding: 2em;
293 .oo-ui-bookletLayout-outlinePanel-editable .oo-ui-outlineWidget {
294 position: absolute;
295 top: 0;
296 right: 0;
297 bottom: 3em;
298 left: 0;
299 overflow-y: auto;
302 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
303 position: absolute;
304 right: 0;
305 bottom: 0;
306 left: 0;
309 .oo-ui-fieldLayout {
310 margin-bottom: 1em;
313 .oo-ui-fieldLayout:last-child {
314 margin-bottom: 0;
317 .oo-ui-fieldLayout:before,
318 .oo-ui-fieldLayout:after {
319 display: table;
320 content: " ";
323 .oo-ui-fieldLayout:after {
324 clear: both;
327 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-labeledElement-label,
328 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
329 display: block;
330 float: left;
331 width: 35%;
332 padding-top: 0.5em;
333 margin-right: 5%;
336 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-field,
337 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-field {
338 display: block;
339 float: left;
340 width: 60%;
343 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
344 text-align: right;
347 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-labeledElement-label {
348 display: inline-block;
349 padding: 0.75em 0.5em 0.5em 0.5em;
350 vertical-align: middle;
353 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-field {
354 display: inline-block;
355 padding: 0.5em 0;
356 vertical-align: middle;
359 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-labeledElement-label {
360 padding: 0.5em 0;
363 .oo-ui-fieldsetLayout {
364 position: relative;
365 padding: 0;
366 margin: 0;
369 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout {
370 margin-top: 2em;
373 .oo-ui-fieldsetLayout-labeled {
374 margin-top: -0.75em;
377 .oo-ui-fieldsetLayout > .oo-ui-labeledElement-label {
378 padding: 0.25em 0;
379 margin-bottom: 0.5em;
382 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-labeledElement-label {
383 padding-left: 1.75em;
384 line-height: 1.33em;
387 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-iconedElement-icon {
388 position: absolute;
389 top: 0.25em;
390 left: 0;
391 display: block;
392 width: 2em;
393 height: 2em;
394 background-position: center center;
395 background-repeat: no-repeat;
398 .oo-ui-gridLayout {
399 position: absolute;
400 top: 0;
401 right: 0;
402 bottom: 0;
403 left: 0;
406 .oo-ui-labelWidget {
407 padding: 0.5em 0;
410 .oo-ui-panelLayout-scrollable {
411 overflow-y: auto;
414 .oo-ui-stackLayout > .oo-ui-panelLayout {
415 display: none;
418 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
419 position: relative;
420 display: block;
423 .oo-ui-barToolGroup > .oo-ui-iconedElement-icon,
424 .oo-ui-barToolGroup > .oo-ui-labeledElement-label {
425 display: none;
428 .oo-ui-barToolGroup .oo-ui-tool {
429 position: relative;
430 display: inline-block;
431 vertical-align: top;
434 .oo-ui-barToolGroup .oo-ui-tool-link {
435 display: block;
436 height: 1.5em;
437 padding: 0.25em;
440 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
441 display: block;
442 width: 1.5em;
443 height: 1.5em;
446 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
447 display: none;
450 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
451 cursor: default;
454 .oo-ui-barToolGroup .oo-ui-tool-title,
455 .oo-ui-barToolGroup .oo-ui-tool-accel {
456 display: none;
459 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-link {
460 cursor: pointer;
463 .oo-ui-listToolGroup .oo-ui-toolGroup-tools {
464 padding: 0.25em;
467 .oo-ui-listToolGroup .oo-ui-tool {
468 display: inline-block;
469 width: 100%;
470 -webkit-box-sizing: border-box;
471 -moz-box-sizing: border-box;
472 box-sizing: border-box;
475 .oo-ui-listToolGroup .oo-ui-tool-link {
476 display: block;
477 padding-right: 0.5em;
478 white-space: nowrap;
479 cursor: pointer;
482 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
483 cursor: default;
486 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
487 min-width: 8em;
490 .oo-ui-menuToolGroup .oo-ui-tool {
491 display: block;
494 .oo-ui-menuToolGroup .oo-ui-tool-link {
495 display: block;
496 padding: 0.25em 1em 0.25em 0.25em;
497 white-space: nowrap;
498 cursor: pointer;
501 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
502 background-image: none;
505 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconedElement-icon {
506 background-image: /* @embed */ url(images/icons/check.png);
509 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
510 cursor: default;
513 .oo-ui-popupToolGroup {
514 position: relative;
515 height: 2em;
516 min-width: 2.5em;
519 .oo-ui-popupToolGroup.oo-ui-indicatedElement.oo-ui-iconedElement {
520 min-width: 3.5em;
523 .oo-ui-popupToolGroup-handle {
524 display: block;
525 cursor: pointer;
528 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
529 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
530 position: absolute;
531 top: 0;
532 width: 2em;
533 height: 2em;
534 background-position: center center;
535 background-repeat: no-repeat;
538 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator {
539 right: 0;
542 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
543 left: 0.25em;
546 .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
547 margin: 0 1em;
548 font-size: 0.8em;
549 line-height: 2.6em;
552 .oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle {
553 cursor: default;
556 .oo-ui-popupToolGroup.oo-ui-iconedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
557 margin-left: 3em;
560 .oo-ui-popupToolGroup.oo-ui-indicatedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
561 margin-right: 2.25em;
564 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
565 position: absolute;
566 top: 2em;
567 left: -1px;
568 z-index: 4;
569 display: none;
572 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools .oo-ui-iconedElement-icon {
573 background-position: center center;
574 background-repeat: no-repeat;
577 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools {
578 display: block;
581 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
582 display: inline-block;
583 width: 2em;
584 height: 2em;
585 margin-right: 0.25em;
586 vertical-align: middle;
589 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
590 display: inline-block;
591 font-size: 0.8em;
592 line-height: 2em;
593 vertical-align: middle;
596 .oo-ui-popupToolGroup .oo-ui-tool-accel {
597 display: none;
600 .oo-ui-popupTool .oo-ui-popupWidget {
601 margin-left: 1.25em;
602 font-size: 0.8em;
605 .oo-ui-popupTool .oo-ui-popupWidget-popup,
606 .oo-ui-popupTool .oo-ui-popupWidget-tail {
607 z-index: 4;
610 .oo-ui-iconWidget {
611 display: inline-block;
612 width: 1.9em;
613 height: 1.9em;
614 line-height: 2.5em;
615 vertical-align: middle;
616 background-position: center center;
617 background-repeat: no-repeat;
618 opacity: 0.8;
621 .oo-ui-iconWidget.oo-ui-widget-disabled {
622 opacity: 0.2;
625 .oo-ui-indicatorWidget {
626 display: inline-block;
627 width: 1.9em;
628 height: 1.9em;
629 line-height: 2.5em;
630 vertical-align: middle;
631 background-position: center center;
632 background-repeat: no-repeat;
633 opacity: 0.8;
636 .oo-ui-indicatorWidget.oo-ui-widget-disabled {
637 opacity: 0.2;
640 .oo-ui-selectWidget {
641 padding: 0;
642 margin: 0;
643 list-style: none;
646 .oo-ui-optionWidget {
647 position: relative;
648 display: block;
649 margin: 0;
650 list-style: none;
651 cursor: pointer;
652 border: none;
655 .oo-ui-optionWidget.oo-ui-widget-disabled {
656 cursor: default;
659 .oo-ui-optionWidget .oo-ui-labeledElement-label {
660 display: block;
661 overflow: hidden;
662 line-height: 1.5em;
663 text-overflow: ellipsis;
664 white-space: nowrap;
667 .oo-ui-optionWidget .oo-ui-iconedElement-icon,
668 .oo-ui-optionWidget .oo-ui-indicatedElement-indicator {
669 position: absolute;
670 top: 50%;
671 width: 2em;
672 height: 2em;
673 margin-top: -1em;
674 background-position: center center;
675 background-repeat: no-repeat;
678 .oo-ui-optionWidget .oo-ui-iconedElement-icon {
679 left: 0.5em;
682 .oo-ui-optionWidget .oo-ui-indicatedElement-indicator {
683 right: 0.5em;
686 .oo-ui-menuWidget {
687 position: absolute;
690 .oo-ui-menuWidget input {
691 position: absolute;
692 width: 0;
693 height: 0;
694 overflow: hidden;
695 opacity: 0;
698 .oo-ui-popupWidget-popup {
699 position: absolute;
700 overflow: hidden;
703 .oo-ui-popupWidget-tail {
704 display: none;
707 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-popup {
708 margin-top: 7px;
711 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-tail {
712 position: absolute;
713 display: block;
714 background-repeat: no-repeat;
717 .oo-ui-popupWidget-head {
718 height: 2.5em;
719 -webkit-user-select: none;
720 -moz-user-select: none;
721 -ms-user-select: none;
722 user-select: none;
723 -webkit-touch-callout: none;
726 .oo-ui-popupWidget-head .oo-ui-buttonWidget {
727 float: right;
728 margin: 0.25em;
731 .oo-ui-popupWidget-head .oo-ui-labeledElement-label {
732 float: left;
733 margin: 0.75em 1em;
734 cursor: default;
737 .oo-ui-popupWidget-body {
738 clear: both;
741 .oo-ui-buttonGroupWidget {
742 border-radius: 0.3em;
745 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
746 margin-bottom: -1px;
747 margin-left: -1px;
748 border-radius: 0;
751 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:first-child .oo-ui-buttonedElement-button {
752 margin-left: 0;
753 border-bottom-left-radius: 0.3em;
754 border-top-left-radius: 0.3em;
757 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:last-child .oo-ui-buttonedElement-button {
758 border-top-right-radius: 0.3em;
759 border-bottom-right-radius: 0.3em;
762 .oo-ui-buttonOptionWidget {
763 display: inline-block;
764 background-color: transparent;
767 .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
768 position: relative;
769 height: 1.9em;
772 .oo-ui-buttonOptionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon,
773 .oo-ui-buttonOptionWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
774 position: static;
775 display: inline-block;
776 height: 1.9em;
777 margin-top: 0;
778 vertical-align: middle;
781 .oo-ui-buttonSelectWidget {
782 display: inline-block;
783 white-space: nowrap;
786 .oo-ui-buttonWidget {
787 display: inline-block;
788 vertical-align: middle;
791 .oo-ui-inlineMenuWidget {
792 position: relative;
793 display: inline-block;
794 min-width: 20em;
795 margin: 0.25em 0;
798 .oo-ui-inlineMenuWidget-handle {
799 display: inline-block;
800 width: 100%;
801 height: 2.5em;
802 cursor: pointer;
803 -webkit-box-sizing: border-box;
804 -moz-box-sizing: border-box;
805 box-sizing: border-box;
806 -webkit-user-select: none;
807 -moz-user-select: none;
808 -ms-user-select: none;
809 user-select: none;
810 -webkit-touch-callout: none;
813 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
814 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
815 position: absolute;
816 top: 0;
817 width: 2.5em;
818 height: 2.5em;
819 background-position: center center;
820 background-repeat: no-repeat;
823 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator {
824 right: 0;
827 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
828 left: 0.25em;
831 .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
832 margin: 0 0.5em;
833 line-height: 2.5em;
836 .oo-ui-inlineMenuWidget.oo-ui-iconedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
837 margin-left: 3em;
840 .oo-ui-inlineMenuWidget.oo-ui-indicatedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
841 margin-right: 2em;
844 .oo-ui-inlineMenuWidget .oo-ui-menuWidget {
845 z-index: 1;
846 width: 100%;
849 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
850 cursor: default;
853 .oo-ui-menuItemWidget {
854 position: relative;
857 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
858 display: none;
861 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
862 background-color: transparent;
865 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconedElement-icon {
866 display: block;
869 .oo-ui-menuSectionItemWidget {
870 cursor: default;
873 .oo-ui-outlineControlsWidget {
874 height: 3em;
877 .oo-ui-outlineControlsWidget-adders,
878 .oo-ui-outlineControlsWidget-movers {
879 float: left;
880 height: 2em;
881 padding: 0;
882 margin: 0.5em;
883 -webkit-box-sizing: border-box;
884 -moz-box-sizing: border-box;
885 box-sizing: border-box;
888 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
889 float: left;
890 width: 1.5em;
891 height: 2em;
892 margin: 0.5em 0 0.5em 0.5em;
893 background-position: right center;
894 background-repeat: no-repeat;
897 .oo-ui-outlineControlsWidget-adders {
898 float: left;
899 margin-left: 0;
902 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget {
903 float: left;
906 .oo-ui-outlineControlsWidget-movers {
907 float: right;
910 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
911 float: right;
914 .oo-ui-outlineItemWidget {
915 position: relative;
916 padding: 0.75em;
917 cursor: pointer;
918 -webkit-user-select: none;
919 -moz-user-select: none;
920 -ms-user-select: none;
921 user-select: none;
922 -webkit-touch-callout: none;
925 .oo-ui-popupButtonWidget {
926 position: relative;
929 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
930 position: absolute;
931 left: 1em;
932 cursor: auto;
935 .oo-ui-searchWidget-query {
936 position: absolute;
937 top: 0;
938 right: 0;
939 left: 0;
940 height: 4em;
941 padding: 0 1em;
944 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
945 width: 100%;
946 margin: 0.75em 0;
949 .oo-ui-searchWidget-results {
950 position: absolute;
951 top: 4em;
952 right: 0;
953 bottom: 0;
954 left: 0;
955 padding: 1em;
956 overflow-x: hidden;
957 overflow-y: auto;
958 line-height: 0;
961 .oo-ui-textInputWidget {
962 position: relative;
963 -webkit-box-sizing: border-box;
964 -moz-box-sizing: border-box;
965 box-sizing: border-box;
968 .oo-ui-textInputWidget input,
969 .oo-ui-textInputWidget textarea {
970 display: inline-block;
971 width: 100%;
972 -webkit-box-sizing: border-box;
973 -moz-box-sizing: border-box;
974 box-sizing: border-box;
975 resize: none;
978 .oo-ui-textInputWidget-icon {
979 position: absolute;
980 top: 0;
981 left: 0;
982 height: 100%;
983 background-position: right center;
984 background-repeat: no-repeat;
987 .oo-ui-toggleSwitchWidget {
988 position: relative;
989 display: inline-block;
990 width: 4em;
991 height: 2em;
992 overflow: hidden;
993 vertical-align: middle;
994 cursor: pointer;
995 -webkit-transform: translateZ(0);
996 -moz-transform: translateZ(0);
997 -ms-transform: translateZ(0);
998 -o-transform: translateZ(0);
999 transform: translateZ(0);
1000 -webkit-box-sizing: border-box;
1001 -moz-box-sizing: border-box;
1002 box-sizing: border-box;
1005 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1006 cursor: default;
1009 .oo-ui-toggleSwitchWidget-grip {
1010 position: absolute;
1011 top: 0.25em;
1012 left: 0.25em;
1013 display: block;
1014 width: 1.5em;
1015 height: 1.5em;
1016 -webkit-box-sizing: border-box;
1017 -moz-box-sizing: border-box;
1018 box-sizing: border-box;
1019 -webkit-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1020 -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1021 -ms-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1022 -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1023 transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1026 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1027 position: absolute;
1028 top: 0;
1029 right: 0;
1030 bottom: 0;
1031 left: 0;
1032 -webkit-transition: opacity 200ms ease-in-out;
1033 -moz-transition: opacity 200ms ease-in-out;
1034 -ms-transition: opacity 200ms ease-in-out;
1035 -o-transition: opacity 200ms ease-in-out;
1036 transition: opacity 200ms ease-in-out;
1037 -webkit-user-select: none;
1038 -moz-user-select: none;
1039 -ms-user-select: none;
1040 user-select: none;
1041 -webkit-touch-callout: none;
1044 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
1045 left: 2.25em;
1046 margin-left: -2px;
1049 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
1050 left: 0.25em;
1051 margin-left: 0;
1054 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1055 display: none;
1058 /* Icons */
1060 .oo-ui-icon-add-item {
1061 background-image: /* @embed */ url(images/icons/add-item.svg);
1064 .oo-ui-icon-advanced {
1065 background-image: /* @embed */ url(images/icons/advanced.svg);
1068 .oo-ui-icon-alert {
1069 background-image: /* @embed */ url(images/icons/alert.svg);
1072 .oo-ui-icon-check {
1073 background-image: /* @embed */ url(images/icons/check.svg);
1076 .oo-ui-icon-clear {
1077 background-image: /* @embed */ url(images/icons/clear.svg);
1080 .oo-ui-icon-close {
1081 background-image: /* @embed */ url(images/icons/close.svg);
1084 .oo-ui-icon-code {
1085 background-image: /* @embed */ url(images/icons/code.svg);
1088 .oo-ui-icon-collapse {
1089 background-image: /* @embed */ url(images/icons/collapse.svg);
1092 .oo-ui-icon-comment {
1093 background-image: /* @embed */ url(images/icons/comment.svg);
1096 .oo-ui-icon-expand {
1097 background-image: /* @embed */ url(images/icons/expand.svg);
1100 .oo-ui-icon-help {
1101 background-image: /* @embed */ url(images/icons/help.svg);
1104 .oo-ui-icon-info {
1105 background-image: /* @embed */ url(images/icons/info.svg);
1108 .oo-ui-icon-link {
1109 background-image: /* @embed */ url(images/icons/link.svg);
1112 .oo-ui-icon-menu {
1113 background-image: /* @embed */ url(images/icons/menu.svg);
1116 .oo-ui-icon-next {
1117 background-image: /* @embed */ url(images/icons/move-ltr.svg);
1120 .oo-ui-icon-picture {
1121 background-image: /* @embed */ url(images/icons/picture.svg);
1124 .oo-ui-icon-previous {
1125 background-image: /* @embed */ url(images/icons/move-rtl.svg);
1128 .oo-ui-icon-redo {
1129 background-image: /* @embed */ url(images/icons/arched-arrow-ltr.svg);
1132 .oo-ui-icon-remove {
1133 background-image: /* @embed */ url(images/icons/remove.svg);
1136 .oo-ui-icon-search {
1137 background-image: /* @embed */ url(images/icons/search.svg);
1140 .oo-ui-icon-settings {
1141 background-image: /* @embed */ url(images/icons/settings.svg);
1144 .oo-ui-icon-tag {
1145 background-image: /* @embed */ url(images/icons/tag.svg);
1148 .oo-ui-icon-undo {
1149 background-image: /* @embed */ url(images/icons/arched-arrow-rtl.svg);
1152 .oo-ui-icon-window {
1153 background-image: /* @embed */ url(images/icons/window.svg);
1156 /* Indicators */
1158 .oo-ui-indicator-alert {
1159 background-image: /* @embed */ url(images/indicators/alert.svg);
1162 .oo-ui-indicator-down {
1163 background-image: /* @embed */ url(images/indicators/down.svg);
1166 .oo-ui-indicator-required {
1167 background-image: /* @embed */ url(images/indicators/required.svg);
1170 .oo-ui-indicator-up {
1171 background-image: /* @embed */ url(images/indicators/up.svg);