resources/lib/oojs-ui/oojs-ui.css

   1 /*!
   2  * OOjs UI v0.1.0
   3  * https://www.mediawiki.org/wiki/OOjs_UI
   4  *
   5  * Copyright 2011–2014 OOjs Team and other contributors.
   6  * Released under the MIT license
   7  * http://oojs.mit-license.org
   8  *
   9  * Date: Fri May 30 2014 12:12:37 GMT-0700 (PDT)
  10  */
  11
  12 /* Textures */
  13
  14 .oo-ui-texture-pending {
  15   background-image: /* @embed */ url(images/textures/pending.gif);
  16 }
  17
  18 .oo-ui-texture-transparency {
  19   background-image: /* @embed */ url(images/textures/transparency.png);
  20 }
  21
  22 /* RTL Definitions */
  23
  24 /* @noflip */
  25
  26 .oo-ui-rtl {
  27   direction: rtl;
  28 }
  29
  30 /* @noflip */
  31
  32 .oo-ui-ltr {
  33   direction: ltr;
  34 }
  35
  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. */
  51
  52   -webkit-backface-visibility: hidden;
  53           backface-visibility: hidden;
  54 }
  55
  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;
  63 }
  64
  65 .oo-ui-dialog > .oo-ui-window-frame .oo-ui-frame {
  66   width: 100%;
  67   height: 100%;
  68 }
  69
  70 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-framed {
  71   float: left;
  72 }
  73
  74 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-flaggableElement-primary,
  75 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-flaggableElement-constructive,
  76 .oo-ui-dialog-content .oo-ui-window-foot .oo-ui-flaggableElement-destructive {
  77   float: right;
  78 }
  79
  80 .oo-ui-dialog-content-footless .oo-ui-window-foot {
  81   display: none;
  82 }
  83
  84 .oo-ui-frame {
  85   padding: 0;
  86   margin: 0;
  87 }
  88
  89 .oo-ui-frame-body {
  90   padding: 0;
  91   margin: 0;
  92   background: none;
  93 }
  94
  95 .oo-ui-frame-content:focus {
  96   outline: none;
  97 }
  98
  99 .oo-ui-toolbar {
 100   clear: both;
 101 }
 102
 103 .oo-ui-toolbar-bar {
 104   line-height: 1em;
 105 }
 106
 107 .oo-ui-toolbar-bottom .oo-ui-toolbar-bar {
 108   position: absolute;
 109 }
 110
 111 .oo-ui-toolbar-actions {
 112   float: right;
 113 }
 114
 115 .oo-ui-toolbar-tools {
 116   float: left;
 117 }
 118
 119 .oo-ui-toolbar-tools,
 120 .oo-ui-toolbar-actions,
 121 .oo-ui-toolbar-shadow {
 122   -webkit-user-select: none;
 123      -moz-user-select: none;
 124       -ms-user-select: none;
 125           user-select: none;
 126   -webkit-touch-callout: none;
 127 }
 128
 129 .oo-ui-toolbar-actions .oo-ui-popupWidget {
 130   -webkit-user-select: all;
 131      -moz-user-select: all;
 132       -ms-user-select: all;
 133           user-select: all;
 134   -webkit-touch-callout: default;
 135 }
 136
 137 .oo-ui-toolbar-shadow {
 138   position: absolute;
 139   width: 100%;
 140   pointer-events: none;
 141   background-position: left top;
 142   background-repeat: repeat-x;
 143 }
 144
 145 .oo-ui-toolGroup {
 146   display: inline-block;
 147   margin: 0.3em;
 148   vertical-align: middle;
 149 }
 150
 151 .oo-ui-toolGroup-empty {
 152   display: none;
 153 }
 154
 155 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 156   background-position: center center;
 157   background-repeat: no-repeat;
 158 }
 159
 160 .oo-ui-window-head {
 161   -webkit-user-select: none;
 162      -moz-user-select: none;
 163       -ms-user-select: none;
 164           user-select: none;
 165   -webkit-touch-callout: none;
 166 }
 167
 168 .oo-ui-window-icon {
 169   float: left;
 170   background-position: center center;
 171   background-repeat: no-repeat;
 172 }
 173
 174 .oo-ui-window-title {
 175   float: left;
 176   white-space: nowrap;
 177   cursor: default;
 178 }
 179
 180 .oo-ui-window-overlay {
 181   position: absolute;
 182   top: 0;
 183   left: 0;
 184 }
 185
 186 .oo-ui-buttonedElement .oo-ui-buttonedElement-button {
 187   display: inline-block;
 188   vertical-align: middle;
 189   cursor: pointer;
 190   -webkit-user-select: none;
 191      -moz-user-select: none;
 192       -ms-user-select: none;
 193           user-select: none;
 194   -webkit-touch-callout: none;
 195 }
 196
 197 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 198   display: none;
 199   margin-left: 0;
 200 }
 201
 202 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator {
 203   display: none;
 204   margin-right: -0.75em;
 205 }
 206
 207 .oo-ui-buttonedElement.oo-ui-widget-disabled .oo-ui-buttonedElement-button {
 208   cursor: default;
 209 }
 210
 211 .oo-ui-buttonedElement.oo-ui-indicatedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 212 .oo-ui-buttonedElement.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 213   display: inline-block;
 214   vertical-align: middle;
 215   background-position: center center;
 216   background-repeat: no-repeat;
 217 }
 218
 219 .oo-ui-buttonedElement-frameless {
 220   position: relative;
 221   display: inline-block;
 222 }
 223
 224 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 225   display: inline-block;
 226   margin-left: 0.25em;
 227   vertical-align: middle;
 228 }
 229
 230 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 231   display: inline-block;
 232   text-align: center;
 233   vertical-align: top;
 234 }
 235
 236 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 237   display: inline-block;
 238   line-height: 1.9em;
 239   vertical-align: middle;
 240 }
 241
 242 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button,
 243 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 244 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 245   cursor: default;
 246 }
 247
 248 .oo-ui-clippableElement-clippable {
 249   -webkit-box-sizing: border-box;
 250      -moz-box-sizing: border-box;
 251           box-sizing: border-box;
 252 }
 253
 254 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous .oo-ui-panelLayout-scrollable {
 255   overflow-y: hidden;
 256 }
 257
 258 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
 259   width: 100%;
 260   -webkit-box-sizing: border-box;
 261      -moz-box-sizing: border-box;
 262           box-sizing: border-box;
 263 }
 264
 265 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-scrollable {
 266   overflow-y: auto;
 267 }
 268
 269 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-padded {
 270   padding: 2em;
 271 }
 272
 273 .oo-ui-bookletLayout-outlinePanel-editable .oo-ui-outlineWidget {
 274   position: absolute;
 275   top: 0;
 276   right: 0;
 277   bottom: 3em;
 278   left: 0;
 279   overflow-y: auto;
 280 }
 281
 282 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
 283   position: absolute;
 284   right: 0;
 285   bottom: 0;
 286   left: 0;
 287 }
 288
 289 .oo-ui-fieldLayout {
 290   margin-bottom: 1em;
 291 }
 292
 293 .oo-ui-fieldLayout:last-child {
 294   margin-bottom: 0;
 295 }
 296
 297 .oo-ui-fieldLayout:before,
 298 .oo-ui-fieldLayout:after {
 299   display: table;
 300   content: " ";
 301 }
 302
 303 .oo-ui-fieldLayout:after {
 304   clear: both;
 305 }
 306
 307 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-labeledElement-label,
 308 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
 309   display: block;
 310   float: left;
 311   width: 35%;
 312   padding-top: 0.5em;
 313   margin-right: 5%;
 314 }
 315
 316 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-field,
 317 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-field {
 318   display: block;
 319   float: left;
 320   width: 60%;
 321 }
 322
 323 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
 324   text-align: right;
 325 }
 326
 327 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-labeledElement-label {
 328   display: inline-block;
 329   padding: 0.75em 0.5em 0.5em 0.5em;
 330   vertical-align: middle;
 331 }
 332
 333 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-field {
 334   display: inline-block;
 335   padding: 0.5em 0;
 336   vertical-align: middle;
 337 }
 338
 339 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-labeledElement-label {
 340   padding: 0.5em 0;
 341 }
 342
 343 .oo-ui-fieldsetLayout {
 344   position: relative;
 345   padding: 0;
 346   margin: 0;
 347 }
 348
 349 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout {
 350   margin-top: 2em;
 351 }
 352
 353 .oo-ui-fieldsetLayout-labeled {
 354   margin-top: -0.75em;
 355 }
 356
 357 .oo-ui-fieldsetLayout > .oo-ui-labeledElement-label {
 358   padding: 0.25em 0;
 359   margin-bottom: 0.5em;
 360 }
 361
 362 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-labeledElement-label {
 363   padding-left: 1.75em;
 364   line-height: 1.33em;
 365 }
 366
 367 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-iconedElement-icon {
 368   position: absolute;
 369   top: 0.25em;
 370   left: 0;
 371   display: block;
 372   width: 2em;
 373   height: 2em;
 374   background-position: center center;
 375   background-repeat: no-repeat;
 376 }
 377
 378 .oo-ui-gridLayout {
 379   position: absolute;
 380   top: 0;
 381   right: 0;
 382   bottom: 0;
 383   left: 0;
 384 }
 385
 386 .oo-ui-labelWidget {
 387   padding: 0.5em 0;
 388 }
 389
 390 .oo-ui-panelLayout-scrollable {
 391   overflow-y: auto;
 392 }
 393
 394 .oo-ui-stackLayout > .oo-ui-panelLayout {
 395   display: none;
 396 }
 397
 398 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
 399   position: relative;
 400   display: block;
 401 }
 402
 403 .oo-ui-barToolGroup > .oo-ui-iconedElement-icon,
 404 .oo-ui-barToolGroup > .oo-ui-labeledElement-label {
 405   display: none;
 406 }
 407
 408 .oo-ui-barToolGroup .oo-ui-tool {
 409   position: relative;
 410   display: inline-block;
 411   vertical-align: top;
 412 }
 413
 414 .oo-ui-barToolGroup .oo-ui-tool-link {
 415   display: block;
 416   height: 1.5em;
 417   padding: 0.25em;
 418 }
 419
 420 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 421   display: block;
 422   width: 1.5em;
 423   height: 1.5em;
 424 }
 425
 426 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 427   display: none;
 428 }
 429
 430 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 431   cursor: default;
 432 }
 433
 434 .oo-ui-barToolGroup .oo-ui-tool-title,
 435 .oo-ui-barToolGroup .oo-ui-tool-accel {
 436   display: none;
 437 }
 438
 439 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-link {
 440   cursor: pointer;
 441 }
 442
 443 .oo-ui-listToolGroup .oo-ui-toolGroup-tools {
 444   padding: 0.25em;
 445 }
 446
 447 .oo-ui-listToolGroup .oo-ui-tool {
 448   display: inline-block;
 449   width: 100%;
 450   -webkit-box-sizing: border-box;
 451      -moz-box-sizing: border-box;
 452           box-sizing: border-box;
 453 }
 454
 455 .oo-ui-listToolGroup .oo-ui-tool-link {
 456   display: block;
 457   padding-right: 0.5em;
 458   white-space: nowrap;
 459   cursor: pointer;
 460 }
 461
 462 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 463   cursor: default;
 464 }
 465
 466 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 467   min-width: 8em;
 468 }
 469
 470 .oo-ui-menuToolGroup .oo-ui-tool {
 471   display: block;
 472 }
 473
 474 .oo-ui-menuToolGroup .oo-ui-tool-link {
 475   display: block;
 476   padding: 0.25em 1em 0.25em 0.25em;
 477   white-space: nowrap;
 478   cursor: pointer;
 479 }
 480
 481 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 482   background-image: none;
 483 }
 484
 485 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconedElement-icon {
 486   background-image: /* @embed */ url(images/icons/check.png);
 487 }
 488
 489 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 490   cursor: default;
 491 }
 492
 493 .oo-ui-popupToolGroup {
 494   position: relative;
 495   height: 2em;
 496   min-width: 2.5em;
 497 }
 498
 499 .oo-ui-popupToolGroup.oo-ui-indicatedElement.oo-ui-iconedElement {
 500   min-width: 3.5em;
 501 }
 502
 503 .oo-ui-popupToolGroup-handle {
 504   display: block;
 505   cursor: pointer;
 506 }
 507
 508 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
 509 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 510   position: absolute;
 511   top: 0;
 512   width: 2em;
 513   height: 2em;
 514   background-position: center center;
 515   background-repeat: no-repeat;
 516 }
 517
 518 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator {
 519   right: 0;
 520 }
 521
 522 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 523   left: 0.25em;
 524 }
 525
 526 .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 527   margin: 0 1em;
 528   font-size: 0.8em;
 529   line-height: 2.6em;
 530 }
 531
 532 .oo-ui-popupToolGroup-header {
 533   margin: 0 0.6em;
 534   font-size: 0.8em;
 535   font-weight: bold;
 536   line-height: 2.6em;
 537 }
 538
 539 .oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle {
 540   cursor: default;
 541 }
 542
 543 .oo-ui-popupToolGroup.oo-ui-iconedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 544   margin-left: 3em;
 545 }
 546
 547 .oo-ui-popupToolGroup.oo-ui-indicatedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 548   margin-right: 2.25em;
 549 }
 550
 551 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
 552   position: absolute;
 553   top: 2em;
 554   left: -1px;
 555   z-index: 4;
 556   display: none;
 557 }
 558
 559 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools .oo-ui-iconedElement-icon {
 560   background-position: center center;
 561   background-repeat: no-repeat;
 562 }
 563
 564 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools {
 565   display: block;
 566 }
 567
 568 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 569   display: inline-block;
 570   width: 2em;
 571   height: 2em;
 572   margin-right: 0.25em;
 573   vertical-align: middle;
 574 }
 575
 576 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 577   display: inline-block;
 578   font-size: 0.8em;
 579   line-height: 2em;
 580   vertical-align: middle;
 581 }
 582
 583 .oo-ui-popupToolGroup .oo-ui-tool-accel {
 584   display: none;
 585 }
 586
 587 .oo-ui-popupTool .oo-ui-popupWidget {
 588   margin-left: 1.25em;
 589   font-size: 0.8em;
 590 }
 591
 592 .oo-ui-popupTool .oo-ui-popupWidget-popup,
 593 .oo-ui-popupTool .oo-ui-popupWidget-tail {
 594   z-index: 4;
 595 }
 596
 597 .oo-ui-iconWidget {
 598   display: inline-block;
 599   width: 1.9em;
 600   height: 1.9em;
 601   line-height: 2.5em;
 602   vertical-align: middle;
 603   background-position: center center;
 604   background-repeat: no-repeat;
 605   opacity: 0.8;
 606 }
 607
 608 .oo-ui-iconWidget.oo-ui-widget-disabled {
 609   opacity: 0.2;
 610 }
 611
 612 .oo-ui-indicatorWidget {
 613   display: inline-block;
 614   width: 1.9em;
 615   height: 1.9em;
 616   line-height: 2.5em;
 617   vertical-align: middle;
 618   background-position: center center;
 619   background-repeat: no-repeat;
 620   opacity: 0.8;
 621 }
 622
 623 .oo-ui-indicatorWidget.oo-ui-widget-disabled {
 624   opacity: 0.2;
 625 }
 626
 627 .oo-ui-selectWidget {
 628   padding: 0;
 629   margin: 0;
 630   list-style: none;
 631 }
 632
 633 .oo-ui-optionWidget {
 634   position: relative;
 635   display: block;
 636   margin: 0;
 637   list-style: none;
 638   cursor: pointer;
 639   border: none;
 640 }
 641
 642 .oo-ui-optionWidget.oo-ui-widget-disabled {
 643   cursor: default;
 644 }
 645
 646 .oo-ui-optionWidget .oo-ui-labeledElement-label {
 647   display: block;
 648   overflow: hidden;
 649   line-height: 1.5em;
 650   text-overflow: ellipsis;
 651   white-space: nowrap;
 652 }
 653
 654 .oo-ui-optionWidget .oo-ui-iconedElement-icon,
 655 .oo-ui-optionWidget .oo-ui-indicatedElement-indicator {
 656   position: absolute;
 657   top: 50%;
 658   width: 2em;
 659   height: 2em;
 660   margin-top: -1em;
 661   background-position: center center;
 662   background-repeat: no-repeat;
 663 }
 664
 665 .oo-ui-optionWidget .oo-ui-iconedElement-icon {
 666   left: 0.5em;
 667 }
 668
 669 .oo-ui-optionWidget .oo-ui-indicatedElement-indicator {
 670   right: 0.5em;
 671 }
 672
 673 .oo-ui-menuWidget {
 674   position: absolute;
 675 }
 676
 677 .oo-ui-menuWidget input {
 678   position: absolute;
 679   width: 0;
 680   height: 0;
 681   overflow: hidden;
 682   opacity: 0;
 683 }
 684
 685 .oo-ui-popupWidget-popup {
 686   position: absolute;
 687   overflow: hidden;
 688 }
 689
 690 .oo-ui-popupWidget-tail {
 691   display: none;
 692 }
 693
 694 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-popup {
 695   margin-top: 7px;
 696 }
 697
 698 .oo-ui-popupWidget-tailed .oo-ui-popupWidget-tail {
 699   position: absolute;
 700   display: block;
 701   background-repeat: no-repeat;
 702 }
 703
 704 .oo-ui-popupWidget-head {
 705   height: 2.5em;
 706   -webkit-user-select: none;
 707      -moz-user-select: none;
 708       -ms-user-select: none;
 709           user-select: none;
 710   -webkit-touch-callout: none;
 711 }
 712
 713 .oo-ui-popupWidget-head .oo-ui-buttonWidget {
 714   float: right;
 715   margin: 0.25em;
 716 }
 717
 718 .oo-ui-popupWidget-head .oo-ui-labeledElement-label {
 719   float: left;
 720   margin: 0.75em 1em;
 721   cursor: default;
 722 }
 723
 724 .oo-ui-popupWidget-body {
 725   clear: both;
 726 }
 727
 728 .oo-ui-buttonGroupWidget {
 729   border-radius: 0.3em;
 730 }
 731
 732 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 733   margin-bottom: -1px;
 734   margin-left: -1px;
 735   border-radius: 0;
 736 }
 737
 738 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:first-child .oo-ui-buttonedElement-button {
 739   margin-left: 0;
 740   border-bottom-left-radius: 0.3em;
 741   border-top-left-radius: 0.3em;
 742 }
 743
 744 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:last-child .oo-ui-buttonedElement-button {
 745   border-top-right-radius: 0.3em;
 746   border-bottom-right-radius: 0.3em;
 747 }
 748
 749 .oo-ui-buttonOptionWidget {
 750   display: inline-block;
 751   background-color: transparent;
 752 }
 753
 754 .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
 755   position: relative;
 756   height: 1.9em;
 757 }
 758
 759 .oo-ui-buttonOptionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon,
 760 .oo-ui-buttonOptionWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
 761   position: static;
 762   display: inline-block;
 763   height: 1.9em;
 764   margin-top: 0;
 765   vertical-align: middle;
 766 }
 767
 768 .oo-ui-buttonSelectWidget {
 769   display: inline-block;
 770   white-space: nowrap;
 771 }
 772
 773 .oo-ui-buttonWidget {
 774   display: inline-block;
 775   vertical-align: middle;
 776 }
 777
 778 .oo-ui-inlineMenuWidget {
 779   position: relative;
 780   display: inline-block;
 781   min-width: 20em;
 782   margin: 0.25em 0;
 783 }
 784
 785 .oo-ui-inlineMenuWidget-handle {
 786   display: inline-block;
 787   width: 100%;
 788   height: 2.5em;
 789   cursor: pointer;
 790   -webkit-box-sizing: border-box;
 791      -moz-box-sizing: border-box;
 792           box-sizing: border-box;
 793   -webkit-user-select: none;
 794      -moz-user-select: none;
 795       -ms-user-select: none;
 796           user-select: none;
 797   -webkit-touch-callout: none;
 798 }
 799
 800 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 801 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 802   position: absolute;
 803   top: 0;
 804   width: 2.5em;
 805   height: 2.5em;
 806   background-position: center center;
 807   background-repeat: no-repeat;
 808 }
 809
 810 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator {
 811   right: 0;
 812 }
 813
 814 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 815   left: 0.25em;
 816 }
 817
 818 .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 819   margin: 0 0.5em;
 820   line-height: 2.5em;
 821 }
 822
 823 .oo-ui-inlineMenuWidget.oo-ui-iconedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 824   margin-left: 3em;
 825 }
 826
 827 .oo-ui-inlineMenuWidget.oo-ui-indicatedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 828   margin-right: 2em;
 829 }
 830
 831 .oo-ui-inlineMenuWidget .oo-ui-menuWidget {
 832   z-index: 1;
 833   width: 100%;
 834 }
 835
 836 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
 837   cursor: default;
 838 }
 839
 840 .oo-ui-menuItemWidget {
 841   position: relative;
 842 }
 843
 844 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
 845   display: none;
 846 }
 847
 848 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
 849   background-color: transparent;
 850 }
 851
 852 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconedElement-icon {
 853   display: block;
 854 }
 855
 856 .oo-ui-menuSectionItemWidget {
 857   cursor: default;
 858 }
 859
 860 .oo-ui-outlineControlsWidget {
 861   height: 3em;
 862 }
 863
 864 .oo-ui-outlineControlsWidget-adders,
 865 .oo-ui-outlineControlsWidget-movers {
 866   float: left;
 867   height: 2em;
 868   padding: 0;
 869   margin: 0.5em;
 870   -webkit-box-sizing: border-box;
 871      -moz-box-sizing: border-box;
 872           box-sizing: border-box;
 873 }
 874
 875 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
 876   float: left;
 877   width: 1.5em;
 878   height: 2em;
 879   margin: 0.5em 0 0.5em 0.5em;
 880   background-position: right center;
 881   background-repeat: no-repeat;
 882 }
 883
 884 .oo-ui-outlineControlsWidget-adders {
 885   float: left;
 886   margin-left: 0;
 887 }
 888
 889 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget {
 890   float: left;
 891 }
 892
 893 .oo-ui-outlineControlsWidget-movers {
 894   float: right;
 895 }
 896
 897 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
 898   float: right;
 899 }
 900
 901 .oo-ui-outlineItemWidget {
 902   position: relative;
 903   padding: 0.75em;
 904   cursor: pointer;
 905   -webkit-user-select: none;
 906      -moz-user-select: none;
 907       -ms-user-select: none;
 908           user-select: none;
 909   -webkit-touch-callout: none;
 910 }
 911
 912 .oo-ui-popupButtonWidget {
 913   position: relative;
 914 }
 915
 916 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
 917   position: absolute;
 918   left: 1em;
 919   cursor: auto;
 920 }
 921
 922 .oo-ui-searchWidget-query {
 923   position: absolute;
 924   top: 0;
 925   right: 0;
 926   left: 0;
 927   height: 4em;
 928   padding: 0 1em;
 929 }
 930
 931 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
 932   width: 100%;
 933   margin: 0.75em 0;
 934 }
 935
 936 .oo-ui-searchWidget-results {
 937   position: absolute;
 938   top: 4em;
 939   right: 0;
 940   bottom: 0;
 941   left: 0;
 942   padding: 1em;
 943   overflow-x: hidden;
 944   overflow-y: auto;
 945   line-height: 0;
 946 }
 947
 948 .oo-ui-textInputWidget {
 949   position: relative;
 950   -webkit-box-sizing: border-box;
 951      -moz-box-sizing: border-box;
 952           box-sizing: border-box;
 953 }
 954
 955 .oo-ui-textInputWidget input,
 956 .oo-ui-textInputWidget textarea {
 957   display: inline-block;
 958   width: 100%;
 959   -webkit-box-sizing: border-box;
 960      -moz-box-sizing: border-box;
 961           box-sizing: border-box;
 962   resize: none;
 963 }
 964
 965 .oo-ui-textInputWidget-icon {
 966   position: absolute;
 967   top: 0;
 968   left: 0;
 969   height: 100%;
 970   background-position: right center;
 971   background-repeat: no-repeat;
 972 }
 973
 974 .oo-ui-toggleSwitchWidget {
 975   position: relative;
 976   display: inline-block;
 977   width: 4em;
 978   height: 2em;
 979   overflow: hidden;
 980   vertical-align: middle;
 981   cursor: pointer;
 982   -webkit-transform: translateZ(0);
 983      -moz-transform: translateZ(0);
 984       -ms-transform: translateZ(0);
 985        -o-transform: translateZ(0);
 986           transform: translateZ(0);
 987   -webkit-box-sizing: border-box;
 988      -moz-box-sizing: border-box;
 989           box-sizing: border-box;
 990 }
 991
 992 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
 993   cursor: default;
 994 }
 995
 996 .oo-ui-toggleSwitchWidget-grip {
 997   position: absolute;
 998   top: 0.25em;
 999   left: 0.25em;
1000   display: block;
1001   width: 1.5em;
1002   height: 1.5em;
1003   -webkit-box-sizing: border-box;
1004      -moz-box-sizing: border-box;
1005           box-sizing: border-box;
1006   -webkit-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1007      -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1008       -ms-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1009        -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1010           transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1011 }
1012
1013 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1014   position: absolute;
1015   top: 0;
1016   right: 0;
1017   bottom: 0;
1018   left: 0;
1019   -webkit-transition: opacity 200ms ease-in-out;
1020      -moz-transition: opacity 200ms ease-in-out;
1021       -ms-transition: opacity 200ms ease-in-out;
1022        -o-transition: opacity 200ms ease-in-out;
1023           transition: opacity 200ms ease-in-out;
1024   -webkit-user-select: none;
1025      -moz-user-select: none;
1026       -ms-user-select: none;
1027           user-select: none;
1028   -webkit-touch-callout: none;
1029 }
1030
1031 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
1032   left: 2.25em;
1033   margin-left: -2px;
1034 }
1035
1036 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
1037   left: 0.25em;
1038   margin-left: 0;
1039 }
1040
1041 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1042   display: none;
1043 }
1044
1045 /* Icons */
1046
1047 .oo-ui-icon-add-item {
1048   background-image: /* @embed */ url(images/icons/add-item.png);
1049 }
1050
1051 .oo-ui-icon-advanced {
1052   background-image: /* @embed */ url(images/icons/advanced.png);
1053 }
1054
1055 .oo-ui-icon-alert {
1056   background-image: /* @embed */ url(images/icons/alert.png);
1057 }
1058
1059 .oo-ui-icon-check {
1060   background-image: /* @embed */ url(images/icons/check.png);
1061 }
1062
1063 .oo-ui-icon-clear {
1064   background-image: /* @embed */ url(images/icons/clear.png);
1065 }
1066
1067 .oo-ui-icon-close {
1068   background-image: /* @embed */ url(images/icons/close.png);
1069 }
1070
1071 .oo-ui-icon-code {
1072   background-image: /* @embed */ url(images/icons/code.png);
1073 }
1074
1075 .oo-ui-icon-collapse {
1076   background-image: /* @embed */ url(images/icons/collapse.png);
1077 }
1078
1079 .oo-ui-icon-comment {
1080   background-image: /* @embed */ url(images/icons/comment.png);
1081 }
1082
1083 .oo-ui-icon-expand {
1084   background-image: /* @embed */ url(images/icons/expand.png);
1085 }
1086
1087 .oo-ui-icon-help {
1088   background-image: /* @embed */ url(images/icons/help.png);
1089 }
1090
1091 .oo-ui-icon-info {
1092   background-image: /* @embed */ url(images/icons/info.png);
1093 }
1094
1095 .oo-ui-icon-link {
1096   background-image: /* @embed */ url(images/icons/link.png);
1097 }
1098
1099 .oo-ui-icon-menu {
1100   background-image: /* @embed */ url(images/icons/menu.png);
1101 }
1102
1103 .oo-ui-icon-next {
1104   background-image: /* @embed */ url(images/icons/move-ltr.png);
1105 }
1106
1107 .oo-ui-icon-picture {
1108   background-image: /* @embed */ url(images/icons/picture.png);
1109 }
1110
1111 .oo-ui-icon-previous {
1112   background-image: /* @embed */ url(images/icons/move-rtl.png);
1113 }
1114
1115 .oo-ui-icon-redo {
1116   background-image: /* @embed */ url(images/icons/arched-arrow-ltr.png);
1117 }
1118
1119 .oo-ui-icon-remove {
1120   background-image: /* @embed */ url(images/icons/remove.png);
1121 }
1122
1123 .oo-ui-icon-search {
1124   background-image: /* @embed */ url(images/icons/search.png);
1125 }
1126
1127 .oo-ui-icon-settings {
1128   background-image: /* @embed */ url(images/icons/settings.png);
1129 }
1130
1131 .oo-ui-icon-tag {
1132   background-image: /* @embed */ url(images/icons/tag.png);
1133 }
1134
1135 .oo-ui-icon-undo {
1136   background-image: /* @embed */ url(images/icons/arched-arrow-rtl.png);
1137 }
1138
1139 .oo-ui-icon-window {
1140   background-image: /* @embed */ url(images/icons/window.png);
1141 }
1142
1143 /* Indicators */
1144
1145 .oo-ui-indicator-alert {
1146   background-image: /* @embed */ url(images/indicators/alert.png);
1147 }
1148
1149 .oo-ui-indicator-down {
1150   background-image: /* @embed */ url(images/indicators/down.png);
1151 }
1152
1153 .oo-ui-indicator-required {
1154   background-image: /* @embed */ url(images/indicators/required.png);
1155 }
1156
1157 .oo-ui-indicator-up {
1158   background-image: /* @embed */ url(images/indicators/up.png);
1159 }