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

   1 /*!
   2  * OOjs UI v0.1.0-pre (46ccd5b3a7)
   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 Mar 12 2014 17:44:18 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: 3.25em;
 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.5em;
 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-buttonGroupWidget {
 809   border-radius: 0.3em;
 810 }
 811
 812 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
 813   margin-bottom: -1px;
 814   margin-left: -1px;
 815   border-radius: 0;
 816 }
 817
 818 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:first-child .oo-ui-buttonedElement-button {
 819   margin-left: 0;
 820   border-bottom-left-radius: 0.3em;
 821   border-top-left-radius: 0.3em;
 822 }
 823
 824 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:last-child .oo-ui-buttonedElement-button {
 825   border-top-right-radius: 0.3em;
 826   border-bottom-right-radius: 0.3em;
 827 }
 828
 829 .oo-ui-buttonOptionWidget {
 830   display: inline-block;
 831   padding: 0;
 832   background-color: transparent;
 833 }
 834
 835 .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
 836   position: relative;
 837   height: 1.9em;
 838 }
 839
 840 .oo-ui-buttonOptionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon,
 841 .oo-ui-buttonOptionWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
 842   position: static;
 843   display: inline-block;
 844   height: 1.9em;
 845   margin-top: 0;
 846   vertical-align: middle;
 847 }
 848
 849 .oo-ui-buttonSelectWidget {
 850   display: inline-block;
 851   white-space: nowrap;
 852 }
 853
 854 .oo-ui-buttonWidget {
 855   display: inline-block;
 856   vertical-align: middle;
 857 }
 858
 859 .oo-ui-inlineMenuWidget {
 860   position: relative;
 861   display: inline-block;
 862   min-width: 20em;
 863   margin: 0.25em 0;
 864 }
 865
 866 .oo-ui-inlineMenuWidget-handle {
 867   display: inline-block;
 868   width: 100%;
 869   height: 2.5em;
 870   cursor: pointer;
 871   -webkit-box-sizing: border-box;
 872      -moz-box-sizing: border-box;
 873           box-sizing: border-box;
 874   -webkit-user-select: none;
 875      -moz-user-select: none;
 876       -ms-user-select: none;
 877           user-select: none;
 878   -webkit-touch-callout: none;
 879 }
 880
 881 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 882 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 883   position: absolute;
 884   top: 0;
 885   width: 2.5em;
 886   height: 2.5em;
 887   background-position: center center;
 888   background-repeat: no-repeat;
 889 }
 890
 891 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator {
 892   right: 0;
 893 }
 894
 895 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
 896   left: 0.25em;
 897 }
 898
 899 .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 900   margin: 0 0.5em;
 901   line-height: 2.5em;
 902 }
 903
 904 .oo-ui-inlineMenuWidget.oo-ui-iconedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 905   margin-left: 3em;
 906 }
 907
 908 .oo-ui-inlineMenuWidget.oo-ui-indicatedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
 909   margin-right: 2em;
 910 }
 911
 912 .oo-ui-inlineMenuWidget .oo-ui-menuWidget {
 913   width: 100%;
 914 }
 915
 916 .oo-ui-menuItemWidget {
 917   position: relative;
 918 }
 919
 920 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
 921   display: none;
 922 }
 923
 924 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
 925   background-color: transparent;
 926 }
 927
 928 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconedElement-icon {
 929   display: block;
 930 }
 931
 932 .oo-ui-menuSectionItemWidget {
 933   padding: 0.33em 0.75em;
 934   cursor: default;
 935 }
 936
 937 .oo-ui-outlineControlsWidget {
 938   height: 3em;
 939 }
 940
 941 .oo-ui-outlineControlsWidget-adders,
 942 .oo-ui-outlineControlsWidget-movers {
 943   float: left;
 944   height: 2em;
 945   padding: 0;
 946   margin: 0.5em;
 947   -webkit-box-sizing: border-box;
 948      -moz-box-sizing: border-box;
 949           box-sizing: border-box;
 950 }
 951
 952 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
 953   float: left;
 954   width: 1.5em;
 955   height: 2em;
 956   margin: 0.5em 0 0.5em 0.5em;
 957   background-position: right center;
 958   background-repeat: no-repeat;
 959 }
 960
 961 .oo-ui-outlineControlsWidget-adders {
 962   float: left;
 963   margin-left: 0;
 964 }
 965
 966 .oo-ui-outlineControlsWidget-adders .oo-ui-buttonWidget {
 967   float: left;
 968 }
 969
 970 .oo-ui-outlineControlsWidget-movers {
 971   float: right;
 972 }
 973
 974 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
 975   float: right;
 976 }
 977
 978 .oo-ui-outlineItemWidget {
 979   position: relative;
 980   padding: 0.75em;
 981   cursor: pointer;
 982   -webkit-user-select: none;
 983      -moz-user-select: none;
 984       -ms-user-select: none;
 985           user-select: none;
 986   -webkit-touch-callout: none;
 987 }
 988
 989 .oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-labeledElement-label {
 990   padding-right: 1.5em;
 991 }
 992
 993 .oo-ui-outlineItemWidget-level-0 {
 994   padding-left: 3.5em;
 995 }
 996
 997 .oo-ui-outlineItemWidget-level-0 .oo-ui-iconedElement-icon {
 998   left: 1em;
 999 }
1000
1001 .oo-ui-outlineItemWidget-level-1 {
1002   padding-left: 5em;
1003 }
1004
1005 .oo-ui-outlineItemWidget-level-1 .oo-ui-iconedElement-icon {
1006   left: 2.5em;
1007 }
1008
1009 .oo-ui-outlineItemWidget-level-2 {
1010   padding-left: 6.5em;
1011 }
1012
1013 .oo-ui-outlineItemWidget-level-2 .oo-ui-iconedElement-icon {
1014   left: 4em;
1015 }
1016
1017 .oo-ui-popupButtonWidget {
1018   position: relative;
1019 }
1020
1021 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
1022   position: absolute;
1023   left: 1em;
1024   cursor: auto;
1025 }
1026
1027 .oo-ui-searchWidget-query {
1028   position: absolute;
1029   top: 0;
1030   right: 0;
1031   left: 0;
1032   height: 4em;
1033   padding: 0 1em;
1034 }
1035
1036 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1037   width: 100%;
1038   margin: 0.75em 0;
1039 }
1040
1041 .oo-ui-searchWidget-results {
1042   position: absolute;
1043   top: 4em;
1044   right: 0;
1045   bottom: 0;
1046   left: 0;
1047   padding: 1em;
1048   overflow-x: hidden;
1049   overflow-y: auto;
1050   line-height: 0;
1051 }
1052
1053 .oo-ui-textInputWidget {
1054   position: relative;
1055   width: 20em;
1056   -webkit-box-sizing: border-box;
1057      -moz-box-sizing: border-box;
1058           box-sizing: border-box;
1059 }
1060
1061 .oo-ui-textInputWidget input,
1062 .oo-ui-textInputWidget textarea {
1063   display: inline-block;
1064   width: 100%;
1065   padding: 0.5em;
1066   -webkit-box-sizing: border-box;
1067      -moz-box-sizing: border-box;
1068           box-sizing: border-box;
1069   resize: none;
1070 }
1071
1072 .oo-ui-textInputWidget-decorated input,
1073 .oo-ui-textInputWidget-decorated textarea {
1074   padding-left: 2em;
1075 }
1076
1077 .oo-ui-textInputWidget-icon {
1078   position: absolute;
1079   top: 0;
1080   left: 0;
1081   width: 2em;
1082   height: 100%;
1083   background-position: right center;
1084   background-repeat: no-repeat;
1085 }
1086
1087 .oo-ui-toggleSwitchWidget {
1088   position: relative;
1089   display: inline-block;
1090   width: 3em;
1091   height: 2em;
1092   overflow: hidden;
1093   vertical-align: middle;
1094   cursor: pointer;
1095   -webkit-transform: translateZ(0);
1096      -moz-transform: translateZ(0);
1097       -ms-transform: translateZ(0);
1098        -o-transform: translateZ(0);
1099           transform: translateZ(0);
1100   -webkit-box-sizing: border-box;
1101      -moz-box-sizing: border-box;
1102           box-sizing: border-box;
1103 }
1104
1105 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1106   cursor: default;
1107 }
1108
1109 .oo-ui-toggleSwitchWidget-grip {
1110   position: absolute;
1111   top: 0.25em;
1112   left: 0.25em;
1113   display: block;
1114   width: 1.5em;
1115   height: 1.5em;
1116   -webkit-box-sizing: border-box;
1117      -moz-box-sizing: border-box;
1118           box-sizing: border-box;
1119   -webkit-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1120      -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1121       -ms-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1122        -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1123           transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
1124 }
1125
1126 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1127   position: absolute;
1128   top: 0;
1129   right: 0;
1130   bottom: 0;
1131   left: 0;
1132   -webkit-transition: opacity 200ms ease-in-out;
1133      -moz-transition: opacity 200ms ease-in-out;
1134       -ms-transition: opacity 200ms ease-in-out;
1135        -o-transition: opacity 200ms ease-in-out;
1136           transition: opacity 200ms ease-in-out;
1137   -webkit-user-select: none;
1138      -moz-user-select: none;
1139       -ms-user-select: none;
1140           user-select: none;
1141   -webkit-touch-callout: none;
1142 }
1143
1144 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
1145   left: 1.25em;
1146   margin-left: -2px;
1147 }
1148
1149 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
1150   left: 0.25em;
1151   margin-left: 0;
1152 }
1153
1154 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1155   display: none;
1156 }
1157
1158 /* Icons */
1159
1160 .oo-ui-icon-add-item {
1161   background-image: /* @embed */ url(images/icons/add-item.svg);
1162 }
1163
1164 .oo-ui-icon-advanced {
1165   background-image: /* @embed */ url(images/icons/advanced.svg);
1166 }
1167
1168 .oo-ui-icon-alert {
1169   background-image: /* @embed */ url(images/icons/alert.svg);
1170 }
1171
1172 .oo-ui-icon-check {
1173   background-image: /* @embed */ url(images/icons/check.svg);
1174 }
1175
1176 .oo-ui-icon-clear {
1177   background-image: /* @embed */ url(images/icons/clear.svg);
1178 }
1179
1180 .oo-ui-icon-close {
1181   background-image: /* @embed */ url(images/icons/close.svg);
1182 }
1183
1184 .oo-ui-icon-code {
1185   background-image: /* @embed */ url(images/icons/code.svg);
1186 }
1187
1188 .oo-ui-icon-collapse {
1189   background-image: /* @embed */ url(images/icons/collapse.svg);
1190 }
1191
1192 .oo-ui-icon-comment {
1193   background-image: /* @embed */ url(images/icons/comment.svg);
1194 }
1195
1196 .oo-ui-icon-expand {
1197   background-image: /* @embed */ url(images/icons/expand.svg);
1198 }
1199
1200 .oo-ui-icon-help {
1201   background-image: /* @embed */ url(images/icons/help.svg);
1202 }
1203
1204 .oo-ui-icon-link {
1205   background-image: /* @embed */ url(images/icons/link.svg);
1206 }
1207
1208 .oo-ui-icon-menu {
1209   background-image: /* @embed */ url(images/icons/menu.svg);
1210 }
1211
1212 .oo-ui-icon-next {
1213   background-image: /* @embed */ url(images/icons/move-ltr.svg);
1214 }
1215
1216 .oo-ui-icon-picture {
1217   background-image: /* @embed */ url(images/icons/picture.svg);
1218 }
1219
1220 .oo-ui-icon-previous {
1221   background-image: /* @embed */ url(images/icons/move-rtl.svg);
1222 }
1223
1224 .oo-ui-icon-redo {
1225   background-image: /* @embed */ url(images/icons/arched-arrow-ltr.svg);
1226 }
1227
1228 .oo-ui-icon-remove {
1229   background-image: /* @embed */ url(images/icons/remove.svg);
1230 }
1231
1232 .oo-ui-icon-search {
1233   background-image: /* @embed */ url(images/icons/search.svg);
1234 }
1235
1236 .oo-ui-icon-settings {
1237   background-image: /* @embed */ url(images/icons/settings.svg);
1238 }
1239
1240 .oo-ui-icon-tag {
1241   background-image: /* @embed */ url(images/icons/tag.svg);
1242 }
1243
1244 .oo-ui-icon-undo {
1245   background-image: /* @embed */ url(images/icons/arched-arrow-rtl.svg);
1246 }
1247
1248 .oo-ui-icon-window {
1249   background-image: /* @embed */ url(images/icons/window.svg);
1250 }
1251
1252 /* Indicators */
1253
1254 .oo-ui-indicator-down {
1255   background-image: /* @embed */ url(images/indicators/down.svg);
1256 }
1257
1258 .oo-ui-indicator-required {
1259   background-image: /* @embed */ url(images/indicators/required.svg);
1260 }
1261
1262 .oo-ui-indicator-up {
1263   background-image: /* @embed */ url(images/indicators/up.svg);
1264 }