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

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