resources/oojs-ui/oojs-ui.svg.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: Mon Mar 24 2014 17:35:46 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-small .oo-ui-window-frame {
  68   width: 400px;
  69   max-height: 230px;
  70 }
  71
  72 .oo-ui-dialog-medium .oo-ui-window-frame {
  73   width: 600px;
  74   max-height: 460px;
  75 }
  76
  77 .oo-ui-dialog-large .oo-ui-window-frame {
  78   width: 800px;
  79   max-height: 690px;
  80 }
  81
  82 .oo-ui-dialog .oo-ui-frame {
  83   width: 100%;
  84   height: 100%;
  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 {
 162   font-family: sans-serif;
 163   font-size: 0.8em;
 164 }
 165
 166 .oo-ui-toolbar {
 167   clear: both;
 168 }
 169
 170 .oo-ui-toolbar-bar {
 171   line-height: 1em;
 172 }
 173
 174 .oo-ui-toolbar-bottom .oo-ui-toolbar-bar {
 175   position: absolute;
 176 }
 177
 178 .oo-ui-toolbar-actions {
 179   float: right;
 180 }
 181
 182 .oo-ui-toolbar-tools {
 183   float: left;
 184 }
 185
 186 .oo-ui-toolbar-tools,
 187 .oo-ui-toolbar-actions,
 188 .oo-ui-toolbar-shadow {
 189   -webkit-user-select: none;
 190      -moz-user-select: none;
 191       -ms-user-select: none;
 192           user-select: none;
 193   -webkit-touch-callout: none;
 194 }
 195
 196 .oo-ui-toolbar-actions .oo-ui-popupWidget {
 197   -webkit-user-select: all;
 198      -moz-user-select: all;
 199       -ms-user-select: all;
 200           user-select: all;
 201   -webkit-touch-callout: default;
 202 }
 203
 204 .oo-ui-toolbar-shadow {
 205   position: absolute;
 206   width: 100%;
 207   pointer-events: none;
 208   background-position: left top;
 209   background-repeat: repeat-x;
 210 }
 211
 212 .oo-ui-toolGroup {
 213   display: inline-block;
 214   margin: 0.3em;
 215   vertical-align: middle;
 216 }
 217
 218 .oo-ui-toolGroup-empty {
 219   display: none;
 220 }
 221
 222 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 223   background-position: center center;
 224   background-repeat: no-repeat;
 225 }
 226
 227 .oo-ui-window-head {
 228   -webkit-user-select: none;
 229      -moz-user-select: none;
 230       -ms-user-select: none;
 231           user-select: none;
 232   -webkit-touch-callout: none;
 233 }
 234
 235 .oo-ui-window-body {
 236   padding: 0 0.75em;
 237 }
 238
 239 .oo-ui-window-icon {
 240   float: left;
 241   width: 2em;
 242   height: 2em;
 243   margin-right: 0.5em;
 244   line-height: 2em;
 245   background-position: right center;
 246   background-repeat: no-repeat;
 247 }
 248
 249 .oo-ui-window-title {
 250   float: left;
 251   line-height: 2em;
 252   white-space: nowrap;
 253   cursor: default;
 254 }
 255
 256 .oo-ui-window-overlay {
 257   position: absolute;
 258   top: 0;
 259   left: 0;
 260 }
 261
 262 .oo-ui-buttonedElement .oo-ui-buttonedElement-button {
 263   display: inline-block;
 264   vertical-align: middle;
 265   cursor: pointer;
 266   -webkit-user-select: none;
 267      -moz-user-select: none;
 268       -ms-user-select: none;
 269           user-select: none;
 270   -webkit-touch-callout: none;
 271 }
 272
 273 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 274   display: none;
 275   margin-left: 0;
 276 }
 277
 278 .oo-ui-buttonedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator {
 279   display: none;
 280   margin-right: -0.75em;
 281 }
 282
 283 .oo-ui-buttonedElement.oo-ui-widget-disabled .oo-ui-buttonedElement-button {
 284   cursor: default;
 285 }
 286
 287 .oo-ui-buttonedElement.oo-ui-indicatedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 288 .oo-ui-buttonedElement.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 289   display: inline-block;
 290   width: 1.9em;
 291   height: 1.9em;
 292   vertical-align: middle;
 293   background-position: center center;
 294   background-repeat: no-repeat;
 295 }
 296
 297 .oo-ui-buttonedElement-frameless {
 298   position: relative;
 299   display: inline-block;
 300 }
 301
 302 .oo-ui-buttonedElement-frameless .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 303   display: inline-block;
 304   margin-left: 0.25em;
 305   vertical-align: middle;
 306 }
 307
 308 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 309   display: inline-block;
 310   padding: 0.2em 0.8em;
 311   margin: 0.1em 0;
 312   text-align: center;
 313   vertical-align: top;
 314 }
 315
 316 .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
 317   display: inline-block;
 318   line-height: 1.9em;
 319   vertical-align: middle;
 320 }
 321
 322 .oo-ui-buttonedElement-framed.oo-ui-iconedElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 323   margin-right: -0.5em;
 324   margin-left: -0.5em;
 325 }
 326
 327 .oo-ui-buttonedElement-framed.oo-ui-iconedElement.oo-ui-labeledElement .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
 328   margin-right: 0.3em;
 329   margin-left: -0.5em;
 330 }
 331
 332 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button,
 333 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
 334 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
 335   cursor: default;
 336 }
 337
 338 .oo-ui-clippableElement-clippable {
 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-stackLayout-continuous .oo-ui-panelLayout-scrollable {
 345   overflow-y: hidden;
 346 }
 347
 348 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
 349   width: 100%;
 350   padding: 1.5em;
 351   -webkit-box-sizing: border-box;
 352      -moz-box-sizing: border-box;
 353           box-sizing: border-box;
 354 }
 355
 356 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-scrollable {
 357   overflow-y: auto;
 358 }
 359
 360 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-padded {
 361   padding: 2em;
 362 }
 363
 364 .oo-ui-bookletLayout-outlinePanel-editable .oo-ui-outlineWidget {
 365   position: absolute;
 366   top: 0;
 367   right: 0;
 368   bottom: 3em;
 369   left: 0;
 370   overflow-y: auto;
 371 }
 372
 373 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
 374   position: absolute;
 375   right: 0;
 376   bottom: 0;
 377   left: 0;
 378 }
 379
 380 .oo-ui-fieldLayout {
 381   margin-bottom: 1em;
 382 }
 383
 384 .oo-ui-fieldLayout:last-child {
 385   margin-bottom: 0;
 386 }
 387
 388 .oo-ui-fieldLayout:before,
 389 .oo-ui-fieldLayout:after {
 390   display: table;
 391   content: " ";
 392 }
 393
 394 .oo-ui-fieldLayout:after {
 395   clear: both;
 396 }
 397
 398 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-labeledElement-label,
 399 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
 400   display: block;
 401   float: left;
 402   width: 35%;
 403   padding-top: 0.5em;
 404   margin-right: 5%;
 405 }
 406
 407 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-field,
 408 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-field {
 409   display: block;
 410   float: left;
 411   width: 60%;
 412 }
 413
 414 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
 415   text-align: right;
 416 }
 417
 418 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-labeledElement-label {
 419   display: inline-block;
 420   padding: 0.75em 0.5em 0.5em 0.5em;
 421   vertical-align: middle;
 422 }
 423
 424 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-field {
 425   display: inline-block;
 426   padding: 0.5em 0;
 427   vertical-align: middle;
 428 }
 429
 430 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-labeledElement-label {
 431   padding: 0.5em 0;
 432 }
 433
 434 .oo-ui-fieldsetLayout {
 435   position: relative;
 436   padding: 0;
 437   margin: 0;
 438 }
 439
 440 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout {
 441   margin-top: 2em;
 442 }
 443
 444 .oo-ui-fieldsetLayout-labeled {
 445   margin-top: -0.75em;
 446 }
 447
 448 .oo-ui-fieldsetLayout > legend.oo-ui-labeledElement-label {
 449   padding: 0.25em 0;
 450   margin-bottom: 0.5em;
 451 }
 452
 453 .oo-ui-fieldsetLayout.oo-ui-iconedElement > legend.oo-ui-labeledElement-label {
 454   padding-left: 1.75em;
 455 }
 456
 457 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-iconedElement-icon {
 458   position: absolute;
 459   top: 0;
 460   left: 0;
 461   display: block;
 462   width: 2em;
 463   height: 2em;
 464   background-position: center center;
 465   background-repeat: no-repeat;
 466 }
 467
 468 .oo-ui-gridLayout {
 469   position: absolute;
 470   top: 0;
 471   right: 0;
 472   bottom: 0;
 473   left: 0;
 474 }
 475
 476 .oo-ui-labelWidget {
 477   padding: 0.5em 0;
 478 }
 479
 480 .oo-ui-panelLayout {
 481   position: absolute;
 482   top: 0;
 483   right: 0;
 484   bottom: 0;
 485   left: 0;
 486 }
 487
 488 .oo-ui-panelLayout-scrollable {
 489   overflow-y: auto;
 490 }
 491
 492 .oo-ui-panelLayout-padded {
 493   padding: 2em;
 494 }
 495
 496 .oo-ui-stackLayout > .oo-ui-panelLayout {
 497   display: none;
 498 }
 499
 500 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
 501   position: relative;
 502   display: block;
 503 }
 504
 505 .oo-ui-barToolGroup > .oo-ui-iconedElement-icon,
 506 .oo-ui-barToolGroup > .oo-ui-labeledElement-label {
 507   display: none;
 508 }
 509
 510 .oo-ui-barToolGroup .oo-ui-tool {
 511   position: relative;
 512   display: inline-block;
 513   vertical-align: top;
 514 }
 515
 516 .oo-ui-barToolGroup .oo-ui-tool-link {
 517   display: block;
 518   height: 1.5em;
 519   padding: 0.25em;
 520   cursor: pointer;
 521 }
 522
 523 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 524   display: block;
 525   width: 1.5em;
 526   height: 1.5em;
 527 }
 528
 529 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
 530   display: none;
 531 }
 532
 533 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 534   cursor: default;
 535 }
 536
 537 .oo-ui-barToolGroup .oo-ui-tool-title,
 538 .oo-ui-barToolGroup .oo-ui-tool-accel {
 539   display: none;
 540 }
 541
 542 .oo-ui-listToolGroup .oo-ui-toolGroup-tools {
 543   padding: 0.25em;
 544 }
 545
 546 .oo-ui-listToolGroup .oo-ui-tool {
 547   display: inline-block;
 548   width: 100%;
 549   -webkit-box-sizing: border-box;
 550      -moz-box-sizing: border-box;
 551           box-sizing: border-box;
 552 }
 553
 554 .oo-ui-listToolGroup .oo-ui-tool-link {
 555   display: block;
 556   padding-right: 0.5em;
 557   white-space: nowrap;
 558   cursor: pointer;
 559 }
 560
 561 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
 562   cursor: default;
 563 }
 564
 565 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 566   min-width: 8em;
 567 }
 568
 569 .oo-ui-menuToolGroup .oo-ui-tool {
 570   display: block;
 571 }
 572
 573 .oo-ui-menuToolGroup .oo-ui-tool-link {
 574   display: block;
 575   padding: 0.25em 1em 0.25em 0.25em;
 576   white-space: nowrap;
 577   cursor: pointer;
 578 }
 579
 580 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
 581   background-image: none;
 582 }
 583
 584 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconedElement-icon {
 585   background-image: /* @embed */ url(images/icons/check.png);
 586 }
 587
 588 .oo-ui-popupToolGroup {
 589   position: relative;
 590   height: 2em;
 591   min-width: 2.5em;
 592 }
 593
 594 .oo-ui-popupToolGroup.oo-ui-indicatedElement.oo-ui-iconedElement {
 595   min-width: 3.5em;
 596 }
 597
 598 .oo-ui-popupToolGroup-handle {
 599   display: block;
 600   cursor: pointer;
 601 }
 602
 603 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
 604 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 605   position: absolute;
 606   top: 0;
 607   width: 2em;
 608   height: 2em;
 609   background-position: center center;
 610   background-repeat: no-repeat;
 611 }
 612
 613 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator {
 614   right: 0;
 615 }
 616
 617 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
 618   left: 0.25em;
 619 }
 620
 621 .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
 622   margin: 0 1em;
 623   font-size: 0.8em;
 624   line-height: 2.6em;
 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   padding: 0.5em 2em 0.5em 3em;
 721   margin: 0;
 722   list-style: none;
 723   cursor: pointer;
 724   border: none;
 725 }
 726
 727 .oo-ui-optionWidget.oo-ui-widget-disabled {
 728   cursor: default;
 729 }
 730
 731 .oo-ui-optionWidget .oo-ui-labeledElement-label {
 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   padding: 0;
 836   background-color: transparent;
 837 }
 838
 839 .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
 840   position: relative;
 841   height: 1.9em;
 842 }
 843
 844 .oo-ui-buttonOptionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon,
 845 .oo-ui-buttonOptionWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
 846   position: static;
 847   display: inline-block;
 848   height: 1.9em;
 849   margin-top: 0;
 850   vertical-align: middle;
 851 }
 852
 853 .oo-ui-buttonSelectWidget {
 854   display: inline-block;
 855   white-space: nowrap;
 856 }
 857
 858 .oo-ui-buttonWidget {
 859   display: inline-block;
 860   vertical-align: middle;
 861 }
 862
 863 .oo-ui-inlineMenuWidget {
 864   position: relative;
 865   display: inline-block;
 866   min-width: 20em;
 867   margin: 0.25em 0;
 868 }
 869
 870 .oo-ui-inlineMenuWidget-handle {
 871   display: inline-block;
 872   width: 100%;
 873   height: 2.5em;
 874   cursor: pointer;
 875   -webkit-box-sizing: border-box;
 876      -moz-box-sizing: border-box;
 877           box-sizing: border-box;
 878   -webkit-user-select: none;
 879      -moz-user-select: none;
 880       -ms-user-select: none;
 881           user-select: none;
 882   -webkit-touch-callout: none;
 883 }
 884
 885 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 886 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 887   position: absolute;
 888   top: 0;
 889   width: 2.5em;
 890   height: 2.5em;
 891   background-position: center center;
 892   background-repeat: no-repeat;
 893 }
 894
 895 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator {
 896   right: 0;
 897 }
 898
 899 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 900   left: 0.25em;
 901 }
 902
 903 .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 904   margin: 0 0.5em;
 905   line-height: 2.5em;
 906 }
 907
 908 .oo-ui-inlineMenuWidget.oo-ui-iconedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 909   margin-left: 3em;
 910 }
 911
 912 .oo-ui-inlineMenuWidget.oo-ui-indicatedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 913   margin-right: 2em;
 914 }
 915
 916 .oo-ui-inlineMenuWidget .oo-ui-menuWidget {
 917   width: 100%;
 918 }
 919
 920 .oo-ui-menuItemWidget {
 921   position: relative;
 922 }
 923
 924 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
 925   display: none;
 926 }
 927
 928 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
 929   background-color: transparent;
 930 }
 931
 932 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconedElement-icon {
 933   display: block;
 934 }
 935
 936 .oo-ui-menuSectionItemWidget {
 937   padding: 0.33em 0.75em;
 938   cursor: default;
 939 }
 940
 941 .oo-ui-outlineControlsWidget {
 942   height: 3em;
 943 }
 944
 945 .oo-ui-outlineControlsWidget-adders,
 946 .oo-ui-outlineControlsWidget-movers {
 947   float: left;
 948   height: 2em;
 949   padding: 0;
 950   margin: 0.5em;
 951   -webkit-box-sizing: border-box;
 952      -moz-box-sizing: border-box;
 953           box-sizing: border-box;
 954 }
 955
 956 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
 957   float: left;
 958   width: 1.5em;
 959   height: 2em;
 960   margin: 0.5em 0 0.5em 0.5em;
 961   background-position: right center;
 962   background-repeat: no-repeat;
 963 }
 964
 965 .oo-ui-outlineControlsWidget-adders {
 966   float: left;
 967   margin-left: 0;
 968 }
 969
 970 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget {
 971   float: left;
 972 }
 973
 974 .oo-ui-outlineControlsWidget-movers {
 975   float: right;
 976 }
 977
 978 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
 979   float: right;
 980 }
 981
 982 .oo-ui-outlineItemWidget {
 983   position: relative;
 984   padding: 0.75em;
 985   cursor: pointer;
 986   -webkit-user-select: none;
 987      -moz-user-select: none;
 988       -ms-user-select: none;
 989           user-select: none;
 990   -webkit-touch-callout: none;
 991 }
 992
 993 .oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-labeledElement-label {
 994   padding-right: 1.5em;
 995 }
 996
 997 .oo-ui-outlineItemWidget-level-0 {
 998   padding-left: 3.5em;
 999 }
1000
1001 .oo-ui-outlineItemWidget-level-0 .oo-ui-iconedElement-icon {
1002   left: 1em;
1003 }
1004
1005 .oo-ui-outlineItemWidget-level-1 {
1006   padding-left: 5em;
1007 }
1008
1009 .oo-ui-outlineItemWidget-level-1 .oo-ui-iconedElement-icon {
1010   left: 2.5em;
1011 }
1012
1013 .oo-ui-outlineItemWidget-level-2 {
1014   padding-left: 6.5em;
1015 }
1016
1017 .oo-ui-outlineItemWidget-level-2 .oo-ui-iconedElement-icon {
1018   left: 4em;
1019 }
1020
1021 .oo-ui-popupButtonWidget {
1022   position: relative;
1023 }
1024
1025 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
1026   position: absolute;
1027   left: 1em;
1028   cursor: auto;
1029 }
1030
1031 .oo-ui-searchWidget-query {
1032   position: absolute;
1033   top: 0;
1034   right: 0;
1035   left: 0;
1036   height: 4em;
1037   padding: 0 1em;
1038 }
1039
1040 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1041   width: 100%;
1042   margin: 0.75em 0;
1043 }
1044
1045 .oo-ui-searchWidget-results {
1046   position: absolute;
1047   top: 4em;
1048   right: 0;
1049   bottom: 0;
1050   left: 0;
1051   padding: 1em;
1052   overflow-x: hidden;
1053   overflow-y: auto;
1054   line-height: 0;
1055 }
1056
1057 .oo-ui-textInputWidget {
1058   position: relative;
1059   width: 20em;
1060   -webkit-box-sizing: border-box;
1061      -moz-box-sizing: border-box;
1062           box-sizing: border-box;
1063 }
1064
1065 .oo-ui-textInputWidget input,
1066 .oo-ui-textInputWidget textarea {
1067   display: inline-block;
1068   width: 100%;
1069   padding: 0.5em;
1070   -webkit-box-sizing: border-box;
1071      -moz-box-sizing: border-box;
1072           box-sizing: border-box;
1073   resize: none;
1074 }
1075
1076 .oo-ui-textInputWidget-decorated input,
1077 .oo-ui-textInputWidget-decorated textarea {
1078   padding-left: 2em;
1079 }
1080
1081 .oo-ui-textInputWidget-icon {
1082   position: absolute;
1083   top: 0;
1084   left: 0;
1085   width: 2em;
1086   height: 100%;
1087   background-position: right center;
1088   background-repeat: no-repeat;
1089 }
1090
1091 .oo-ui-toggleSwitchWidget {
1092   position: relative;
1093   display: inline-block;
1094   width: 3em;
1095   height: 2em;
1096   overflow: hidden;
1097   vertical-align: middle;
1098   cursor: pointer;
1099   -webkit-transform: translateZ(0);
1100      -moz-transform: translateZ(0);
1101       -ms-transform: translateZ(0);
1102        -o-transform: translateZ(0);
1103           transform: translateZ(0);
1104   -webkit-box-sizing: border-box;
1105      -moz-box-sizing: border-box;
1106           box-sizing: border-box;
1107 }
1108
1109 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1110   cursor: default;
1111 }
1112
1113 .oo-ui-toggleSwitchWidget-grip {
1114   position: absolute;
1115   top: 0.25em;
1116   left: 0.25em;
1117   display: block;
1118   width: 1.5em;
1119   height: 1.5em;
1120   -webkit-box-sizing: border-box;
1121      -moz-box-sizing: border-box;
1122           box-sizing: border-box;
1123   -webkit-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1124      -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1125       -ms-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1126        -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1127           transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1128 }
1129
1130 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1131   position: absolute;
1132   top: 0;
1133   right: 0;
1134   bottom: 0;
1135   left: 0;
1136   -webkit-transition: opacity 200ms ease-in-out;
1137      -moz-transition: opacity 200ms ease-in-out;
1138       -ms-transition: opacity 200ms ease-in-out;
1139        -o-transition: opacity 200ms ease-in-out;
1140           transition: opacity 200ms ease-in-out;
1141   -webkit-user-select: none;
1142      -moz-user-select: none;
1143       -ms-user-select: none;
1144           user-select: none;
1145   -webkit-touch-callout: none;
1146 }
1147
1148 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
1149   left: 1.25em;
1150   margin-left: -2px;
1151 }
1152
1153 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
1154   left: 0.25em;
1155   margin-left: 0;
1156 }
1157
1158 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1159   display: none;
1160 }
1161
1162 /* Icons */
1163
1164 .oo-ui-icon-add-item {
1165   background-image: /* @embed */ url(images/icons/add-item.svg);
1166 }
1167
1168 .oo-ui-icon-advanced {
1169   background-image: /* @embed */ url(images/icons/advanced.svg);
1170 }
1171
1172 .oo-ui-icon-alert {
1173   background-image: /* @embed */ url(images/icons/alert.svg);
1174 }
1175
1176 .oo-ui-icon-check {
1177   background-image: /* @embed */ url(images/icons/check.svg);
1178 }
1179
1180 .oo-ui-icon-clear {
1181   background-image: /* @embed */ url(images/icons/clear.svg);
1182 }
1183
1184 .oo-ui-icon-close {
1185   background-image: /* @embed */ url(images/icons/close.svg);
1186 }
1187
1188 .oo-ui-icon-code {
1189   background-image: /* @embed */ url(images/icons/code.svg);
1190 }
1191
1192 .oo-ui-icon-collapse {
1193   background-image: /* @embed */ url(images/icons/collapse.svg);
1194 }
1195
1196 .oo-ui-icon-comment {
1197   background-image: /* @embed */ url(images/icons/comment.svg);
1198 }
1199
1200 .oo-ui-icon-expand {
1201   background-image: /* @embed */ url(images/icons/expand.svg);
1202 }
1203
1204 .oo-ui-icon-help {
1205   background-image: /* @embed */ url(images/icons/help.svg);
1206 }
1207
1208 .oo-ui-icon-link {
1209   background-image: /* @embed */ url(images/icons/link.svg);
1210 }
1211
1212 .oo-ui-icon-menu {
1213   background-image: /* @embed */ url(images/icons/menu.svg);
1214 }
1215
1216 .oo-ui-icon-next {
1217   background-image: /* @embed */ url(images/icons/move-ltr.svg);
1218 }
1219
1220 .oo-ui-icon-picture {
1221   background-image: /* @embed */ url(images/icons/picture.svg);
1222 }
1223
1224 .oo-ui-icon-previous {
1225   background-image: /* @embed */ url(images/icons/move-rtl.svg);
1226 }
1227
1228 .oo-ui-icon-redo {
1229   background-image: /* @embed */ url(images/icons/arched-arrow-ltr.svg);
1230 }
1231
1232 .oo-ui-icon-remove {
1233   background-image: /* @embed */ url(images/icons/remove.svg);
1234 }
1235
1236 .oo-ui-icon-search {
1237   background-image: /* @embed */ url(images/icons/search.svg);
1238 }
1239
1240 .oo-ui-icon-settings {
1241   background-image: /* @embed */ url(images/icons/settings.svg);
1242 }
1243
1244 .oo-ui-icon-tag {
1245   background-image: /* @embed */ url(images/icons/tag.svg);
1246 }
1247
1248 .oo-ui-icon-undo {
1249   background-image: /* @embed */ url(images/icons/arched-arrow-rtl.svg);
1250 }
1251
1252 .oo-ui-icon-window {
1253   background-image: /* @embed */ url(images/icons/window.svg);
1254 }
1255
1256 /* Indicators */
1257
1258 .oo-ui-indicator-down {
1259   background-image: /* @embed */ url(images/indicators/down.svg);
1260 }
1261
1262 .oo-ui-indicator-required {
1263   background-image: /* @embed */ url(images/indicators/required.svg);
1264 }
1265
1266 .oo-ui-indicator-up {
1267   background-image: /* @embed */ url(images/indicators/up.svg);
1268 }