Update OOjs UI to v0.1.0-pre (55b861b167)
authorRoan Kattouw <roan.kattouw@gmail.com>
Thu, 21 Aug 2014 16:59:20 +0000 (09:59 -0700)
committerRoan Kattouw <roan.kattouw@gmail.com>
Thu, 21 Aug 2014 16:59:20 +0000 (09:59 -0700)
New changes:
466a876 [BREAKING CHANGE] Make content isolation optional
23f26c3 [BREAKING CHANGE] Set active and pressed on the buttoned element, not the button
55b861b build: Switch from grunt-recess to grunt-contrib-less

Change-Id: Ie4454376df9492e3b77b6cc174ce7b38548cc56d

resources/lib/oojs-ui/oojs-ui-agora.css
resources/lib/oojs-ui/oojs-ui-apex.css
resources/lib/oojs-ui/oojs-ui.js
resources/lib/oojs-ui/oojs-ui.svg.css

index e6a6a86..7291cdd 100644 (file)
@@ -1,41 +1,37 @@
 /*!
- * OOjs UI v0.1.0-pre (944c47c5fe)
+ * OOjs UI v0.1.0-pre (55b861b167)
  * https://www.mediawiki.org/wiki/OOjs_UI
  *
  * Copyright 2011–2014 OOjs Team and other contributors.
  * Released under the MIT license
  * http://oojs.mit-license.org
  *
- * Date: 2014-08-21T00:23:52Z
+ * Date: 2014-08-21T16:59:20Z
  */
 .oo-ui-dialog-content > .oo-ui-window-head,
 .oo-ui-dialog-content > .oo-ui-window-body,
 .oo-ui-dialog-content > .oo-ui-window-foot {
   position: absolute;
-  right: 0;
   left: 0;
+  right: 0;
   overflow: hidden;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-head {
-  top: 0;
   z-index: 1;
+  top: 0;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-body {
+  z-index: 2;
   top: 0;
   bottom: 0;
-  z-index: 2;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-foot {
-  bottom: 0;
   z-index: 1;
+  bottom: 0;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-overlay {
   z-index: 3;
 }
   background-color: rgba(255, 255, 255, 0.5);
   opacity: 0;
   -webkit-transition: opacity 250ms ease-in-out;
-     -moz-transition: opacity 250ms ease-in-out;
-      -ms-transition: opacity 250ms ease-in-out;
-       -o-transition: opacity 250ms ease-in-out;
-          transition: opacity 250ms ease-in-out;
+  -moz-transition: opacity 250ms ease-in-out;
+  -ms-transition: opacity 250ms ease-in-out;
+  -o-transition: opacity 250ms ease-in-out;
+  transition: opacity 250ms ease-in-out;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
   top: 0;
   bottom: 0;
   background-color: #fff;
   -webkit-transform: translate3d(0, -200%, 0);
-     -moz-transform: translate3d(0, -200%, 0);
-      -ms-transform: translate3d(0, -200%, 0);
-       -o-transform: translate3d(0, -200%, 0);
-          transform: translate3d(0, -200%, 0);
+  -moz-transform: translate3d(0, -200%, 0);
+  -ms-transform: translate3d(0, -200%, 0);
+  -o-transform: translate3d(0, -200%, 0);
+  transform: translate3d(0, -200%, 0);
   -webkit-transition: transform 250ms ease-in-out;
-     -moz-transition: transform 250ms ease-in-out;
-      -ms-transition: transform 250ms ease-in-out;
-       -o-transition: transform 250ms ease-in-out;
-          transition: transform 250ms ease-in-out;
+  -moz-transition: transform 250ms ease-in-out;
+  -ms-transition: transform 250ms ease-in-out;
+  -o-transition: transform 250ms ease-in-out;
+  transition: transform 250ms ease-in-out;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready {
   opacity: 1;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready > .oo-ui-window-frame {
   -webkit-transform: translate3d(0, 0, 0);
-     -moz-transform: translate3d(0, 0, 0);
-      -ms-transform: translate3d(0, 0, 0);
-       -o-transform: translate3d(0, 0, 0);
-          transform: translate3d(0, 0, 0);
+  -moz-transform: translate3d(0, 0, 0);
+  -ms-transform: translate3d(0, 0, 0);
+  -o-transform: translate3d(0, 0, 0);
+  transform: translate3d(0, 0, 0);
 }
-
 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
   border: solid 1px #ccc;
   border-radius: 0.5em;
 .oo-ui-messageDialog-title,
 .oo-ui-messageDialog-message {
   display: block;
-  padding-top: 0.5em;
   text-align: center;
+  padding-top: 0.5em;
 }
-
 .oo-ui-messageDialog-title {
   font-size: 1.5em;
   line-height: 1em;
   color: #000;
 }
-
 .oo-ui-messageDialog-message {
   font-size: 0.9em;
   line-height: 1.25em;
   color: #666;
 }
-
 .oo-ui-messageDialog-message-verbose {
   font-size: 1.1em;
   line-height: 1.5em;
   text-align: left;
 }
-
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
   border-right: solid 1px #e5e5e5;
 }
-
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child {
   border-right-width: 0;
 }
-
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
   border-bottom: solid 1px #e5e5e5;
 }
-
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child {
   border-bottom-width: 0;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labeledElement-label {
-  padding: 0 2em;
-  line-height: 3.4em;
   text-align: center;
+  line-height: 3.4em;
+  padding: 0 2em;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget:hover {
   background-color: rgba(0, 0, 0, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget:active {
   background-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover {
   background-color: rgba(8, 126, 204, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active {
   background-color: rgba(8, 126, 204, 0.1);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label {
   font-weight: bold;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover {
   background-color: rgba(118, 171, 54, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active {
   background-color: rgba(118, 171, 54, 0.1);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover {
   background-color: rgba(212, 83, 83, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active {
   background-color: rgba(212, 83, 83, 0.1);
 }
   height: 3.35em;
   border-bottom: 1px solid #dddddd;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-processDialog-content .oo-ui-window-body {
   top: 3.35em;
   padding: 2em 0;
 }
-
 .oo-ui-processDialog-navigation {
   position: relative;
   height: 3.35em;
   padding: 0 1em;
 }
-
 .oo-ui-processDialog-location {
-  height: 3.35em;
   padding: 0.25em 0;
-  text-align: center;
+  height: 3.35em;
   cursor: default;
+  text-align: center;
 }
-
 .oo-ui-processDialog-title {
   font-weight: bold;
   line-height: 1.85em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-buttonedElement-button {
+  padding: 0.35em 0.75em;
   min-width: 1.85em;
   min-height: 1.85em;
-  padding: 0.35em 0.75em;
   border: 1px solid #dddddd;
   border-radius: 4px;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-labeledElement-label {
+  line-height: 1.85em;
   padding: 0 1em;
   font-weight: bold;
-  line-height: 1.85em;
   color: #777777;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-iconedElement-icon,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-iconedElement-icon,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-iconedElement-icon {
   position: absolute;
   margin-top: -0.125em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
   vertical-align: middle;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-destructive .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-destructive .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-flaggableElement-destructive .oo-ui-buttonedElement-button {
   border: 1px solid transparent;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-destructive .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-destructive .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-flaggableElement-destructive .oo-ui-labeledElement-label {
   color: #d11d13;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-buttonedElement-button {
   padding: 0.75em 0.35em;
   border: none;
   border-radius: 0;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-buttonedElement-button {
   background-color: #347bff;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label {
   color: #ffffff;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
   left: 0.5em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-labeledElement-label {
   padding-left: 2.25em;
 }
-
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
   right: 0.5em;
 }
-
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-labeledElement-label {
   padding-right: 2.25em;
 }
-
 .oo-ui-processDialog-actions-other {
   position: absolute;
   bottom: 1em;
 }
-
 .oo-ui-processDialog > .oo-ui-window-frame {
   min-height: 5em;
 }
-
 .oo-ui-processDialog-errors {
+  background-color: rgba(255, 255, 255, 0.9);
   padding: 3em 3em 1.5em 3em;
   text-align: center;
-  background-color: rgba(255, 255, 255, 0.9);
 }
-
 .oo-ui-processDialog-errors .oo-ui-buttonWidget {
   margin: 2em 1em 2em 1em;
 }
-
 .oo-ui-processDialog-errors-title {
-  margin-bottom: 2em;
   font-size: 1.5em;
   color: #000;
+  margin-bottom: 2em;
 }
-
 .oo-ui-processDialog-error {
-  padding: 1em;
-  margin: 1em;
   text-align: left;
-  background-color: #fff7f7;
+  margin: 1em;
+  padding: 1em;
   border: solid 1px #ff9e9e;
+  background-color: #fff7f7;
   border-radius: 0.25em;
 }
 
   font-weight: bold;
   border-bottom: 1px solid #dddddd;
 }
-
 .oo-ui-optionWidget.oo-ui-indicatedElement .oo-ui-labeledElement-label {
   padding-right: 1.5em;
 }
-
 .oo-ui-optionWidget-level-0 {
   padding-left: 3.5em;
 }
-
 .oo-ui-optionWidget-level-0 .oo-ui-iconedElement-icon {
   left: 1em;
 }
-
 .oo-ui-optionWidget-level-1 {
   padding-left: 5em;
 }
-
 .oo-ui-optionWidget-level-1 .oo-ui-iconedElement-icon {
   left: 2.5em;
 }
-
 .oo-ui-optionWidget-level-2 {
   padding-left: 6.5em;
 }
-
 .oo-ui-optionWidget-level-2 .oo-ui-iconedElement-icon {
   left: 4em;
 }
 }
 
 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
-  color: #ffffff;
   background: #347bff;
+  color: #ffffff;
 }
-
 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
   background-size: 24px auto;
 }
 }
 
 /* Icons */
-
 .oo-ui-icon-check {
-  background: #347bff;
   background-image: /* @embed */ url(themes/agora/images/icons/check.svg);
-}
\ No newline at end of file
+  background: #347bff;
+}
index 88eac97..3f968c4 100644 (file)
 /*!
- * OOjs UI v0.1.0-pre (944c47c5fe)
+ * OOjs UI v0.1.0-pre (55b861b167)
  * https://www.mediawiki.org/wiki/OOjs_UI
  *
  * Copyright 2011–2014 OOjs Team and other contributors.
  * Released under the MIT license
  * http://oojs.mit-license.org
  *
- * Date: 2014-08-21T00:23:52Z
+ * Date: 2014-08-21T16:59:20Z
  */
 .oo-ui-dialog-content > .oo-ui-window-head,
 .oo-ui-dialog-content > .oo-ui-window-body,
 .oo-ui-dialog-content > .oo-ui-window-foot {
   position: absolute;
-  right: 0;
   left: 0;
+  right: 0;
   overflow: hidden;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-head {
-  top: 0;
   z-index: 1;
+  top: 0;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-body {
+  z-index: 2;
   top: 0;
   bottom: 0;
-  z-index: 2;
   box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25);
 }
-
 .oo-ui-dialog-content > .oo-ui-window-foot {
-  bottom: 0;
   z-index: 1;
+  bottom: 0;
 }
-
 .oo-ui-dialog-content > .oo-ui-window-overlay {
   z-index: 3;
 }
 
-.oo-ui-frame-content {
-  font-family: sans-serif;
-  font-size: 0.8em;
-}
-
 .oo-ui-toolbar-bar {
+  border-bottom: solid 1px #ccc;
   background: #f8fbfd;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#f1f7fb');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #f1f7fb));
   background-image: -webkit-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
   background-image: -moz-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
   background-image: -ms-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
   background-image: -o-linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
   background-image: linear-gradient(top, #ffffff 0%, #f1f7fb 100%);
-  border-bottom: solid 1px #ccc;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#f1f7fb');
 }
-
 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
-  background: none;
   border: none;
+  background: none;
 }
-
 .oo-ui-toolbar-shadow {
+  background-image: /* @embed */ url(images/toolbar-shadow.png);
   bottom: -9px;
   height: 9px;
-  background-image: /* @embed */ url(images/toolbar-shadow.png);
   opacity: 0.125;
   -webkit-transition: opacity 500ms ease-in-out;
-     -moz-transition: opacity 500ms ease-in-out;
-      -ms-transition: opacity 500ms ease-in-out;
-       -o-transition: opacity 500ms ease-in-out;
-          transition: opacity 500ms ease-in-out;
+  -moz-transition: opacity 500ms ease-in-out;
+  -ms-transition: opacity 500ms ease-in-out;
+  -o-transition: opacity 500ms ease-in-out;
+  transition: opacity 500ms ease-in-out;
 }
 
 .oo-ui-toolGroup {
-  border: solid 1px transparent;
   border-radius: 0.25em;
+  border: solid 1px transparent;
   -webkit-transition: border-color 300ms ease-in-out;
-     -moz-transition: border-color 300ms ease-in-out;
-      -ms-transition: border-color 300ms ease-in-out;
-       -o-transition: border-color 300ms ease-in-out;
-          transition: border-color 300ms ease-in-out;
+  -moz-transition: border-color 300ms ease-in-out;
+  -ms-transition: border-color 300ms ease-in-out;
+  -o-transition: border-color 300ms ease-in-out;
+  transition: border-color 300ms ease-in-out;
 }
-
 .oo-ui-toolGroup.oo-ui-widget-enabled:hover {
   border-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-toolGroup.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
   color: #000;
 }
 
-.oo-ui-window-content {
+.oo-ui-window-isolated.oo-ui-window-content {
+  font-family: sans-serif;
+  font-size: 0.8em;
   background: transparent;
 }
-
-.oo-ui-window-overlay {
+.oo-ui-window-isolated.oo-ui-window-overlay {
   font-family: sans-serif;
-  font-size: 1em;
   line-height: 1.5em;
+  font-size: 1em;
 }
 
 .oo-ui-windowManager-modal > .oo-ui-dialog {
   background-color: rgba(255, 255, 255, 0.5);
   opacity: 0;
   -webkit-transition: opacity 250ms ease-in-out;
-     -moz-transition: opacity 250ms ease-in-out;
-      -ms-transition: opacity 250ms ease-in-out;
-       -o-transition: opacity 250ms ease-in-out;
-          transition: opacity 250ms ease-in-out;
+  -moz-transition: opacity 250ms ease-in-out;
+  -ms-transition: opacity 250ms ease-in-out;
+  -o-transition: opacity 250ms ease-in-out;
+  transition: opacity 250ms ease-in-out;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
   top: 1em;
   bottom: 1em;
   background-color: #fff;
   -webkit-transform: scale(0.5);
-     -moz-transform: scale(0.5);
-      -ms-transform: scale(0.5);
-       -o-transform: scale(0.5);
-          transform: scale(0.5);
+  -moz-transform: scale(0.5);
+  -ms-transform: scale(0.5);
+  -o-transform: scale(0.5);
+  transform: scale(0.5);
   -webkit-transition: all 250ms ease-in-out;
-     -moz-transition: all 250ms ease-in-out;
-      -ms-transition: all 250ms ease-in-out;
-       -o-transition: all 250ms ease-in-out;
-          transition: all 250ms ease-in-out;
+  -moz-transition: all 250ms ease-in-out;
+  -ms-transition: all 250ms ease-in-out;
+  -o-transition: all 250ms ease-in-out;
+  transition: all 250ms ease-in-out;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready {
   opacity: 1;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready > .oo-ui-window-frame {
   -webkit-transform: scale(1);
-     -moz-transform: scale(1);
-      -ms-transform: scale(1);
-       -o-transform: scale(1);
-          transform: scale(1);
+  -moz-transform: scale(1);
+  -ms-transform: scale(1);
+  -o-transform: scale(1);
+  transform: scale(1);
 }
-
 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
   border: solid 1px #ccc;
   border-radius: 0.5em;
 .oo-ui-messageDialog-content .oo-ui-window-body {
   box-shadow: 0 0 0.33em rgba(0, 0, 0, 0.33);
 }
-
 .oo-ui-messageDialog-title,
 .oo-ui-messageDialog-message {
   display: block;
-  padding-top: 0.5em;
   text-align: center;
+  padding-top: 0.5em;
 }
-
 .oo-ui-messageDialog-title {
   font-size: 1.5em;
   line-height: 1em;
   color: #000;
 }
-
 .oo-ui-messageDialog-message {
   font-size: 0.9em;
   line-height: 1.25em;
   color: #666;
 }
-
 .oo-ui-messageDialog-message-verbose {
   font-size: 1.1em;
   line-height: 1.5em;
   text-align: left;
 }
-
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
   border-right: solid 1px #e5e5e5;
 }
-
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child {
   border-right-width: 0;
 }
-
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
   border-bottom: solid 1px #e5e5e5;
 }
-
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child {
   border-bottom-width: 0;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labeledElement-label {
-  padding: 0 2em;
-  line-height: 3.4em;
   text-align: center;
+  line-height: 3.4em;
+  padding: 0 2em;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget:hover {
   background-color: rgba(0, 0, 0, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget:active {
   background-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover {
   background-color: rgba(8, 126, 204, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active {
   background-color: rgba(8, 126, 204, 0.1);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label {
   font-weight: bold;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover {
   background-color: rgba(118, 171, 54, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active {
   background-color: rgba(118, 171, 54, 0.1);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover {
   background-color: rgba(212, 83, 83, 0.05);
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active {
   background-color: rgba(212, 83, 83, 0.1);
 }
 .oo-ui-processDialog-content .oo-ui-window-head {
   height: 3.4em;
 }
-
 .oo-ui-processDialog-content .oo-ui-window-body {
   top: 3.4em;
   box-shadow: 0 0 0.33em rgba(0, 0, 0, 0.33);
 }
-
 .oo-ui-processDialog-navigation {
   position: relative;
   height: 3.4em;
   padding: 0 1em;
 }
-
 .oo-ui-processDialog-location {
-  height: 1.9em;
   padding: 0.25em 0;
-  text-align: center;
+  height: 1.9em;
   cursor: default;
+  text-align: center;
 }
-
 .oo-ui-processDialog-title {
   font-weight: bold;
   line-height: 1.9em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-buttonedElement-button {
-  min-width: 1.9em;
-  min-height: 1.9em;
   padding-top: 0.75em;
   padding-bottom: 0.75em;
+  min-width: 1.9em;
+  min-height: 1.9em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-labeledElement-label {
-  padding: 0 1em;
   line-height: 1.9em;
+  padding: 0 1em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget .oo-ui-iconedElement-icon,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget .oo-ui-iconedElement-icon,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-iconedElement-icon {
   position: absolute;
   margin-top: -0.125em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonedElement-framed {
   margin: 0.75em 0 0.75em 0.75em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
   padding: 0;
   vertical-align: middle;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget:hover,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:hover {
   background-color: rgba(0, 0, 0, 0.05);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget:active,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:active {
   background-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed {
   margin: 0.75em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
   /* Adjust for border so text aligns with title */
-
   margin: -1px;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary:hover {
   background-color: rgba(8, 126, 204, 0.05);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary:active {
   background-color: rgba(8, 126, 204, 0.1);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-primary .oo-ui-labeledElement-label {
   font-weight: bold;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:hover {
   background-color: rgba(118, 171, 54, 0.05);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-constructive:active {
   background-color: rgba(118, 171, 54, 0.1);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:hover {
   background-color: rgba(212, 83, 83, 0.05);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggableElement-destructive:active {
   background-color: rgba(212, 83, 83, 0.1);
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
   left: 0.5em;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-labeledElement-label {
   padding-left: 2.25em;
 }
-
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
   right: 0.5em;
 }
-
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-labeledElement-label {
   padding-right: 2.25em;
 }
-
 .oo-ui-processDialog > .oo-ui-window-frame {
   min-height: 5em;
 }
-
 .oo-ui-processDialog-errors {
+  background-color: rgba(255, 255, 255, 0.9);
   padding: 3em 3em 1.5em 3em;
   text-align: center;
-  background-color: rgba(255, 255, 255, 0.9);
 }
-
 .oo-ui-processDialog-errors .oo-ui-buttonWidget {
   margin: 2em 1em 2em 1em;
 }
-
 .oo-ui-processDialog-errors-title {
-  margin-bottom: 2em;
   font-size: 1.5em;
   color: #000;
+  margin-bottom: 2em;
 }
-
 .oo-ui-processDialog-error {
-  padding: 1em;
-  margin: 1em;
   text-align: left;
-  background-color: #fff7f7;
+  margin: 1em;
+  padding: 1em;
   border: solid 1px #ff9e9e;
+  background-color: #fff7f7;
   border-radius: 0.25em;
 }
 
 .oo-ui-buttonedElement > .oo-ui-buttonedElement-button {
   color: #333;
 }
-
 .oo-ui-buttonedElement.oo-ui-indicatedElement > .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 .oo-ui-buttonedElement.oo-ui-iconedElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
+  opacity: 0.8;
   width: 1.9em;
   height: 1.9em;
-  opacity: 0.8;
 }
-
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
   /* Don't animate opacities for now, causes wiggling in Chrome (bug 63020) */
-
   /*.oo-ui-transition(opacity 200ms);*/
-
 }
-
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:hover > .oo-ui-iconedElement-icon,
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:focus > .oo-ui-iconedElement-icon {
   opacity: 1;
 }
-
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:hover > .oo-ui-labeledElement-label,
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button:focus > .oo-ui-labeledElement-label {
   color: #000;
 }
-
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   color: #333;
 }
-
 .oo-ui-buttonedElement-frameless.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   color: #087ecc;
 }
-
 .oo-ui-buttonedElement-frameless.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   color: #76ab36;
 }
-
 .oo-ui-buttonedElement-frameless.oo-ui-flaggableElement-destructive > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   color: #d45353;
 }
-
 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
   opacity: 0.2;
 }
-
 .oo-ui-buttonedElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   color: #ccc;
 }
-
 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button {
-  padding: 0.2em 0.8em;
   margin: 0.1em 0;
+  padding: 0.2em 0.8em;
+  border-radius: 0.3em;
   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
+  border: 1px #c9c9c9 solid;
+  -webkit-transition: border-color 100ms ease-in-out;
+  -moz-transition: border-color 100ms ease-in-out;
+  -ms-transition: border-color 100ms ease-in-out;
+  -o-transition: border-color 100ms ease-in-out;
+  transition: border-color 100ms ease-in-out;
   background: #eeeeee;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
   background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
-  border: 1px #c9c9c9 solid;
-  border-radius: 0.3em;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
-  -webkit-transition: border-color 100ms ease-in-out;
-     -moz-transition: border-color 100ms ease-in-out;
-      -ms-transition: border-color 100ms ease-in-out;
-       -o-transition: border-color 100ms ease-in-out;
-          transition: border-color 100ms ease-in-out;
 }
-
 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button:hover,
 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button:focus {
   border-color: #aaa;
 }
-
-.oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
-.oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
+.oo-ui-buttonedElement-framed.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button,
+.oo-ui-buttonedElement-framed.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button {
+  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
   color: black;
+  border-color: #c9c9c9;
   background: #eeeeee;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #dddddd), color-stop(100%, #ffffff));
   background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
-  border-color: #c9c9c9;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
-  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-iconedElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
-  margin-right: -0.5em;
   margin-left: -0.5em;
+  margin-right: -0.5em;
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-iconedElement.oo-ui-labeledElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
-  margin-right: 0.3em;
   margin-left: -0.5em;
+  margin-right: 0.3em;
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button {
+  border: solid 1px #a6cee1;
   background: #cde7f4;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#eaf4fa', endColorstr='#b0d9ee');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #eaf4fa), color-stop(100%, #b0d9ee));
   background-image: -webkit-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
   background-image: -moz-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
   background-image: -ms-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
   background-image: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
   background-image: linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%);
-  border: solid 1px #a6cee1;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#eaf4fa', endColorstr='#b0d9ee');
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button:hover,
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button:focus {
   border-color: #9dc2d4;
 }
-
-.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
-.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
+.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button,
+.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-primary.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button {
+  border: solid 1px #a6cee1;
   background: #cde7f4;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #b0d9ee), color-stop(100%, #eaf4fa));
   background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
-  border: solid 1px #a6cee1;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button {
+  border: solid 1px #b8d892;
   background: #daf0be;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f0fbe1', endColorstr='#c3e59a');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f0fbe1), color-stop(100%, #c3e59a));
   background-image: -webkit-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
   background-image: -moz-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
   background-image: -ms-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
   background-image: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
   background-image: linear-gradient(top, #f0fbe1 0%, #c3e59a 100%);
-  border: solid 1px #b8d892;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f0fbe1', endColorstr='#c3e59a');
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button:hover,
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button:focus {
   border-color: #adcb89;
 }
-
-.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
-.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
+.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button,
+.oo-ui-buttonedElement-framed.oo-ui-flaggableElement-constructive.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button {
+  border: solid 1px #b8d892;
   background: #daf0be;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#c3e59a', endColorstr='#f0fbe1');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #c3e59a), color-stop(100%, #f0fbe1));
   background-image: -webkit-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
   background-image: -moz-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
   background-image: -ms-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
   background-image: -o-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
   background-image: linear-gradient(top, #c3e59a 0%, #f0fbe1 100%);
-  border: solid 1px #b8d892;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#c3e59a', endColorstr='#f0fbe1');
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-flaggableElement-destructive > .oo-ui-buttonedElement-button {
   color: #d45353;
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button,
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button {
+  opacity: 0.5;
+  box-shadow: none;
   color: #333;
   background: #eee;
   border-color: #ccc;
-  opacity: 0.5;
-  box-shadow: none;
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button:hover,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active:hover,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed:hover,
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button:hover,
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button:hover,
 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button:focus,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active:focus,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed:focus {
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button:focus,
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button:focus {
   border-color: #ccc;
   box-shadow: none;
 }
 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
   padding: 1.5em;
 }
-
 .oo-ui-bookletLayout-outlinePanel {
   border-right: solid 1px #ddd;
 }
-
 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
   box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25);
 }
 .oo-ui-fieldsetLayout {
   border: none;
 }
-
 .oo-ui-fieldsetLayout > .oo-ui-labeledElement-label {
   font-size: 1.5em;
 }
   margin: -1px 0 -1px -1px;
   border: solid 1px transparent;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool:first-child {
-  border-bottom-left-radius: 0.25em;
   border-top-left-radius: 0.25em;
+  border-bottom-left-radius: 0.25em;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool:last-child {
   margin-right: -1px;
   border-top-right-radius: 0.25em;
   border-bottom-right-radius: 0.25em;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.8;
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled:hover {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-active.oo-ui-widget-enabled {
+  border-color: rgba(0, 0, 0, 0.2);
+  box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
   background: #f8fbfd;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
-  border-color: rgba(0, 0, 0, 0.2);
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
-  box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
   border-left-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.2;
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.8;
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 1;
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.2;
 }
 .oo-ui-listToolGroup.oo-ui-popupToolGroup-active {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-listToolGroup .oo-ui-tool {
-  margin: -1px 0;
   border: solid 1px transparent;
+  margin: -1px 0;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
+  border-color: rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
   background: #f8fbfd;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
-  border-color: rgba(0, 0, 0, 0.1);
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
-  box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 }
-
 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
   border-top-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.8;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 1;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
   color: #ccc;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.2;
 }
-
 .oo-ui-listToolGroup.oo-ui-widget-disabled {
   color: #ccc;
 }
-
 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatedElement-indicator,
 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconedElement-icon {
   opacity: 0.2;
 .oo-ui-menuToolGroup {
   border-color: rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-menuToolGroup.oo-ui-widget-enabled:hover {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-menuToolGroup.oo-ui-popupToolGroup-active {
   border-color: rgba(0, 0, 0, 0.25);
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
   background-color: #e1f3ff;
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
   color: #ccc;
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconedElement-icon {
   opacity: 0.2;
 }
-
 .oo-ui-menuToolGroup.oo-ui-widget-disabled {
   color: #ccc;
   border-color: rgba(0, 0, 0, 0.05);
 }
-
 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatedElement-indicator,
 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconedElement-icon {
   opacity: 0.2;
 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
   opacity: 0.8;
 }
-
 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
-  background-color: white;
   border: solid 1px #ccc;
+  background-color: white;
   box-shadow: 0 0.25em 1em rgba(0, 0, 0, 0.25);
 }
-
 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
   background: #f8fbfd;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #f1f7fb), color-stop(100%, #ffffff));
   background-image: -webkit-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -moz-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -ms-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
   background-image: linear-gradient(top, #f1f7fb 0%, #ffffff 100%);
-  border-bottom-right-radius: 0;
-  border-bottom-left-radius: 0;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#f1f7fb', endColorstr='#ffffff');
-  box-shadow: inset 0 0.07em 0.07em 0 rgba(0, 0, 0, 0.07);
 }
 
 .oo-ui-optionWidget {
   padding: 0.5em 2em 0.5em 3em;
 }
-
 .oo-ui-optionWidget-highlighted {
   background-color: #e1f3ff;
 }
-
 .oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected {
   background-color: #a7dcff;
 }
-
 .oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed {
   background-color: #a7dcff;
 }
-
 .oo-ui-optionWidget.oo-ui-widget-disabled {
   color: #ccc;
 }
 
 .oo-ui-menuWidget {
-  margin-top: -1px;
   background: #fff;
+  margin-top: -1px;
   border: solid 1px #ccc;
   border-radius: 0 0 0.25em 0.25em;
   box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2);
 }
 
 .oo-ui-popupWidget-popup {
-  background-color: #fff;
   border: solid 1px #ccc;
   border-radius: 0.25em;
+  background-color: #fff;
   box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor {
+  background-image: /* @embed */ url(images/anchor.svg);
   width: 15px;
   height: 8px;
   margin-left: -7px;
-  background-image: /* @embed */ url(images/anchor.svg);
 }
-
 .oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup {
   -webkit-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
-     -moz-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
-      -ms-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
-       -o-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
-          transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
+  -moz-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
+  -ms-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
+  -o-transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
+  transition: width 100ms ease-in-out, height 100ms ease-in-out, left 100ms ease-in-out;
 }
-
 .oo-ui-popupWidget-body {
   box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25);
 }
 .oo-ui-buttonOptionWidget {
   padding: 0;
 }
-
 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected,
 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed,
 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted {
 .oo-ui-buttonSelectWidget {
   border-radius: 0.3em;
 }
-
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
-  margin-left: -1px;
   border-radius: 0;
+  margin-left: -1px;
 }
-
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonedElement-button {
-  margin-left: 0;
   border-bottom-left-radius: 0.3em;
   border-top-left-radius: 0.3em;
+  margin-left: 0;
 }
-
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonedElement-button {
-  border-top-right-radius: 0.3em;
   border-bottom-right-radius: 0.3em;
+  border-top-right-radius: 0.3em;
 }
 
 .oo-ui-comboBoxWidget-handle {
   border: solid 1px rgba(0, 0, 0, 0.1);
   border-radius: 0.25em;
 }
-
 .oo-ui-comboBoxWidget-handle:hover {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-comboBoxWidget.oo-ui-widget-disabled .oo-ui-textInputWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator,
 .oo-ui-comboBoxWidget-empty .oo-ui-textInputWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
   cursor: default;
   border: solid 1px rgba(0, 0, 0, 0.1);
   border-radius: 0.25em;
 }
-
 .oo-ui-inlineMenuWidget-handle:hover {
   border-color: rgba(0, 0, 0, 0.2);
 }
-
 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
   opacity: 0.8;
 }
-
 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
   color: #ccc;
   text-shadow: 0 1px 1px #fff;
-  background-color: #f3f3f3;
   border-color: #ddd;
+  background-color: #f3f3f3;
 }
-
 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-indicatedElement-indicator {
   opacity: 0.2;
 }
 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
   background-color: transparent;
 }
-
 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted,
 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
   background-color: #e1f3ff;
 .oo-ui-outlineControlsWidget {
   background-color: #fff;
 }
-
 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
   opacity: 0.2;
 }
 .oo-ui-outlineItemWidget {
   font-size: 1.1em;
 }
-
 .oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-labeledElement-label {
   padding-right: 1.5em;
 }
-
 .oo-ui-outlineItemWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
   opacity: 0.5;
 }
-
 .oo-ui-outlineItemWidget-level-0 {
   padding-left: 3.5em;
 }
-
 .oo-ui-outlineItemWidget-level-0 .oo-ui-iconedElement-icon {
   left: 1em;
 }
-
 .oo-ui-outlineItemWidget-level-1 {
   padding-left: 5em;
 }
-
 .oo-ui-outlineItemWidget-level-1 .oo-ui-iconedElement-icon {
   left: 2.5em;
 }
-
 .oo-ui-outlineItemWidget-level-2 {
   padding-left: 6.5em;
 }
-
 .oo-ui-outlineItemWidget-level-2 .oo-ui-iconedElement-icon {
   left: 4em;
 }
-
 .oo-ui-selectWidget-depressed .oo-ui-outlineItemWidget.oo-ui-optionWidget-selected {
-  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
   background-color: #a7dcff;
+  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
 }
-
 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-important {
   font-weight: bold;
 }
-
 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-placeholder {
   font-style: italic;
 }
-
 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-iconedElement-icon {
   opacity: 0.5;
 }
-
 .oo-ui-outlineItemWidget.oo-ui-flaggableElement-empty .oo-ui-labeledElement-label {
   color: #777;
 }
 .oo-ui-textInputWidget {
   width: 20em;
 }
-
 .oo-ui-textInputWidget input,
 .oo-ui-textInputWidget textarea {
   padding: 0.5em;
-  font-family: sans-serif;
   font-size: 1em;
+  font-family: sans-serif;
   background-color: #fff;
   border: solid 1px #ccc;
-  border-radius: 0.25em;
   box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
+  border-radius: 0.25em;
   -webkit-transition: border-color 200ms, box-shadow 200ms;
-     -moz-transition: border-color 200ms, box-shadow 200ms;
-      -ms-transition: border-color 200ms, box-shadow 200ms;
-       -o-transition: border-color 200ms, box-shadow 200ms;
-          transition: border-color 200ms, box-shadow 200ms;
+  -moz-transition: border-color 200ms, box-shadow 200ms;
+  -ms-transition: border-color 200ms, box-shadow 200ms;
+  -o-transition: border-color 200ms, box-shadow 200ms;
+  transition: border-color 200ms, box-shadow 200ms;
 }
-
 .oo-ui-textInputWidget-decorated input,
 .oo-ui-textInputWidget-decorated textarea {
   padding-left: 2em;
 }
-
 .oo-ui-textInputWidget-icon {
   width: 2em;
 }
-
 .oo-ui-textInputWidget.oo-ui-widget-enabled input:focus,
 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
-  border-color: #a7dcff;
   outline: none;
+  border-color: #a7dcff;
   box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white;
 }
-
 .oo-ui-textInputWidget input[readonly],
 .oo-ui-textInputWidget textarea[readonly] {
   color: #777;
   text-shadow: 0 1px 1px #fff;
 }
-
 .oo-ui-textInputWidget-pending input,
 .oo-ui-textInputWidget-pending textarea {
   background-color: transparent;
 }
-
 .oo-ui-textInputWidget.oo-ui-widget-disabled input,
 .oo-ui-textInputWidget.oo-ui-widget-disabled input:focus,
 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea,
 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea:focus {
   color: #ccc;
   text-shadow: 0 1px 1px #fff;
-  background-color: #f3f3f3;
   border-color: #ddd;
+  background-color: #f3f3f3;
 }
-
 .oo-ui-textInputWidget .oo-ui-iconedElement-icon,
 .oo-ui-textInputWidget .oo-ui-indicatedElement-indicator {
   opacity: 0.8;
 }
-
 .oo-ui-textInputWidget.oo-ui-iconedElement input,
 .oo-ui-textInputWidget.oo-ui-iconedElement textarea {
   padding-left: 2em;
 }
-
 .oo-ui-textInputWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon {
   width: 2em;
   background-position: right center;
 }
-
 .oo-ui-textInputWidget.oo-ui-indicatedElement input,
 .oo-ui-textInputWidget.oo-ui-indicatedElement textarea {
   padding-right: 1.5em;
 }
-
 .oo-ui-textInputWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
   width: 1.5em;
   background-position: left center;
 }
 
 .oo-ui-toggleSwitchWidget {
+  border-radius: 1em;
+  box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
+  border: solid 1px #ccc;
   background: #eeeeee;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #dddddd), color-stop(100%, #ffffff));
   background-image: -webkit-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: -moz-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: -ms-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%);
   background-image: linear-gradient(top, #dddddd 0%, #ffffff 100%);
-  border: solid 1px #ccc;
-  border-radius: 1em;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#dddddd', endColorstr='#ffffff');
-  box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #ddd;
 }
-
 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
   opacity: 0.5;
 }
-
 .oo-ui-toggleSwitchWidget-grip {
+  border-radius: 1em;
+  box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
+  border: 1px #c9c9c9 solid;
   background: #eeeeee;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #ffffff), color-stop(100%, #dddddd));
   background-image: -webkit-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: -ms-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%);
   background-image: linear-gradient(top, #ffffff 0%, #dddddd 100%);
-  border: 1px #c9c9c9 solid;
-  border-radius: 1em;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#dddddd');
-  box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1);
 }
-
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover,
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
   border-color: #aaa;
 }
-
 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
+  border-radius: 1em;
+  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
   background: #cde7f4;
+  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
   background-image: -webkit-gradient(linear, right top, right bottom, color-stop(0%, #b0d9ee), color-stop(100%, #eaf4fa));
   background-image: -webkit-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: -moz-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: -ms-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
   background-image: linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%);
-  border-radius: 1em;
-  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#b0d9ee', endColorstr='#eaf4fa');
-  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07);
 }
-
 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow {
   opacity: 1;
 }
-
 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
   display: block;
   opacity: 0;
-}
\ No newline at end of file
+}
index 2483c9e..a0811d4 100644 (file)
@@ -1,12 +1,12 @@
 /*!
- * OOjs UI v0.1.0-pre (944c47c5fe)
+ * OOjs UI v0.1.0-pre (55b861b167)
  * https://www.mediawiki.org/wiki/OOjs_UI
  *
  * Copyright 2011–2014 OOjs Team and other contributors.
  * Released under the MIT license
  * http://oojs.mit-license.org
  *
- * Date: 2014-08-21T00:23:52Z
+ * Date: 2014-08-21T16:59:20Z
  */
 ( function ( OO ) {
 
@@ -654,18 +654,19 @@ OO.ui.Element.static.tagName = 'div';
  *
  * @static
  * @param {jQuery|HTMLElement|HTMLDocument|Window} context Context to bind the function to
- * @param {OO.ui.Frame} [frame] Frame of the document context
+ * @param {jQuery} [$iframe] HTML iframe element that contains the document, omit if document is
+ *   not in an iframe
  * @return {Function} Bound jQuery function
  */
-OO.ui.Element.getJQuery = function ( context, frame ) {
+OO.ui.Element.getJQuery = function ( context, $iframe ) {
        function wrapper( selector ) {
                return $( selector, wrapper.context );
        }
 
        wrapper.context = this.getDocument( context );
 
-       if ( frame ) {
-               wrapper.frame = frame;
+       if ( $iframe ) {
+               wrapper.$iframe = $iframe;
        }
 
        return wrapper;
@@ -1094,271 +1095,6 @@ OO.ui.Element.prototype.offDOMEvent = function ( event, callback ) {
        };
 }() );
 
-/**
- * Embedded iframe with the same styles as its parent.
- *
- * @class
- * @extends OO.ui.Element
- * @mixins OO.EventEmitter
- *
- * @constructor
- * @param {Object} [config] Configuration options
- */
-OO.ui.Frame = function OoUiFrame( config ) {
-       // Parent constructor
-       OO.ui.Frame.super.call( this, config );
-
-       // Mixin constructors
-       OO.EventEmitter.call( this );
-
-       // Properties
-       this.loading = null;
-       this.config = config;
-       this.dir = null;
-
-       // Initialize
-       this.$element
-               .addClass( 'oo-ui-frame' )
-               .attr( { frameborder: 0, scrolling: 'no' } );
-
-};
-
-/* Setup */
-
-OO.inheritClass( OO.ui.Frame, OO.ui.Element );
-OO.mixinClass( OO.ui.Frame, OO.EventEmitter );
-
-/* Static Properties */
-
-/**
- * @static
- * @inheritdoc
- */
-OO.ui.Frame.static.tagName = 'iframe';
-
-/* Events */
-
-/**
- * @event load
- */
-
-/* Static Methods */
-
-/**
- * Transplant the CSS styles from as parent document to a frame's document.
- *
- * This loops over the style sheets in the parent document, and copies their nodes to the
- * frame's document. It then polls the document to see when all styles have loaded, and once they
- * have, resolves the promise.
- *
- * If the styles still haven't loaded after a long time (5 seconds by default), we give up waiting
- * and resolve the promise anyway. This protects against cases like a display: none; iframe in
- * Firefox, where the styles won't load until the iframe becomes visible.
- *
- * For details of how we arrived at the strategy used in this function, see #load.
- *
- * @static
- * @inheritable
- * @param {HTMLDocument} parentDoc Document to transplant styles from
- * @param {HTMLDocument} frameDoc Document to transplant styles to
- * @param {number} [timeout=5000] How long to wait before giving up (in ms). If 0, never give up.
- * @return {jQuery.Promise} Promise resolved when styles have loaded
- */
-OO.ui.Frame.static.transplantStyles = function ( parentDoc, frameDoc, timeout ) {
-       var i, numSheets, styleNode, styleText, newNode, timeoutID, pollNodeId, $pendingPollNodes,
-               $pollNodes = $( [] ),
-               // Fake font-family value
-               fontFamily = 'oo-ui-frame-transplantStyles-loaded',
-               nextIndex = parentDoc.oouiFrameTransplantStylesNextIndex || 0,
-               deferred = $.Deferred();
-
-       for ( i = 0, numSheets = parentDoc.styleSheets.length; i < numSheets; i++ ) {
-               styleNode = parentDoc.styleSheets[i].ownerNode;
-               if ( styleNode.disabled ) {
-                       continue;
-               }
-
-               if ( styleNode.nodeName.toLowerCase() === 'link' ) {
-                       // External stylesheet; use @import
-                       styleText = '@import url(' + styleNode.href + ');';
-               } else {
-                       // Internal stylesheet; just copy the text
-                       styleText = styleNode.textContent;
-               }
-
-               // Create a node with a unique ID that we're going to monitor to see when the CSS
-               // has loaded
-               if ( styleNode.oouiFrameTransplantStylesId ) {
-                       // If we're nesting transplantStyles operations and this node already has
-                       // a CSS rule to wait for loading, reuse it
-                       pollNodeId = styleNode.oouiFrameTransplantStylesId;
-               } else {
-                       // Otherwise, create a new ID
-                       pollNodeId = 'oo-ui-frame-transplantStyles-loaded-' + nextIndex;
-                       nextIndex++;
-
-                       // Add #pollNodeId { font-family: ... } to the end of the stylesheet / after the @import
-                       // The font-family rule will only take effect once the @import finishes
-                       styleText += '\n' + '#' + pollNodeId + ' { font-family: ' + fontFamily + '; }';
-               }
-
-               // Create a node with id=pollNodeId
-               $pollNodes = $pollNodes.add( $( '<div>', frameDoc )
-                       .attr( 'id', pollNodeId )
-                       .appendTo( frameDoc.body )
-               );
-
-               // Add our modified CSS as a <style> tag
-               newNode = frameDoc.createElement( 'style' );
-               newNode.textContent = styleText;
-               newNode.oouiFrameTransplantStylesId = pollNodeId;
-               frameDoc.head.appendChild( newNode );
-       }
-       frameDoc.oouiFrameTransplantStylesNextIndex = nextIndex;
-
-       // Poll every 100ms until all external stylesheets have loaded
-       $pendingPollNodes = $pollNodes;
-       timeoutID = setTimeout( function pollExternalStylesheets() {
-               while (
-                       $pendingPollNodes.length > 0 &&
-                       $pendingPollNodes.eq( 0 ).css( 'font-family' ) === fontFamily
-               ) {
-                       $pendingPollNodes = $pendingPollNodes.slice( 1 );
-               }
-
-               if ( $pendingPollNodes.length === 0 ) {
-                       // We're done!
-                       if ( timeoutID !== null ) {
-                               timeoutID = null;
-                               $pollNodes.remove();
-                               deferred.resolve();
-                       }
-               } else {
-                       timeoutID = setTimeout( pollExternalStylesheets, 100 );
-               }
-       }, 100 );
-       // ...but give up after a while
-       if ( timeout !== 0 ) {
-               setTimeout( function () {
-                       if ( timeoutID ) {
-                               clearTimeout( timeoutID );
-                               timeoutID = null;
-                               $pollNodes.remove();
-                               deferred.reject();
-                       }
-               }, timeout || 5000 );
-       }
-
-       return deferred.promise();
-};
-
-/* Methods */
-
-/**
- * Load the frame contents.
- *
- * Once the iframe's stylesheets are loaded, the `load` event will be emitted and the returned
- * promise will be resolved. Calling while loading will return a promise but not trigger a new
- * loading cycle. Calling after loading is complete will return a promise that's already been
- * resolved.
- *
- * Sounds simple right? Read on...
- *
- * When you create a dynamic iframe using open/write/close, the window.load event for the
- * iframe is triggered when you call close, and there's no further load event to indicate that
- * everything is actually loaded.
- *
- * In Chrome, stylesheets don't show up in document.styleSheets until they have loaded, so we could
- * just poll that array and wait for it to have the right length. However, in Firefox, stylesheets
- * are added to document.styleSheets immediately, and the only way you can determine whether they've
- * loaded is to attempt to access .cssRules and wait for that to stop throwing an exception. But
- * cross-domain stylesheets never allow .cssRules to be accessed even after they have loaded.
- *
- * The workaround is to change all `<link href="...">` tags to `<style>@import url(...)</style>` tags.
- * Because `@import` is blocking, Chrome won't add the stylesheet to document.styleSheets until
- * the `@import` has finished, and Firefox won't allow .cssRules to be accessed until the `@import`
- * has finished. And because the contents of the `<style>` tag are from the same origin, accessing
- * .cssRules is allowed.
- *
- * However, now that we control the styles we're injecting, we might as well do away with
- * browser-specific polling hacks like document.styleSheets and .cssRules, and instead inject
- * `<style>@import url(...); #foo { font-family: someValue; }</style>`, then create `<div id="foo">`
- * and wait for its font-family to change to someValue. Because `@import` is blocking, the font-family
- * rule is not applied until after the `@import` finishes.
- *
- * All this stylesheet injection and polling magic is in #transplantStyles.
- *
- * @return {jQuery.Promise} Promise resolved when loading is complete
- * @fires load
- */
-OO.ui.Frame.prototype.load = function () {
-       var win, doc,
-               frame = this;
-
-       // Return existing promise if already loading or loaded
-       if ( this.loading ) {
-               return this.loading.promise();
-       }
-
-       // Load the frame
-       this.loading = $.Deferred();
-
-       win = this.$element.prop( 'contentWindow' );
-       doc = win.document;
-
-       // Cache directionality
-       this.dir = OO.ui.Element.getDir( this.$element ) || 'ltr';
-
-       // Initialize contents
-       doc.open();
-       // The following classes can be used here:
-       // oo-ui-ltr
-       // oo-ui-rtl
-       doc.write(
-               '<!doctype html>' +
-               '<html>' +
-                       '<body class="oo-ui-frame-content oo-ui-' + this.getDir() + '" dir="' + this.getDir() + '">' +
-                       '</body>' +
-               '</html>'
-       );
-       doc.close();
-
-       // Properties
-       this.$ = OO.ui.Element.getJQuery( doc, this );
-       this.$content = this.$( '.oo-ui-frame-content' ).attr( 'tabIndex', 0 );
-       this.$document = this.$( doc );
-
-       // Initialization
-       this.constructor.static.transplantStyles( this.getElementDocument(), this.$document[0] )
-               .always( function () {
-                       frame.emit( 'load' );
-                       frame.loading.resolve();
-               } );
-
-       return this.loading.promise();
-};
-
-/**
- * Set the size of the frame.
- *
- * @param {number} width Frame width in pixels
- * @param {number} height Frame height in pixels
- * @chainable
- */
-OO.ui.Frame.prototype.setSize = function ( width, height ) {
-       this.$element.css( { width: width, height: height } );
-       return this;
-};
-
-/**
- * Get the directionality of the frame
- *
- * @return {string} Directionality, 'ltr' or 'rtl'
- */
-OO.ui.Frame.prototype.getDir = function () {
-       return this.dir;
-};
-
 /**
  * Container for elements.
  *
@@ -1546,15 +1282,12 @@ OO.ui.Widget.prototype.updateDisabled = function () {
  * If the requested size is not recognized, the window manager will choose a sensible fallback.
  *
  * @constructor
- * @param {OO.ui.WindowManager} manager Manager of window
  * @param {Object} [config] Configuration options
  * @cfg {string} [size] Symbolic name of dialog size, `small`, `medium`, `large` or `full`; omit to
  *   use #static-size
  * @fires initialize
  */
-OO.ui.Window = function OoUiWindow( manager, config ) {
-       var win = this;
-
+OO.ui.Window = function OoUiWindow( config ) {
        // Configuration initialization
        config = config || {};
 
@@ -1564,46 +1297,25 @@ OO.ui.Window = function OoUiWindow( manager, config ) {
        // Mixin constructors
        OO.EventEmitter.call( this );
 
-       if ( !( manager instanceof OO.ui.WindowManager ) ) {
-               throw new Error( 'Cannot construct window: window must have a manager' );
-       }
-
        // Properties
-       this.manager = manager;
+       this.manager = null;
        this.initialized = false;
        this.visible = false;
        this.opening = null;
        this.closing = null;
        this.opened = null;
        this.timing = null;
+       this.loading = null;
        this.size = config.size || this.constructor.static.size;
-       this.frame = new OO.ui.Frame( { $: this.$ } );
        this.$frame = this.$( '<div>' );
-       this.$ = function () {
-               throw new Error( 'this.$() cannot be used until the frame has been initialized.' );
-       };
 
        // Initialization
        this.$element
                .addClass( 'oo-ui-window' )
-               // Hide the window using visibility: hidden; while the iframe is still loading
-               // Can't use display: none; because that prevents the iframe from loading in Firefox
-               .css( 'visibility', 'hidden' )
                .append( this.$frame );
-       this.$frame
-               .addClass( 'oo-ui-window-frame' )
-               .append( this.frame.$element );
+       this.$frame.addClass( 'oo-ui-window-frame' );
 
-       // Events
-       this.frame.on( 'load', function () {
-               win.initialize();
-               win.initialized = true;
-               // Undo the visibility: hidden; hack and apply display: none;
-               // We can do this safely now that the iframe has initialized
-               // (don't do this from within #initialize because it has to happen
-               // after the all subclasses have been handled as well).
-               win.$element.hide().css( 'visibility', '' );
-       } );
+       // NOTE: Additional intitialization will occur when #setManager is called
 };
 
 /* Setup */
@@ -1631,6 +1343,116 @@ OO.mixinClass( OO.ui.Window, OO.EventEmitter );
  */
 OO.ui.Window.static.size = 'medium';
 
+/* Static Methods */
+
+/**
+ * Transplant the CSS styles from as parent document to a frame's document.
+ *
+ * This loops over the style sheets in the parent document, and copies their nodes to the
+ * frame's document. It then polls the document to see when all styles have loaded, and once they
+ * have, resolves the promise.
+ *
+ * If the styles still haven't loaded after a long time (5 seconds by default), we give up waiting
+ * and resolve the promise anyway. This protects against cases like a display: none; iframe in
+ * Firefox, where the styles won't load until the iframe becomes visible.
+ *
+ * For details of how we arrived at the strategy used in this function, see #load.
+ *
+ * @static
+ * @inheritable
+ * @param {HTMLDocument} parentDoc Document to transplant styles from
+ * @param {HTMLDocument} frameDoc Document to transplant styles to
+ * @param {number} [timeout=5000] How long to wait before giving up (in ms). If 0, never give up.
+ * @return {jQuery.Promise} Promise resolved when styles have loaded
+ */
+OO.ui.Window.static.transplantStyles = function ( parentDoc, frameDoc, timeout ) {
+       var i, numSheets, styleNode, styleText, newNode, timeoutID, pollNodeId, $pendingPollNodes,
+               $pollNodes = $( [] ),
+               // Fake font-family value
+               fontFamily = 'oo-ui-frame-transplantStyles-loaded',
+               nextIndex = parentDoc.oouiFrameTransplantStylesNextIndex || 0,
+               deferred = $.Deferred();
+
+       for ( i = 0, numSheets = parentDoc.styleSheets.length; i < numSheets; i++ ) {
+               styleNode = parentDoc.styleSheets[i].ownerNode;
+               if ( styleNode.disabled ) {
+                       continue;
+               }
+
+               if ( styleNode.nodeName.toLowerCase() === 'link' ) {
+                       // External stylesheet; use @import
+                       styleText = '@import url(' + styleNode.href + ');';
+               } else {
+                       // Internal stylesheet; just copy the text
+                       styleText = styleNode.textContent;
+               }
+
+               // Create a node with a unique ID that we're going to monitor to see when the CSS
+               // has loaded
+               if ( styleNode.oouiFrameTransplantStylesId ) {
+                       // If we're nesting transplantStyles operations and this node already has
+                       // a CSS rule to wait for loading, reuse it
+                       pollNodeId = styleNode.oouiFrameTransplantStylesId;
+               } else {
+                       // Otherwise, create a new ID
+                       pollNodeId = 'oo-ui-frame-transplantStyles-loaded-' + nextIndex;
+                       nextIndex++;
+
+                       // Add #pollNodeId { font-family: ... } to the end of the stylesheet / after the @import
+                       // The font-family rule will only take effect once the @import finishes
+                       styleText += '\n' + '#' + pollNodeId + ' { font-family: ' + fontFamily + '; }';
+               }
+
+               // Create a node with id=pollNodeId
+               $pollNodes = $pollNodes.add( $( '<div>', frameDoc )
+                       .attr( 'id', pollNodeId )
+                       .appendTo( frameDoc.body )
+               );
+
+               // Add our modified CSS as a <style> tag
+               newNode = frameDoc.createElement( 'style' );
+               newNode.textContent = styleText;
+               newNode.oouiFrameTransplantStylesId = pollNodeId;
+               frameDoc.head.appendChild( newNode );
+       }
+       frameDoc.oouiFrameTransplantStylesNextIndex = nextIndex;
+
+       // Poll every 100ms until all external stylesheets have loaded
+       $pendingPollNodes = $pollNodes;
+       timeoutID = setTimeout( function pollExternalStylesheets() {
+               while (
+                       $pendingPollNodes.length > 0 &&
+                       $pendingPollNodes.eq( 0 ).css( 'font-family' ) === fontFamily
+               ) {
+                       $pendingPollNodes = $pendingPollNodes.slice( 1 );
+               }
+
+               if ( $pendingPollNodes.length === 0 ) {
+                       // We're done!
+                       if ( timeoutID !== null ) {
+                               timeoutID = null;
+                               $pollNodes.remove();
+                               deferred.resolve();
+                       }
+               } else {
+                       timeoutID = setTimeout( pollExternalStylesheets, 100 );
+               }
+       }, 100 );
+       // ...but give up after a while
+       if ( timeout !== 0 ) {
+               setTimeout( function () {
+                       if ( timeoutID ) {
+                               clearTimeout( timeoutID );
+                               timeoutID = null;
+                               $pollNodes.remove();
+                               deferred.reject();
+                       }
+               }, timeout || 5000 );
+       }
+
+       return deferred.promise();
+};
+
 /* Methods */
 
 /**
@@ -1651,6 +1473,24 @@ OO.ui.Window.prototype.isVisible = function () {
        return this.visible;
 };
 
+/**
+ * Check if window is loading.
+ *
+ * @return {boolean} Window is loading
+ */
+OO.ui.Window.prototype.isLoading = function () {
+       return this.loading && this.loading.state() === 'pending';
+};
+
+/**
+ * Check if window is loaded.
+ *
+ * @return {boolean} Window is loaded
+ */
+OO.ui.Window.prototype.isLoaded = function () {
+       return this.loading && this.loading.state() === 'resolved';
+};
+
 /**
  * Check if window is opening.
  *
@@ -1693,15 +1533,6 @@ OO.ui.Window.prototype.getManager = function () {
        return this.manager;
 };
 
-/**
- * Get the window frame.
- *
- * @return {OO.ui.Frame} Frame of window
- */
-OO.ui.Window.prototype.getFrame = function () {
-       return this.frame;
-};
-
 /**
  * Get the window size.
  *
@@ -1719,8 +1550,8 @@ OO.ui.Window.prototype.getSize = function () {
 OO.ui.Window.prototype.getContentHeight = function () {
        return Math.round(
                // Add buffer for border
-               ( ( this.$frame.outerHeight() - this.$frame.innerHeight() ) * 2 ) +
-               // Height of contents
+               ( this.$frame.outerHeight() - this.$frame.innerHeight() ) +
+               // Use combined heights of children
                ( this.$head.outerHeight( true ) + this.getBodyHeight() + this.$foot.outerHeight( true ) )
        );
 };
@@ -1734,6 +1565,15 @@ OO.ui.Window.prototype.getBodyHeight = function () {
        return this.$body[0].scrollHeight;
 };
 
+/**
+ * Get the directionality of the frame
+ *
+ * @return {string} Directionality, 'ltr' or 'rtl'
+ */
+OO.ui.Window.prototype.getDir = function () {
+       return this.dir;
+};
+
 /**
  * Get a process for setting up a window for use.
  *
@@ -1802,6 +1642,76 @@ OO.ui.Window.prototype.getTeardownProcess = function () {
        return new OO.ui.Process();
 };
 
+/**
+ * Toggle visibility of window.
+ *
+ * If the window is isolated and hasn't fully loaded yet, the visiblity property will be used
+ * instead of display.
+ *
+ * @param {boolean} [show] Make window visible, omit to toggle visibility
+ * @fires visible
+ * @chainable
+ */
+OO.ui.Window.prototype.toggle = function ( show ) {
+       show = show === undefined ? !this.visible : !!show;
+
+       if ( show !== this.isVisible() ) {
+               this.visible = show;
+
+               if ( this.isolated && !this.isLoaded() ) {
+                       // Hide the window using visibility instead of display until loading is complete
+                       // Can't use display: none; because that prevents the iframe from loading in Firefox
+                       this.$element.css( 'visibility', show ? 'visible' : 'hidden' );
+               } else {
+                       this.$element.toggle( show ).css( 'visibility', '' );
+               }
+               this.emit( 'toggle', show );
+       }
+
+       return this;
+};
+
+/**
+ * Set the window manager.
+ *
+ * This must be called before initialize. Calling it more than once will cause an error.
+ *
+ * @param {OO.ui.WindowManager} manager Manager for this window
+ * @throws {Error} If called more than once
+ * @chainable
+ */
+OO.ui.Window.prototype.setManager = function ( manager ) {
+       if ( this.manager ) {
+               throw new Error( 'Cannot set window manager, window already has a manager' );
+       }
+
+       // Properties
+       this.manager = manager;
+       this.isolated = manager.shouldIsolate();
+
+       // Initialization
+       if ( this.isolated ) {
+               this.$iframe = this.$( '<iframe>' );
+               this.$iframe.attr( { frameborder: 0, scrolling: 'no' } );
+               this.$frame.append( this.$iframe );
+               this.$ = function () {
+                       throw new Error( 'this.$() cannot be used until the frame has been initialized.' );
+               };
+               // WARNING: Do not use this.$ again until #initialize is called
+       } else {
+               this.$content = this.$( '<div>' );
+               this.$document = $( this.getElementDocument() );
+               this.$content.addClass( 'oo-ui-window-content' );
+               this.$frame.append( this.$content );
+       }
+       this.toggle( false );
+
+       // Figure out directionality:
+       this.dir = OO.ui.Element.getDir( this.$iframe || this.$content ) || 'ltr';
+
+       return this;
+};
+
 /**
  * Set the window size.
  *
@@ -1851,11 +1761,15 @@ OO.ui.Window.prototype.setDimensions = function ( dim ) {
  *
  * Once this method is called, this.$ can be used to create elements within the frame.
  *
+ * @throws {Error} If not attached to a manager
  * @chainable
  */
 OO.ui.Window.prototype.initialize = function () {
+       if ( !this.manager ) {
+               throw new Error( 'Cannot initialize window, must be attached to a manager' );
+       }
+
        // Properties
-       this.$ = this.frame.$;
        this.$head = this.$( '<div>' );
        this.$body = this.$( '<div>' );
        this.$foot = this.$( '<div>' );
@@ -1866,9 +1780,7 @@ OO.ui.Window.prototype.initialize = function () {
        this.$body.addClass( 'oo-ui-window-body' );
        this.$foot.addClass( 'oo-ui-window-foot' );
        this.$overlay.addClass( 'oo-ui-window-overlay' );
-       this.frame.$content
-               .addClass( 'oo-ui-window-content' )
-               .append( this.$head, this.$body, this.$foot, this.$overlay );
+       this.$content.append( this.$head, this.$body, this.$foot, this.$overlay );
 
        return this;
 };
@@ -1900,18 +1812,6 @@ OO.ui.Window.prototype.close = function ( data ) {
        return this.manager.closeWindow( this, data );
 };
 
-/**
- * Load window.
- *
- * This is called by OO.ui.WindowManager durring window adding, and should not be called directly
- * by other systems.
- *
- * @return {jQuery.Promise} Promise resolved when window is loaded
- */
-OO.ui.Window.prototype.load = function () {
-       return this.frame.load();
-};
-
 /**
  * Setup window.
  *
@@ -1928,10 +1828,9 @@ OO.ui.Window.prototype.setup = function ( data ) {
        this.$element.show();
        this.visible = true;
        this.getSetupProcess( data ).execute().done( function () {
-               win.manager.updateWindowSize( win );
                // Force redraw by asking the browser to measure the elements' widths
                win.$element.addClass( 'oo-ui-window-setup' ).width();
-               win.frame.$content.addClass( 'oo-ui-window-content-setup' ).width();
+               win.$content.addClass( 'oo-ui-window-content-setup' ).width();
                deferred.resolve();
        } );
 
@@ -1951,11 +1850,11 @@ OO.ui.Window.prototype.ready = function ( data ) {
        var win = this,
                deferred = $.Deferred();
 
-       this.frame.$content[0].focus();
+       this.$content.focus();
        this.getReadyProcess( data ).execute().done( function () {
                // Force redraw by asking the browser to measure the elements' widths
                win.$element.addClass( 'oo-ui-window-ready' ).width();
-               win.frame.$content.addClass( 'oo-ui-window-content-ready' ).width();
+               win.$content.addClass( 'oo-ui-window-content-ready' ).width();
                deferred.resolve();
        } );
 
@@ -1976,13 +1875,17 @@ OO.ui.Window.prototype.hold = function ( data ) {
                deferred = $.Deferred();
 
        this.getHoldProcess( data ).execute().done( function () {
-               var $focused = win.frame.$content.find( ':focus' );
-               if ( $focused.length ) {
-                       $focused[0].blur();
+               // Get the focused element within the window's content
+               var $focus = win.$content.find( OO.ui.Element.getDocument( win.$content ).activeElement );
+
+               // Blur the focused element
+               if ( $focus.length ) {
+                       $focus[0].blur();
                }
+
                // Force redraw by asking the browser to measure the elements' widths
                win.$element.removeClass( 'oo-ui-window-ready' ).width();
-               win.frame.$content.removeClass( 'oo-ui-window-content-ready' ).width();
+               win.$content.removeClass( 'oo-ui-window-content-ready' ).width();
                deferred.resolve();
        } );
 
@@ -2005,7 +1908,7 @@ OO.ui.Window.prototype.teardown = function ( data ) {
        this.getTeardownProcess( data ).execute().done( function () {
                // Force redraw by asking the browser to measure the elements' widths
                win.$element.removeClass( 'oo-ui-window-setup' ).width();
-               win.frame.$content.removeClass( 'oo-ui-window-content-setup' ).width();
+               win.$content.removeClass( 'oo-ui-window-content-setup' ).width();
                win.$element.hide();
                win.visible = false;
                deferred.resolve();
@@ -2014,6 +1917,103 @@ OO.ui.Window.prototype.teardown = function ( data ) {
        return deferred.promise();
 };
 
+/**
+ * Load the frame contents.
+ *
+ * Once the iframe's stylesheets are loaded, the `load` event will be emitted and the returned
+ * promise will be resolved. Calling while loading will return a promise but not trigger a new
+ * loading cycle. Calling after loading is complete will return a promise that's already been
+ * resolved.
+ *
+ * Sounds simple right? Read on...
+ *
+ * When you create a dynamic iframe using open/write/close, the window.load event for the
+ * iframe is triggered when you call close, and there's no further load event to indicate that
+ * everything is actually loaded.
+ *
+ * In Chrome, stylesheets don't show up in document.styleSheets until they have loaded, so we could
+ * just poll that array and wait for it to have the right length. However, in Firefox, stylesheets
+ * are added to document.styleSheets immediately, and the only way you can determine whether they've
+ * loaded is to attempt to access .cssRules and wait for that to stop throwing an exception. But
+ * cross-domain stylesheets never allow .cssRules to be accessed even after they have loaded.
+ *
+ * The workaround is to change all `<link href="...">` tags to `<style>@import url(...)</style>`
+ * tags. Because `@import` is blocking, Chrome won't add the stylesheet to document.styleSheets
+ * until the `@import` has finished, and Firefox won't allow .cssRules to be accessed until the
+ * `@import` has finished. And because the contents of the `<style>` tag are from the same origin,
+ * accessing .cssRules is allowed.
+ *
+ * However, now that we control the styles we're injecting, we might as well do away with
+ * browser-specific polling hacks like document.styleSheets and .cssRules, and instead inject
+ * `<style>@import url(...); #foo { font-family: someValue; }</style>`, then create `<div id="foo">`
+ * and wait for its font-family to change to someValue. Because `@import` is blocking, the
+ * font-family rule is not applied until after the `@import` finishes.
+ *
+ * All this stylesheet injection and polling magic is in #transplantStyles.
+ *
+ * @return {jQuery.Promise} Promise resolved when loading is complete
+ * @fires load
+ */
+OO.ui.Window.prototype.load = function () {
+       var sub, doc, loading,
+               win = this;
+
+       // Non-isolated windows are already "loaded"
+       if ( !this.loading && !this.isolated ) {
+               this.loading = $.Deferred().resolve();
+               this.initialize();
+               // Set initialized state after so sub-classes aren't confused by it being set by calling
+               // their parent initialize method
+               this.initialized = true;
+       }
+
+       // Return existing promise if already loading or loaded
+       if ( this.loading ) {
+               return this.loading.promise();
+       }
+
+       // Load the frame
+       loading = this.loading = $.Deferred();
+       sub = this.$iframe.prop( 'contentWindow' );
+       doc = sub.document;
+
+       // Initialize contents
+       doc.open();
+       doc.write(
+               '<!doctype html>' +
+               '<html>' +
+                       '<body class="oo-ui-window-isolated oo-ui-window-content oo-ui-' + this.dir + '"' +
+                               ' style="direction:' + this.dir + ';" dir="' + this.dir + '">' +
+                       '</body>' +
+               '</html>'
+       );
+       doc.close();
+
+       // Properties
+       this.$ = OO.ui.Element.getJQuery( doc, this.$element );
+       this.$content = this.$( '.oo-ui-window-content' ).attr( 'tabIndex', 0 );
+       this.$document = this.$( doc );
+
+       // Initialization
+       this.constructor.static.transplantStyles( this.getElementDocument(), this.$document[0] )
+               .always( function () {
+                       // Initialize isolated windows
+                       win.initialize();
+                       // Set initialized state after so sub-classes aren't confused by it being set by calling
+                       // their parent initialize method
+                       win.initialized = true;
+                       // Undo the visibility: hidden; hack and apply display: none;
+                       // We can do this safely now that the iframe has initialized
+                       // (don't do this from within #initialize because it has to happen
+                       // after the all subclasses have been handled as well).
+                       win.toggle( win.isVisible() );
+
+                       loading.resolve();
+               } );
+
+       return loading.promise();
+};
+
 /**
  * Base class for all dialogs.
  *
@@ -2043,9 +2043,9 @@ OO.ui.Window.prototype.teardown = function ( data ) {
  * @constructor
  * @param {Object} [config] Configuration options
  */
-OO.ui.Dialog = function OoUiDialog( manager, config ) {
+OO.ui.Dialog = function OoUiDialog( config ) {
        // Parent constructor
-       OO.ui.Dialog.super.call( this, manager, config );
+       OO.ui.Dialog.super.call( this, config );
 
        // Properties
        this.actions = new OO.ui.ActionSet();
@@ -2118,7 +2118,7 @@ OO.ui.Dialog.static.escapable = true;
  *
  * @param {jQuery.Event} e Key down event
  */
-OO.ui.Dialog.prototype.onFrameDocumentKeyDown = function ( e ) {
+OO.ui.Dialog.prototype.onDocumentKeyDown = function ( e ) {
        if ( e.which === OO.ui.Keys.ESCAPE ) {
                this.close();
                return false;
@@ -2250,11 +2250,11 @@ OO.ui.Dialog.prototype.initialize = function () {
 
        // Events
        if ( this.constructor.static.escapable ) {
-               this.frame.$document.on( 'keydown', OO.ui.bind( this.onFrameDocumentKeyDown, this ) );
+               this.$document.on( 'keydown', OO.ui.bind( this.onDocumentKeyDown, this ) );
        }
 
        // Initialization
-       this.frame.$content.addClass( 'oo-ui-dialog-content' );
+       this.$content.addClass( 'oo-ui-dialog-content' );
 };
 
 /**
@@ -2299,7 +2299,7 @@ OO.ui.Dialog.prototype.executeAction = function ( action ) {
  */
 OO.ui.Dialog.prototype.pushPending = function () {
        if ( this.pending === 0 ) {
-               this.frame.$content.addClass( 'oo-ui-actionDialog-content-pending' );
+               this.$content.addClass( 'oo-ui-actionDialog-content-pending' );
                this.$head.addClass( 'oo-ui-texture-pending' );
        }
        this.pending++;
@@ -2316,7 +2316,7 @@ OO.ui.Dialog.prototype.pushPending = function () {
  */
 OO.ui.Dialog.prototype.popPending = function () {
        if ( this.pending === 1 ) {
-               this.frame.$content.removeClass( 'oo-ui-actionDialog-content-pending' );
+               this.$content.removeClass( 'oo-ui-actionDialog-content-pending' );
                this.$head.removeClass( 'oo-ui-texture-pending' );
        }
        this.pending = Math.max( 0, this.pending - 1 );
@@ -2364,6 +2364,7 @@ OO.ui.Dialog.prototype.popPending = function () {
  *
  * @constructor
  * @param {Object} [config] Configuration options
+ * @cfg {boolean} [isolate] Configure managed windows to isolate their content using inline frames
  * @cfg {OO.Factory} [factory] Window factory to use for automatic instantiation
  * @cfg {boolean} [modal=true] Prevent interaction outside the dialog
  */
@@ -2380,10 +2381,13 @@ OO.ui.WindowManager = function OoUiWindowManager( config ) {
        // Properties
        this.factory = config.factory;
        this.modal = config.modal === undefined || !!config.modal;
+       this.isolate = !!config.isolate;
        this.windows = {};
        this.opening = null;
        this.opened = null;
        this.closing = null;
+       this.preparingToOpen = null;
+       this.preparingToClose = null;
        this.size = null;
        this.currentWindow = null;
        this.$ariaHidden = null;
@@ -2553,6 +2557,17 @@ OO.ui.WindowManager.prototype.isOpened = function ( win ) {
        return win === this.currentWindow && !!this.opened && this.opened.state() === 'pending';
 };
 
+/**
+ * Check if window contents should be isolated.
+ *
+ * Window content isolation is done using inline frames.
+ *
+ * @return {boolean} Window contents should be isolated
+ */
+OO.ui.WindowManager.prototype.shouldIsolate = function () {
+       return this.isolate;
+};
+
 /**
  * Check if a window is being managed.
  *
@@ -2621,8 +2636,7 @@ OO.ui.WindowManager.prototype.getTeardownDelay = function () {
  * If window is not yet instantiated, it will be instantiated and added automatically.
  *
  * @param {string} name Symbolic window name
- * @return {jQuery.Promise} Promise resolved when window is ready to be accessed; when resolved the
- *   first argument is an OO.ui.Window; when rejected the first argument is an OO.ui.Error
+ * @return {jQuery.Promise} Promise resolved with matching window, or rejected with an OO.ui.Error
  * @throws {Error} If the symbolic name is unrecognized by the factory
  * @throws {Error} If the symbolic name unrecognized as a managed window
  */
@@ -2638,10 +2652,8 @@ OO.ui.WindowManager.prototype.getWindow = function ( name ) {
                                ) );
                        } else {
                                win = this.factory.create( name, this, { $: this.$ } );
-                               this.addWindows( [ win ] ).then(
-                                       OO.ui.bind( deferred.resolve, deferred, win ),
-                                       deferred.reject
-                               );
+                               this.addWindows( [ win ] );
+                               deferred.resolve( win );
                        }
                } else {
                        deferred.reject( new OO.ui.Error(
@@ -2690,23 +2702,30 @@ OO.ui.WindowManager.prototype.openWindow = function ( win, data ) {
                opening.reject( new OO.ui.Error(
                        'Cannot open window: window is not attached to manager'
                ) );
+       } else if ( this.preparingToOpen || this.opening || this.opened ) {
+               opening.reject( new OO.ui.Error(
+                       'Cannot open window: another window is opening or open'
+               ) );
        }
 
        // Window opening
        if ( opening.state() !== 'rejected' ) {
-               // Begin loading the window if it's not loaded already - may take noticable time and we want
-               // too do this in paralell with any preparatory actions
-               preparing.push( win.load() );
-
-               if ( this.opening || this.opened ) {
-                       // If a window is currently opening or opened, close it first
-                       preparing.push( this.closeWindow( this.currentWindow ) );
-               } else if ( this.closing ) {
+               // Begin loading the window if it's not loading or loaded already - may take noticable time
+               // and we want to do this in paralell with any other preparatory actions
+               if ( !win.isLoading() && !win.isLoaded() ) {
+                       // Finish initializing the window (must be done after manager is attached to DOM)
+                       win.setManager( this );
+                       preparing.push( win.load() );
+               }
+
+               if ( this.closing ) {
                        // If a window is currently closing, wait for it to complete
                        preparing.push( this.closing );
                }
 
-               $.when.apply( $, preparing ).done( function () {
+               this.preparingToOpen = $.when.apply( $, preparing );
+               // Ensure handlers get called after preparingToOpen is set
+               this.preparingToOpen.done( function () {
                        if ( manager.modal ) {
                                manager.$( manager.getElementDocument() ).on( {
                                        // Prevent scrolling by keys in top-level window
@@ -2726,13 +2745,15 @@ OO.ui.WindowManager.prototype.openWindow = function ( win, data ) {
                        }
                        manager.currentWindow = win;
                        manager.opening = opening;
+                       manager.preparingToOpen = null;
                        manager.emit( 'opening', win, opening, data );
-                       manager.updateWindowSize( win );
                        setTimeout( function () {
                                win.setup( data ).then( function () {
+                                       manager.updateWindowSize( win );
                                        manager.opening.notify( { state: 'setup' } );
                                        setTimeout( function () {
                                                win.ready( data ).then( function () {
+                                                       manager.updateWindowSize( win );
                                                        manager.opening.notify( { state: 'ready' } );
                                                        manager.opening = null;
                                                        manager.opened = $.Deferred();
@@ -2744,7 +2765,7 @@ OO.ui.WindowManager.prototype.openWindow = function ( win, data ) {
                } );
        }
 
-       return opening;
+       return opening.promise();
 };
 
 /**
@@ -2779,7 +2800,7 @@ OO.ui.WindowManager.prototype.closeWindow = function ( win, data ) {
                closing.reject( new OO.ui.Error(
                        'Cannot close window: window already closed with different data'
                ) );
-       } else if ( this.closing ) {
+       } else if ( this.preparingToClose || this.closing ) {
                closing.reject( new OO.ui.Error(
                        'Cannot close window: window already closing with different data'
                ) );
@@ -2792,9 +2813,11 @@ OO.ui.WindowManager.prototype.closeWindow = function ( win, data ) {
                        preparing.push( this.opening );
                }
 
-               // Close the window
-               $.when.apply( $, preparing ).done( function () {
+               this.preparingToClose = $.when.apply( $, preparing );
+               // Ensure handlers get called after preparingToClose is set
+               this.preparingToClose.done( function () {
                        manager.closing = closing;
+                       manager.preparingToClose = null;
                        manager.emit( 'closing', win, closing, data );
                        manager.opened = null;
                        opened.resolve( closing.promise(), data );
@@ -2831,23 +2854,18 @@ OO.ui.WindowManager.prototype.closeWindow = function ( win, data ) {
                } );
        }
 
-       return closing;
+       return closing.promise();
 };
 
 /**
  * Add windows.
  *
- * If the window manager is attached to the DOM then windows will be automatically loaded as they
- * are added.
- *
  * @param {Object.<string,OO.ui.Window>|OO.ui.Window[]} windows Windows to add
- * @return {jQuery.Promise} Promise resolved when all windows are added
  * @throws {Error} If one of the windows being added without an explicit symbolic name does not have
  *   a statically configured symbolic name
  */
 OO.ui.WindowManager.prototype.addWindows = function ( windows ) {
-       var i, len, win, name, list,
-               promises = [];
+       var i, len, win, name, list;
 
        if ( $.isArray( windows ) ) {
                // Convert to map of windows by looking up symbolic names from static configuration
@@ -2868,13 +2886,7 @@ OO.ui.WindowManager.prototype.addWindows = function ( windows ) {
                win = list[name];
                this.windows[name] = win;
                this.$element.append( win.$element );
-
-               if ( this.isElementAttached() ) {
-                       promises.push( win.load() );
-               }
        }
-
-       return $.when.apply( $, promises );
 };
 
 /**
@@ -3382,10 +3394,9 @@ OO.ui.ButtonedElement.prototype.onMouseDown = function ( e ) {
        // tabIndex should generally be interacted with via the property, but it's not possible to
        // reliably unset a tabIndex via a property so we use the (lowercase) "tabindex" attribute
        this.tabIndex = this.$button.attr( 'tabindex' );
-       this.$button
-               // Remove the tab-index while the button is down to prevent the button from stealing focus
-               .removeAttr( 'tabindex' )
-               .addClass( 'oo-ui-buttonedElement-pressed' );
+       // Remove the tab-index while the button is down to prevent the button from stealing focus
+       this.$button.removeAttr( 'tabindex' );
+       this.$element.addClass( 'oo-ui-buttonedElement-pressed' );
        // Run the mouseup handler no matter where the mouse is when the button is let go, so we can
        // reliably reapply the tabindex and remove the pressed class
        this.getElementDocument().addEventListener( 'mouseup', this.onMouseUpHandler, true );
@@ -3404,10 +3415,9 @@ OO.ui.ButtonedElement.prototype.onMouseUp = function ( e ) {
        if ( this.isDisabled() || e.which !== 1 ) {
                return false;
        }
-       this.$button
-               // Restore the tab-index after the button is up to restore the button's accesssibility
-               .attr( 'tabindex', this.tabIndex )
-               .removeClass( 'oo-ui-buttonedElement-pressed' );
+       // Restore the tab-index after the button is up to restore the button's accesssibility
+       this.$button.attr( 'tabindex', this.tabIndex );
+       this.$element.removeClass( 'oo-ui-buttonedElement-pressed' );
        // Stop listening for mouseup, since we only needed this once
        this.getElementDocument().removeEventListener( 'mouseup', this.onMouseUpHandler, true );
 };
@@ -3467,7 +3477,7 @@ OO.ui.ButtonedElement.prototype.setAccessKey = function ( accessKey ) {
  * @chainable
  */
 OO.ui.ButtonedElement.prototype.setActive = function ( value ) {
-       this.$button.toggleClass( 'oo-ui-buttonedElement-active', !!value );
+       this.$element.toggleClass( 'oo-ui-buttonedElement-active', !!value );
        return this;
 };
 
@@ -5157,9 +5167,9 @@ OO.ui.ToolGroup.prototype.destroy = function () {
  * @constructor
  * @param {Object} [config] Configuration options
  */
-OO.ui.MessageDialog = function OoUiMessageDialog( manager, config ) {
+OO.ui.MessageDialog = function OoUiMessageDialog( config ) {
        // Parent constructor
-       OO.ui.MessageDialog.super.call( this, manager, config );
+       OO.ui.MessageDialog.super.call( this, config );
 
        // Properties
        this.verticalActionLayout = null;
@@ -5305,7 +5315,7 @@ OO.ui.MessageDialog.prototype.initialize = function () {
 
        // Initialization
        this.title.$element.addClass( 'oo-ui-messageDialog-title' );
-       this.frame.$content.addClass( 'oo-ui-messageDialog-content' );
+       this.$content.addClass( 'oo-ui-messageDialog-content' );
        this.container.$element.append( this.text.$element );
        this.text.$element.append( this.title.$element, this.message.$element );
        this.$body.append( this.container.$element );
@@ -5393,9 +5403,9 @@ OO.ui.MessageDialog.prototype.fitActions = function () {
  * @constructor
  * @param {Object} [config] Configuration options
  */
-OO.ui.ProcessDialog = function OoUiProcessDialog( manager, config ) {
+OO.ui.ProcessDialog = function OoUiProcessDialog( config ) {
        // Parent constructor
-       OO.ui.ProcessDialog.super.call( this, manager, config );
+       OO.ui.ProcessDialog.super.call( this, config );
 
        // Initialization
        this.$element.addClass( 'oo-ui-processDialog' );
@@ -5478,7 +5488,7 @@ OO.ui.ProcessDialog.prototype.initialize = function () {
        this.$errors
                .addClass( 'oo-ui-processDialog-errors' )
                .append( this.$errorsTitle, this.dismissButton.$element, this.retryButton.$element );
-       this.frame.$content
+       this.$content
                .addClass( 'oo-ui-processDialog-content' )
                .append( this.$errors );
        this.$navigation
@@ -10679,9 +10689,9 @@ OO.ui.TextInputMenuWidget.prototype.position = function () {
        dimensions.top += $container.height();
 
        // Compensate for frame position if in a differnt frame
-       if ( this.input.$.frame && this.input.$.context !== this.$element[0].ownerDocument ) {
+       if ( this.input.$.$iframe && this.input.$.context !== this.$element[0].ownerDocument ) {
                frameOffset = OO.ui.Element.getRelativePosition(
-                       this.input.$.frame.$element, this.$element.offsetParent()
+                       this.input.$.$iframe, this.$element.offsetParent()
                );
                dimensions.left += frameOffset.left;
                dimensions.top += frameOffset.top;
index edbafb2..f84ea0b 100644 (file)
@@ -1,91 +1,64 @@
 /*!
- * OOjs UI v0.1.0-pre (944c47c5fe)
+ * OOjs UI v0.1.0-pre (55b861b167)
  * https://www.mediawiki.org/wiki/OOjs_UI
  *
  * Copyright 2011–2014 OOjs Team and other contributors.
  * Released under the MIT license
  * http://oojs.mit-license.org
  *
- * Date: 2014-08-21T00:23:52Z
+ * Date: 2014-08-21T16:59:20Z
  */
 /* Textures */
-
 .oo-ui-texture-pending {
   background-image: /* @embed */ url(images/textures/pending.gif);
 }
-
 .oo-ui-texture-transparency {
   background-image: /* @embed */ url(images/textures/transparency.png);
 }
-
 /* RTL Definitions */
-
 /* @noflip */
-
 .oo-ui-rtl {
   direction: rtl;
 }
-
 /* @noflip */
-
 .oo-ui-ltr {
   direction: ltr;
 }
 
-.oo-ui-frame {
-  padding: 0;
-  margin: 0;
-}
-
-.oo-ui-frame-content {
-  padding: 0;
-  margin: 0;
-}
-
-.oo-ui-frame-content:focus {
-  outline: none;
-}
-
 .oo-ui-toolbar {
   clear: both;
 }
-
 .oo-ui-toolbar-bar {
   line-height: 1em;
 }
-
 .oo-ui-toolbar-actions {
   float: right;
 }
-
 .oo-ui-toolbar-tools {
   float: left;
 }
-
 .oo-ui-toolbar-tools,
 .oo-ui-toolbar-actions,
 .oo-ui-toolbar-shadow {
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
-
 .oo-ui-toolbar-actions .oo-ui-popupWidget {
-  -webkit-user-select: all;
-     -moz-user-select: all;
-      -ms-user-select: all;
-          user-select: all;
   -webkit-touch-callout: default;
+  -webkit-user-select: all;
+  -moz-user-select: all;
+  -ms-user-select: all;
+  user-select: all;
 }
-
 .oo-ui-toolbar-shadow {
+  background-position: left top;
+  background-repeat: repeat-x;
   position: absolute;
   width: 100%;
   pointer-events: none;
-  background-position: left top;
-  background-repeat: repeat-x;
 }
 
 .oo-ui-toolGroup {
   margin: 0.3em;
   vertical-align: middle;
 }
-
 .oo-ui-toolGroup-empty {
   display: none;
 }
-
 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
   background-position: center center;
   background-repeat: no-repeat;
 
 .oo-ui-window {
   line-height: 1em;
+  /* Content div takes focus when opened, so hide outline */
 }
-
-.oo-ui-window > .oo-ui-window-frame {
+.oo-ui-window-frame {
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
-.oo-ui-window > .oo-ui-window-frame > .oo-ui-frame {
+.oo-ui-window-frame > iframe {
   width: 100%;
   height: 100%;
+  margin: 0;
+  padding: 0;
+}
+.oo-ui-window-content:focus {
+  outline: none;
 }
-
 .oo-ui-window-head,
 .oo-ui-window-foot {
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+.oo-ui-window-body {
+  margin: 0;
+  padding: 0;
+  background: none;
 }
-
 .oo-ui-window-overlay {
   position: absolute;
   top: 0;
   height: 0;
   overflow: hidden;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup {
+  width: auto;
+  height: auto;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
-  width: auto;
-  height: auto;
   padding: 1em;
 }
-
 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame {
   position: fixed;
   right: 0;
   left: 0;
-  max-width: 100%;
-  max-height: 100%;
   margin: auto;
   overflow: hidden;
+  max-width: 100%;
+  max-height: 100%;
+}
+.oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame > iframe {
+  width: 100%;
+  height: 100%;
 }
-
 .oo-ui-windowManager-fullscreen > .oo-ui-dialog > .oo-ui-window-frame {
-  top: 0;
-  bottom: 0;
   width: 100%;
   height: 100%;
+  top: 0;
+  bottom: 0;
 }
 
 .oo-ui-messageDialog-actions-horizontal {
   display: table;
-  width: 100%;
   table-layout: fixed;
+  width: 100%;
 }
-
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
   display: table-cell;
   width: 1%;
 }
-
 .oo-ui-messageDialog-actions-vertical {
   display: block;
 }
-
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
   display: block;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget {
   position: relative;
   text-align: center;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-buttonedElement-button {
   display: block;
 }
-
 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labeledElement-label {
   position: relative;
   top: auto;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-
 .oo-ui-processDialog-title {
   display: inline;
 }
-
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget,
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget {
   white-space: nowrap;
 }
-
 .oo-ui-processDialog-actions-safe,
 .oo-ui-processDialog-actions-primary {
   position: absolute;
   top: 0;
   bottom: 0;
 }
-
 .oo-ui-processDialog-actions-safe {
   left: 0;
 }
-
 .oo-ui-processDialog-actions-primary {
   right: 0;
 }
-
 .oo-ui-processDialog-errors {
+  display: none;
   position: absolute;
   top: 0;
+  left: 0;
   right: 0;
   bottom: 0;
-  left: 0;
-  z-index: 2;
-  display: none;
   padding: 3em 3em 1.5em 3em;
+  z-index: 2;
   overflow-x: hidden;
   overflow-y: auto;
 }
 
 .oo-ui-buttonedElement > .oo-ui-buttonedElement-button {
+  cursor: pointer;
   display: inline-block;
   vertical-align: middle;
-  cursor: pointer;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
-
 .oo-ui-buttonedElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
   display: none;
   margin-left: 0;
 }
-
 .oo-ui-buttonedElement > .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator {
   display: none;
   margin-right: -0.75em;
 }
-
 .oo-ui-buttonedElement.oo-ui-widget-disabled > .oo-ui-buttonedElement-button {
   cursor: default;
 }
-
 .oo-ui-buttonedElement.oo-ui-indicatedElement > .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator,
 .oo-ui-buttonedElement.oo-ui-iconedElement > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
   display: inline-block;
   background-position: center center;
   background-repeat: no-repeat;
 }
-
 .oo-ui-buttonedElement-frameless {
-  position: relative;
   display: inline-block;
+  position: relative;
 }
-
 .oo-ui-buttonedElement-frameless > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   display: inline-block;
-  margin-left: 0.25em;
   vertical-align: middle;
+  margin-left: 0.25em;
 }
-
 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button {
   display: inline-block;
-  text-align: center;
   vertical-align: top;
+  text-align: center;
 }
-
 .oo-ui-buttonedElement-framed > .oo-ui-buttonedElement-button > .oo-ui-labeledElement-label {
   display: inline-block;
-  line-height: 1.9em;
   vertical-align: middle;
+  line-height: 1.9em;
 }
-
 .oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-active,
-.oo-ui-buttonedElement-framed.oo-ui-widget-disabled > .oo-ui-buttonedElement-button.oo-ui-buttonedElement-pressed {
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-active > .oo-ui-buttonedElement-button,
+.oo-ui-buttonedElement-framed.oo-ui-widget-disabled.oo-ui-buttonedElement-pressed > .oo-ui-buttonedElement-button {
   cursor: default;
 }
 
 .oo-ui-clippableElement-clippable {
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
 
 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous .oo-ui-panelLayout-scrollable {
   overflow-y: hidden;
 }
-
 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
   width: 100%;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-scrollable {
   overflow-y: auto;
 }
-
 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-padded {
   padding: 2em;
 }
-
 .oo-ui-bookletLayout-outlinePanel-editable .oo-ui-outlineWidget {
   position: absolute;
   top: 0;
+  left: 0;
   right: 0;
   bottom: 3em;
-  left: 0;
   overflow-y: auto;
 }
-
 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
   position: absolute;
-  right: 0;
   bottom: 0;
   left: 0;
+  right: 0;
 }
 
 .oo-ui-fieldLayout {
   margin-bottom: 1em;
 }
-
 .oo-ui-fieldLayout:last-child {
   margin-bottom: 0;
 }
-
 .oo-ui-fieldLayout:before,
 .oo-ui-fieldLayout:after {
-  display: table;
   content: " ";
+  display: table;
 }
-
 .oo-ui-fieldLayout:after {
   clear: both;
 }
-
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-labeledElement-label,
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
   display: block;
   padding-top: 0.5em;
   margin-right: 5%;
 }
-
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-field,
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-field {
   display: block;
   float: left;
   width: 60%;
 }
-
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labeledElement-label {
   text-align: right;
 }
-
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-labeledElement-label {
   display: inline-block;
-  padding: 0.75em 0.5em 0.5em 0.5em;
   vertical-align: middle;
+  padding: 0.75em 0.5em 0.5em 0.5em;
 }
-
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-field {
   display: inline-block;
-  padding: 0.5em 0;
   vertical-align: middle;
+  padding: 0.5em 0;
 }
-
 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-labeledElement-label {
   display: inline-block;
   padding: 0.5em 0;
 }
-
 .oo-ui-fieldLayout > .oo-ui-popupButtonWidget > .oo-ui-buttonedElement-button > .oo-ui-iconedElement-icon {
   margin-top: 0.25em;
 }
-
 .oo-ui-fieldLayout > .oo-ui-popupButtonWidget > .oo-ui-popupWidget > .oo-ui-popupWidget-popup {
   z-index: 1;
 }
 
 .oo-ui-fieldsetLayout {
   position: relative;
-  padding: 0;
   margin: 0;
+  padding: 0;
 }
-
 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout {
   margin-top: 2em;
 }
-
 .oo-ui-fieldsetLayout > .oo-ui-labeledElement-label {
-  padding: 0.25em 0;
   margin-bottom: 0.5em;
+  padding: 0.25em 0;
 }
-
 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-labeledElement-label {
   padding-left: 1.75em;
   line-height: 1.33em;
 }
-
 .oo-ui-fieldsetLayout.oo-ui-iconedElement > .oo-ui-iconedElement-icon {
+  display: block;
   position: absolute;
-  top: 0.25em;
   left: 0;
-  display: block;
+  top: 0.25em;
   width: 2em;
   height: 2em;
   background-position: center center;
 .oo-ui-gridLayout {
   position: absolute;
   top: 0;
+  left: 0;
   right: 0;
   bottom: 0;
-  left: 0;
 }
 
 .oo-ui-labelWidget {
 .oo-ui-panelLayout {
   position: relative;
 }
-
 .oo-ui-panelLayout-scrollable {
   overflow-y: auto;
 }
-
 .oo-ui-panelLayout-expanded {
   position: absolute;
   top: 0;
+  left: 0;
   right: 0;
   bottom: 0;
-  left: 0;
 }
 
 .oo-ui-stackLayout > .oo-ui-panelLayout {
   display: none;
 }
-
 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
-  position: relative;
   display: block;
+  position: relative;
 }
 
 .oo-ui-barToolGroup > .oo-ui-iconedElement-icon,
 .oo-ui-barToolGroup > .oo-ui-labeledElement-label {
   display: none;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool {
-  position: relative;
   display: inline-block;
+  position: relative;
   vertical-align: top;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool-link {
   display: block;
   height: 1.5em;
   padding: 0.25em;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
   display: block;
-  width: 1.5em;
   height: 1.5em;
+  width: 1.5em;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
   display: none;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
   cursor: default;
 }
-
 .oo-ui-barToolGroup .oo-ui-tool-title,
 .oo-ui-barToolGroup .oo-ui-tool-accel {
   display: none;
 }
-
 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-link {
   cursor: pointer;
 }
 .oo-ui-listToolGroup .oo-ui-toolGroup-tools {
   padding: 0.25em;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool {
   display: inline-block;
   width: 100%;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool-link {
   display: block;
-  padding-right: 0.5em;
-  white-space: nowrap;
   cursor: pointer;
+  white-space: nowrap;
+  padding-right: 0.5em;
 }
-
 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
   cursor: default;
 }
 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
   min-width: 8em;
 }
-
 .oo-ui-menuToolGroup .oo-ui-toolGroup-tools {
   padding: 0.25em 0 0.25em 0;
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool {
   display: block;
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool-link {
   display: block;
-  padding: 0 1em 0 0.25em;
-  white-space: nowrap;
   cursor: pointer;
+  white-space: nowrap;
+  padding: 0 1em 0 0.25em;
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
   background-image: none;
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconedElement-icon {
   background-image: /* @embed */ url(images/icons/check.svg);
 }
-
 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
   cursor: default;
 }
   height: 2em;
   min-width: 2.5em;
 }
-
 .oo-ui-popupToolGroup.oo-ui-indicatedElement.oo-ui-iconedElement {
   min-width: 3.5em;
 }
-
 .oo-ui-popupToolGroup-handle {
   display: block;
   cursor: pointer;
 }
-
 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator,
 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
   position: absolute;
   background-position: center center;
   background-repeat: no-repeat;
 }
-
 .oo-ui-popupToolGroup-handle .oo-ui-indicatedElement-indicator {
   right: 0;
 }
-
 .oo-ui-popupToolGroup-handle .oo-ui-iconedElement-icon {
   left: 0.25em;
 }
-
 .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
-  margin: 0 1em;
-  font-size: 0.8em;
   line-height: 2.6em;
+  font-size: 0.8em;
+  margin: 0 1em;
 }
-
 .oo-ui-popupToolGroup-header {
-  margin: 0 0.6em;
+  line-height: 2.6em;
   font-size: 0.8em;
+  margin: 0 0.6em;
   font-weight: bold;
-  line-height: 2.6em;
 }
-
 .oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle {
   cursor: default;
 }
-
 .oo-ui-popupToolGroup.oo-ui-iconedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
   margin-left: 3em;
 }
-
 .oo-ui-popupToolGroup.oo-ui-indicatedElement .oo-ui-popupToolGroup-handle .oo-ui-labeledElement-label {
   margin-right: 2.25em;
 }
-
 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
+  display: none;
   position: absolute;
   top: 2em;
   left: -1px;
   z-index: 4;
-  display: none;
 }
-
 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools .oo-ui-iconedElement-icon {
-  background-position: center center;
   background-repeat: no-repeat;
+  background-position: center center;
 }
-
 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools {
   display: block;
 }
-
 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconedElement-icon {
   display: inline-block;
-  width: 2em;
+  vertical-align: middle;
   height: 2em;
+  width: 2em;
   margin-right: 0.25em;
-  vertical-align: middle;
 }
-
 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
   display: inline-block;
-  font-size: 0.8em;
-  line-height: 2em;
   vertical-align: middle;
+  line-height: 2em;
+  font-size: 0.8em;
 }
-
 .oo-ui-popupToolGroup .oo-ui-tool-accel {
   display: none;
 }
   margin-left: 1.25em;
   font-size: 0.8em;
 }
-
 .oo-ui-popupTool .oo-ui-popupWidget-popup,
 .oo-ui-popupTool .oo-ui-popupWidget-anchor {
   z-index: 4;
 
 .oo-ui-iconWidget {
   display: inline-block;
-  width: 1.9em;
-  height: 1.9em;
-  line-height: 2.5em;
   vertical-align: middle;
+  line-height: 2.5em;
+  height: 1.9em;
+  width: 1.9em;
   background-position: center center;
   background-repeat: no-repeat;
   opacity: 0.8;
 }
-
 .oo-ui-iconWidget.oo-ui-widget-disabled {
   opacity: 0.2;
 }
 
 .oo-ui-indicatorWidget {
   display: inline-block;
-  width: 1.9em;
-  height: 1.9em;
-  line-height: 2.5em;
   vertical-align: middle;
+  line-height: 2.5em;
+  height: 1.9em;
+  width: 1.9em;
   background-position: center center;
   background-repeat: no-repeat;
   opacity: 0.8;
 }
-
 .oo-ui-indicatorWidget.oo-ui-widget-disabled {
   opacity: 0.2;
 }
 
 .oo-ui-selectWidget {
-  padding: 0;
-  margin: 0;
   list-style: none;
+  margin: 0;
+  padding: 0;
 }
 
 .oo-ui-optionWidget {
   position: relative;
   display: block;
-  margin: 0;
+  border: none;
   list-style: none;
+  margin: 0;
   cursor: pointer;
-  border: none;
 }
-
 .oo-ui-optionWidget.oo-ui-widget-disabled {
   cursor: default;
 }
-
 .oo-ui-optionWidget .oo-ui-labeledElement-label {
   display: block;
-  overflow: hidden;
   line-height: 1.5em;
-  text-overflow: ellipsis;
   white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
 
 .oo-ui-decoratedOptionWidget .oo-ui-iconedElement-icon,
   width: 2em;
   height: 2em;
   margin-top: -1em;
-  background-position: center center;
   background-repeat: no-repeat;
+  background-position: center center;
 }
-
 .oo-ui-decoratedOptionWidget .oo-ui-iconedElement-icon {
   left: 0.5em;
 }
-
 .oo-ui-decoratedOptionWidget .oo-ui-indicatedElement-indicator {
   right: 0.5em;
 }
 .oo-ui-menuWidget {
   position: absolute;
 }
-
 .oo-ui-menuWidget input {
   position: absolute;
   width: 0;
 
 .oo-ui-popupWidget-popup {
   position: absolute;
-  z-index: 1;
   overflow: hidden;
+  z-index: 1;
 }
-
 .oo-ui-popupWidget-anchor {
-  z-index: 1;
   display: none;
+  z-index: 1;
 }
-
 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-popup {
   margin-top: 7px;
 }
-
 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor {
-  position: absolute;
   display: block;
+  position: absolute;
   background-repeat: no-repeat;
 }
-
 .oo-ui-popupWidget-head {
   height: 2.5em;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
-
 .oo-ui-popupWidget-head .oo-ui-buttonWidget {
   float: right;
   margin: 0.25em;
 }
-
 .oo-ui-popupWidget-head .oo-ui-labeledElement-label {
   float: left;
   margin: 0.75em 1em;
   cursor: default;
 }
-
 .oo-ui-popupWidget-body {
-  overflow: hidden;
   clear: both;
+  overflow: hidden;
 }
-
 .oo-ui-popupWidget-body-padded {
   padding: 0 1em;
 }
 .oo-ui-buttonGroupWidget {
   border-radius: 0.3em;
 }
-
 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button {
+  border-radius: 0;
   margin-bottom: -1px;
   margin-left: -1px;
-  border-radius: 0;
 }
-
 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:first-child .oo-ui-buttonedElement-button {
-  margin-left: 0;
   border-bottom-left-radius: 0.3em;
   border-top-left-radius: 0.3em;
+  margin-left: 0;
 }
-
 .oo-ui-buttonGroupWidget .oo-ui-buttonedElement-framed:last-child .oo-ui-buttonedElement-button {
-  border-top-right-radius: 0.3em;
   border-bottom-right-radius: 0.3em;
+  border-top-right-radius: 0.3em;
 }
 
 .oo-ui-buttonOptionWidget {
   display: inline-block;
   background-color: transparent;
 }
-
 .oo-ui-buttonOptionWidget .oo-ui-buttonedElement-button {
   position: relative;
   height: 1.9em;
 }
-
 .oo-ui-buttonOptionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon,
 .oo-ui-buttonOptionWidget.oo-ui-indicatedElement .oo-ui-indicatedElement-indicator {
   position: static;
   display: inline-block;
+  vertical-align: middle;
   height: 1.9em;
   margin-top: 0;
-  vertical-align: middle;
 }
 
 .oo-ui-buttonSelectWidget {
 .oo-ui-inlineMenuWidget {
   position: relative;
   display: inline-block;
-  min-width: 20em;
   margin: 0.25em 0;
+  min-width: 20em;
 }
-
 .oo-ui-inlineMenuWidget-handle {
   display: inline-block;
   width: 100%;
   height: 2.5em;
   cursor: pointer;
-  -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator,
 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
   position: absolute;
   background-position: center center;
   background-repeat: no-repeat;
 }
-
 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatedElement-indicator {
   right: 0;
 }
-
 .oo-ui-inlineMenuWidget-handle .oo-ui-iconedElement-icon {
   left: 0.25em;
 }
-
 .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
-  margin: 0 0.5em;
   line-height: 2.5em;
+  margin: 0 0.5em;
 }
-
 .oo-ui-inlineMenuWidget.oo-ui-iconedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
   margin-left: 3em;
 }
-
 .oo-ui-inlineMenuWidget.oo-ui-indicatedElement .oo-ui-inlineMenuWidget-handle .oo-ui-labeledElement-label {
   margin-right: 2em;
 }
-
 .oo-ui-inlineMenuWidget .oo-ui-menuWidget {
-  z-index: 1;
   width: 100%;
+  z-index: 1;
 }
-
 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
   cursor: default;
 }
 .oo-ui-menuItemWidget {
   position: relative;
 }
-
 .oo-ui-menuItemWidget .oo-ui-iconedElement-icon {
   display: none;
 }
-
 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
   background-color: transparent;
 }
-
 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconedElement-icon {
   display: block;
 }
 .oo-ui-outlineControlsWidget {
   height: 3em;
 }
-
 .oo-ui-outlineControlsWidget-items,
 .oo-ui-outlineControlsWidget-movers {
   float: left;
   height: 2em;
-  padding: 0;
   margin: 0.5em;
+  padding: 0;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-outlineControlsWidget > .oo-ui-iconedElement-icon {
   float: left;
   width: 1.5em;
   background-position: right center;
   background-repeat: no-repeat;
 }
-
 .oo-ui-outlineControlsWidget-items {
   float: left;
   margin-left: 0;
 }
-
 .oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget {
   float: left;
 }
-
 .oo-ui-outlineControlsWidget-movers {
   float: right;
 }
-
 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
   float: right;
 }
   position: relative;
   padding: 0.75em;
   cursor: pointer;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
 
 .oo-ui-popupButtonWidget {
   position: relative;
 }
-
 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
   position: absolute;
   left: 1em;
 .oo-ui-searchWidget-query {
   position: absolute;
   top: 0;
-  right: 0;
   left: 0;
+  right: 0;
   height: 4em;
   padding: 0 1em;
 }
-
 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
   width: 100%;
   margin: 0.75em 0;
 }
-
 .oo-ui-searchWidget-results {
   position: absolute;
   top: 4em;
-  right: 0;
   bottom: 0;
   left: 0;
+  right: 0;
   padding: 1em;
   overflow-x: hidden;
   overflow-y: auto;
 .oo-ui-textInputWidget {
   position: relative;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-textInputWidget input,
 .oo-ui-textInputWidget textarea {
   display: inline-block;
   width: 100%;
-  -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
   resize: none;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
 .oo-ui-textInputWidget > .oo-ui-iconedElement-icon,
 .oo-ui-textInputWidget > .oo-ui-indicatedElement-indicator {
   position: absolute;
   top: 0;
   height: 100%;
-  cursor: pointer;
   background-repeat: no-repeat;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
+  cursor: pointer;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
-
 .oo-ui-textInputWidget > .oo-ui-iconedElement-icon {
   left: 0;
 }
-
 .oo-ui-textInputWidget > .oo-ui-indicatedElement-indicator {
   right: 0;
 }
 .oo-ui-toggleSwitchWidget {
   position: relative;
   display: inline-block;
-  width: 4em;
+  vertical-align: middle;
   height: 2em;
+  width: 4em;
   overflow: hidden;
-  vertical-align: middle;
   cursor: pointer;
-  -webkit-transform: translateZ(0);
-     -moz-transform: translateZ(0);
-      -ms-transform: translateZ(0);
-       -o-transform: translateZ(0);
-          transform: translateZ(0);
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-transform: translateZ(0px);
+  -moz-transform: translateZ(0px);
+  -ms-transform: translateZ(0px);
+  -o-transform: translateZ(0px);
+  transform: translateZ(0px);
 }
-
 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
   cursor: default;
 }
-
 .oo-ui-toggleSwitchWidget-grip {
   position: absolute;
+  display: block;
   top: 0.25em;
   left: 0.25em;
-  display: block;
   width: 1.5em;
   height: 1.5em;
   margin-top: -1px;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
   -webkit-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
-     -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
-      -ms-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
-       -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
-          transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
+  -moz-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
+  -ms-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
+  -o-transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
+  transition: left 200ms ease-in-out, margin-left 200ms ease-in-out;
 }
-
 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
   position: absolute;
   top: 0;
-  right: 0;
   bottom: 0;
+  right: 0;
   left: 0;
-  -webkit-transition: opacity 200ms ease-in-out;
-     -moz-transition: opacity 200ms ease-in-out;
-      -ms-transition: opacity 200ms ease-in-out;
-       -o-transition: opacity 200ms ease-in-out;
-          transition: opacity 200ms ease-in-out;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
   -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  -webkit-transition: opacity 200ms ease-in-out;
+  -moz-transition: opacity 200ms ease-in-out;
+  -ms-transition: opacity 200ms ease-in-out;
+  -o-transition: opacity 200ms ease-in-out;
+  transition: opacity 200ms ease-in-out;
 }
-
 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
   left: 2.25em;
   margin-left: -2px;
 }
-
 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
   left: 0.25em;
   margin-left: 0;
 }
-
 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
   display: none;
 }
 
 /* Icons */
-
 .oo-ui-icon-add-item {
   background-image: /* @embed */ url(images/icons/add-item.svg);
 }
-
 .oo-ui-icon-advanced {
   background-image: /* @embed */ url(images/icons/advanced.svg);
 }
-
 .oo-ui-icon-alert {
   background-image: /* @embed */ url(images/icons/alert.svg);
 }
-
 .oo-ui-icon-check {
   background-image: /* @embed */ url(images/icons/check.svg);
 }
-
 .oo-ui-icon-clear {
   background-image: /* @embed */ url(images/icons/clear.svg);
 }
-
 .oo-ui-icon-close {
   background-image: /* @embed */ url(images/icons/close.svg);
 }
-
 .oo-ui-icon-code {
   background-image: /* @embed */ url(images/icons/code.svg);
 }
-
 .oo-ui-icon-collapse {
   background-image: /* @embed */ url(images/icons/collapse.svg);
 }
-
 .oo-ui-icon-comment {
   background-image: /* @embed */ url(images/icons/comment.svg);
 }
-
 .oo-ui-icon-expand {
   background-image: /* @embed */ url(images/icons/expand.svg);
 }
-
 .oo-ui-icon-help {
   background-image: /* @embed */ url(images/icons/help.svg);
 }
-
 .oo-ui-icon-info {
   background-image: /* @embed */ url(images/icons/info.svg);
 }
-
 .oo-ui-icon-link {
   background-image: /* @embed */ url(images/icons/link.svg);
 }
-
 .oo-ui-icon-menu {
   background-image: /* @embed */ url(images/icons/menu.svg);
 }
-
 .oo-ui-icon-next {
   background-image: /* @embed */ url(images/icons/move-ltr.svg);
 }
-
 .oo-ui-icon-picture {
   background-image: /* @embed */ url(images/icons/picture.svg);
 }
-
 .oo-ui-icon-previous {
   background-image: /* @embed */ url(images/icons/move-rtl.svg);
 }
-
 .oo-ui-icon-redo {
   background-image: /* @embed */ url(images/icons/arched-arrow-ltr.svg);
 }
-
 .oo-ui-icon-remove {
   background-image: /* @embed */ url(images/icons/remove.svg);
 }
-
 .oo-ui-icon-search {
   background-image: /* @embed */ url(images/icons/search.svg);
 }
-
 .oo-ui-icon-settings {
   background-image: /* @embed */ url(images/icons/settings.svg);
 }
-
 .oo-ui-icon-tag {
   background-image: /* @embed */ url(images/icons/tag.svg);
 }
-
 .oo-ui-icon-undo {
   background-image: /* @embed */ url(images/icons/arched-arrow-rtl.svg);
 }
-
 .oo-ui-icon-window {
   background-image: /* @embed */ url(images/icons/window.svg);
 }
-
 /* Indicators */
-
 .oo-ui-indicator-alert {
   background-image: /* @embed */ url(images/indicators/alert.svg);
 }
-
 .oo-ui-indicator-down {
   background-image: /* @embed */ url(images/indicators/arrow-down.svg);
 }
-
 .oo-ui-indicator-next {
   background-image: /* @embed */ url(images/indicators/arrow-ltr.svg);
 }
-
 .oo-ui-indicator-previous {
   background-image: /* @embed */ url(images/indicators/arrow-rtl.svg);
 }
-
 .oo-ui-indicator-required {
   background-image: /* @embed */ url(images/indicators/required.svg);
 }
-
 .oo-ui-indicator-up {
   background-image: /* @embed */ url(images/indicators/arrow-up.svg);
-}
\ No newline at end of file
+}