Trevor Parscal has uploaded a new change for review. https://gerrit.wikimedia.org/r/146910
Change subject: Update OOjs UI to v0.1.0-pre (54a54f1cb6) ...................................................................... Update OOjs UI to v0.1.0-pre (54a54f1cb6) New changes: 54a54f1 [WIP] Get OOUI working with mobile again Change-Id: I0fc02c5cae38751ebcc41e41e461bdc8acb31ee3 --- M resources/lib/oojs-ui/oojs-ui-agora.css M resources/lib/oojs-ui/oojs-ui-apex.css M resources/lib/oojs-ui/oojs-ui.js M resources/lib/oojs-ui/oojs-ui.svg.css 4 files changed, 452 insertions(+), 175 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core refs/changes/10/146910/1 diff --git a/resources/lib/oojs-ui/oojs-ui-agora.css b/resources/lib/oojs-ui/oojs-ui-agora.css index 5b35674..732e499 100644 --- a/resources/lib/oojs-ui/oojs-ui-agora.css +++ b/resources/lib/oojs-ui/oojs-ui-agora.css @@ -1,56 +1,173 @@ /*! - * OOjs UI v0.1.0-pre (d2451ac748) + * OOjs UI v0.1.0-pre (54a54f1cb6) * 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-07-14T16:49:51Z + * Date: 2014-07-16T20:25:27Z */ -.oo-ui-dialog-content .oo-ui-window-closeButton { +.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; - top: 0; - left: 0; -} - -.oo-ui-dialog-content .oo-ui-window-icon { - margin-left: 3.35em; -} - -.oo-ui-dialog-content .oo-ui-window-body { - position: absolute; - top: 3.35em; right: 0; - bottom: 0; left: 0; - overflow-y: auto; + overflow: hidden; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-dialog-content .oo-ui-window-foot { - position: absolute; +.oo-ui-dialog-content > .oo-ui-window-head { top: 0; - right: 0; - height: 3.35em; + z-index: 1; } -.oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-button { - height: 100%; -} - -.oo-ui-dialog-content .oo-ui-window-foot .oo-ui-buttonedElement-button .oo-ui-labeledElement-label { - display: inline-block; - width: 0; - text-indent: -9999px; -} - -.oo-ui-dialog-medium .oo-ui-window-frame { +.oo-ui-dialog-content > .oo-ui-window-body { top: 0; bottom: 0; - background-color: white; + z-index: 2; } -.oo-ui-window-head { +.oo-ui-dialog-content > .oo-ui-window-foot { + bottom: 0; + z-index: 1; +} + +.oo-ui-dialog-content > .oo-ui-window-overlay { + z-index: 3; +} + +.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; +} + +.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame { + top: 1em; + bottom: 1em; + 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); + -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; +} + +.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); +} + +.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame { + border: solid 1px #ccc; + border-radius: 0.5em; + box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.3); +} + +.oo-ui-messageDialog-title, +.oo-ui-messageDialog-message { + display: block; + padding-top: 0.5em; + text-align: center; +} + +.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; +} + +.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.35em; border-bottom: 1px solid #dddddd; -webkit-box-sizing: border-box; @@ -58,19 +175,162 @@ box-sizing: border-box; } -.oo-ui-window-body { - padding: 2em 3.35em; +.oo-ui-processDialog-content .oo-ui-window-body { + top: 3.35em; + padding: 2em 0; } -.oo-ui-window-icon { - width: 3.35em; +.oo-ui-processDialog-navigation { + position: relative; height: 3.35em; - background-size: 2em auto; - border-left: 1px solid #dddddd; + padding: 0 1em; } -.oo-ui-window-title { - line-height: 3.35em; +.oo-ui-processDialog-location { + height: 3.35em; + padding: 0.25em 0; + text-align: center; + cursor: default; +} + +.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 { + min-width: 1.85em; + min-height: 1.85em; + padding-top: 0.75em; + padding-bottom: 0.75em; +} + +.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.85em; +} + +.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 { + padding: 0; + vertical-align: middle; +} + +.oo-ui-processDialog-actions-safe.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button, +.oo-ui-processDialog-actions-primary.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button { + margin: 0.75em; +} + +.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-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-actions-other:not(:empty) { + padding: 0.75em; +} + +.oo-ui-processDialog-actions-other:not(:empty) .oo-ui-actionWidget { + margin: 0 0.75em 0 0; + border: solid 1px #ccc; + border-radius: 0.25em; +} + +.oo-ui-processDialog > .oo-ui-window-frame { + min-height: 5em; +} + +.oo-ui-processDialog-errors { + 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; +} + +.oo-ui-processDialog-error { + padding: 1em; + margin: 1em; + text-align: left; + background-color: #fff7f7; + border: solid 1px #ff9e9e; + border-radius: 0.25em; } .oo-ui-buttonedElement.oo-ui-indicatedElement .oo-ui-buttonedElement-button > .oo-ui-indicatedElement-indicator, @@ -122,6 +382,10 @@ padding: 0; } +.oo-ui-lookupWidget-menu { + background-color: #fff; +} + .oo-ui-menuItemWidget.oo-ui-optionWidget-selected { color: #ffffff; background: #347bff; diff --git a/resources/lib/oojs-ui/oojs-ui-apex.css b/resources/lib/oojs-ui/oojs-ui-apex.css index aeba582..f290dfd 100644 --- a/resources/lib/oojs-ui/oojs-ui-apex.css +++ b/resources/lib/oojs-ui/oojs-ui-apex.css @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.1.0-pre (d2451ac748) + * OOjs UI v0.1.0-pre (54a54f1cb6) * 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-07-14T16:49:51Z + * Date: 2014-07-16T20:25:27Z */ .oo-ui-dialog-content > .oo-ui-window-head, .oo-ui-dialog-content > .oo-ui-window-body, @@ -93,12 +93,6 @@ color: #000; } -.oo-ui-window > .oo-ui-window-frame { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - .oo-ui-window-content { background: transparent; } @@ -110,7 +104,6 @@ } .oo-ui-windowManager-modal > .oo-ui-dialog { - background-color: #fff; background-color: rgba(255, 255, 255, 0.5); opacity: 0; -webkit-transition: opacity 250ms ease-in-out; @@ -124,14 +117,11 @@ top: 1em; bottom: 1em; background-color: #fff; - border: solid 1px #ccc; - border-radius: 0.5em; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); transform: scale(0.5); - box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.3); -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; @@ -151,34 +141,33 @@ transform: scale(1); } -.oo-ui-windowManager-fullscreen > .oo-ui-dialog > .oo-ui-window-frame { - top: 0; - bottom: 0; - width: 100%; - height: 100%; - border: none; - border-radius: 0; - box-shadow: none; +.oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame { + border: solid 1px #ccc; + border-radius: 0.5em; + box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.3); } -.oo-ui-messageDialog-text.oo-ui-panelLayout { - bottom: auto; +.oo-ui-messageDialog-content .oo-ui-window-body { + box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25); +} + +.oo-ui-messageDialog-title, +.oo-ui-messageDialog-message { + display: block; + padding-top: 0.5em; + text-align: center; } .oo-ui-messageDialog-title { - display: block; - padding-top: 0; font-size: 1.5em; + line-height: 1em; color: #000; - text-align: center; } .oo-ui-messageDialog-message { - display: block; font-size: 0.9em; line-height: 1.25em; color: #666; - text-align: center; } .oo-ui-messageDialog-message-verbose { @@ -187,24 +176,7 @@ text-align: left; } -.oo-ui-messageDialog-content > .oo-ui-window-body { - bottom: 3.4em; - box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25); -} - -.oo-ui-messageDialog-content > .oo-ui-window-foot { - min-height: 3.4em; -} - -.oo-ui-messageDialog-actions-horizontal { - display: table; - width: 100%; - table-layout: fixed; -} - .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget { - display: table-cell; - width: 1%; border-right: solid 1px #e5e5e5; } @@ -212,14 +184,7 @@ border-right-width: 0; } -.oo-ui-messageDialog-actions-vertical { - display: block; -} - .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget { - display: block; - overflow: hidden; - text-overflow: ellipsis; border-bottom: solid 1px #e5e5e5; } @@ -227,10 +192,9 @@ border-bottom-width: 0; } -.oo-ui-messageDialog-actions .oo-ui-actionWidget { - position: relative; - height: 3.4em; - padding: 0; +.oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labeledElement-label { + padding: 0 2em; + line-height: 3.4em; text-align: center; } @@ -270,25 +234,11 @@ background-color: rgba(212, 83, 83, 0.1); } -.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; - bottom: auto; - display: inline; - padding: 0 2em; - line-height: 3.4em; - white-space: nowrap; -} - -.oo-ui-processDialog-content > .oo-ui-window-head { +.oo-ui-processDialog-content .oo-ui-window-head { height: 3.4em; } -.oo-ui-processDialog-content > .oo-ui-window-body { +.oo-ui-processDialog-content .oo-ui-window-body { top: 3.4em; box-shadow: 0 0 0.66em rgba(0, 0, 0, 0.25); } @@ -297,36 +247,18 @@ position: relative; height: 3.4em; padding: 0 1em; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-touch-callout: none; } .oo-ui-processDialog-location { height: 1.9em; padding: 0.75em 0; - overflow: hidden; text-align: center; - text-overflow: ellipsis; - white-space: nowrap; cursor: default; -} - -.oo-ui-processDialog-location .oo-ui-labelWidget { - display: inline; } .oo-ui-processDialog-title { font-weight: bold; line-height: 1.9em; -} - -.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-actionWidget .oo-ui-buttonedElement-button, @@ -357,13 +289,6 @@ .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-processDialog-actions-primary { - position: absolute; - top: 0; - bottom: 0; } .oo-ui-processDialog-actions-safe.oo-ui-buttonedElement-framed .oo-ui-buttonedElement-button, @@ -416,20 +341,12 @@ background-color: rgba(212, 83, 83, 0.1); } -.oo-ui-processDialog-actions-safe { - left: 0; -} - .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 { - right: 0; } .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconedElement .oo-ui-iconedElement-icon { @@ -453,16 +370,7 @@ } .oo-ui-processDialog-errors { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 2; - display: none; padding: 3em 3em 1.5em 3em; - overflow-x: hidden; - overflow-y: auto; text-align: center; background-color: rgba(255, 255, 255, 0.9); } @@ -695,14 +603,6 @@ .oo-ui-fieldsetLayout > .oo-ui-labeledElement-label { font-size: 1.5em; -} - -.oo-ui-panelLayout { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; } .oo-ui-panelLayout-padded { diff --git a/resources/lib/oojs-ui/oojs-ui.js b/resources/lib/oojs-ui/oojs-ui.js index 68d4be6..1a9b321 100644 --- a/resources/lib/oojs-ui/oojs-ui.js +++ b/resources/lib/oojs-ui/oojs-ui.js @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.1.0-pre (d2451ac748) + * OOjs UI v0.1.0-pre (54a54f1cb6) * 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-07-14T16:49:51Z + * Date: 2014-07-16T20:25:27Z */ ( function ( OO ) { @@ -2345,7 +2345,7 @@ // Properties this.factory = config.factory; - this.modal = config.modal === undefined ? true : !!config.modal; + this.modal = config.modal === undefined || !!config.modal; this.windows = {}; this.opening = null; this.opened = null; @@ -2909,6 +2909,7 @@ } this.$element.toggleClass( 'oo-ui-windowManager-fullscreen', size === 'full' ); + this.$element.toggleClass( 'oo-ui-windowManager-floating', size !== 'full' ); win.setDimensions( sizes[size] ); return this; @@ -2931,7 +2932,7 @@ // Properties this.message = message instanceof jQuery ? message : String( message ); - this.recoverable = config.recoverable === undefined ? true : !!config.recoverable; + this.recoverable = config.recoverable === undefined || !!config.recoverable; }; /* Setup */ @@ -5236,7 +5237,7 @@ '$': this.$, 'scrollable': true, 'classes': [ 'oo-ui-messageDialog-container' ] } ); this.text = new OO.ui.PanelLayout( { - '$': this.$, 'padded': true, 'classes': [ 'oo-ui-messageDialog-text' ] + '$': this.$, 'padded': true, 'expanded': false, 'classes': [ 'oo-ui-messageDialog-text' ] } ); this.message = new OO.ui.LabelWidget( { '$': this.$, 'classes': [ 'oo-ui-messageDialog-message' ] @@ -5545,7 +5546,7 @@ this.pages = {}; this.ignoreFocus = false; this.stackLayout = new OO.ui.StackLayout( { '$': this.$, 'continuous': !!config.continuous } ); - this.autoFocus = config.autoFocus === undefined ? true : !!config.autoFocus; + this.autoFocus = config.autoFocus === undefined || !!config.autoFocus; this.outlineVisible = false; this.outlined = !!config.outlined; if ( this.outlined ) { @@ -6325,8 +6326,9 @@ * * @constructor * @param {Object} [config] Configuration options - * @cfg {boolean} [scrollable] Allow vertical scrolling - * @cfg {boolean} [padded] Pad the content from the edges + * @cfg {boolean} [scrollable=false] Allow vertical scrolling + * @cfg {boolean} [padded=false] Pad the content from the edges + * @cfg {boolean} [expanded=true] Expand size to fill the entire parent element */ OO.ui.PanelLayout = function OoUiPanelLayout( config ) { // Config initialization @@ -6343,6 +6345,10 @@ if ( config.padded ) { this.$element.addClass( 'oo-ui-panelLayout-padded' ); + } + + if ( config.expanded === undefined || config.expanded ) { + this.$element.addClass( 'oo-ui-panelLayout-expanded' ); } }; @@ -9148,7 +9154,7 @@ this.autoClose = !!config.autoClose; this.$autoCloseIgnore = config.$autoCloseIgnore; this.transitionTimeout = null; - this.anchor = false; + this.anchor = null; this.width = config.width !== undefined ? config.width : 320; this.height = config.height !== undefined ? config.height : null; this.align = config.align || 'center'; @@ -9159,7 +9165,7 @@ this.closeButton.connect( this, { 'click': 'onCloseButtonClick' } ); // Initialization - this.toggleAnchor( config.anchor !== undefined ? !!config.anchor : true ); + this.toggleAnchor( config.anchor === undefined || config.anchor ); this.$body.addClass( 'oo-ui-popupWidget-body' ); this.$anchor.addClass( 'oo-ui-popupWidget-anchor' ); this.$head diff --git a/resources/lib/oojs-ui/oojs-ui.svg.css b/resources/lib/oojs-ui/oojs-ui.svg.css index 8c2b3f1..85343d2 100644 --- a/resources/lib/oojs-ui/oojs-ui.svg.css +++ b/resources/lib/oojs-ui/oojs-ui.svg.css @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.1.0-pre (d2451ac748) + * OOjs UI v0.1.0-pre (54a54f1cb6) * 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-07-14T16:49:51Z + * Date: 2014-07-16T20:25:27Z */ /* Textures */ @@ -112,7 +112,13 @@ line-height: 1em; } -.oo-ui-window-frame > .oo-ui-frame { +> .oo-ui-window-frame { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +> .oo-ui-window-frame > .oo-ui-frame { width: 100%; height: 100%; } @@ -162,6 +168,95 @@ .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame .oo-ui-frame { width: 100%; height: 100%; +} + +.oo-ui-windowManager-fullscreen > .oo-ui-dialog > .oo-ui-window-frame { + top: 0; + bottom: 0; + width: 100%; + height: 100%; +} + +.oo-ui-messageDialog-actions-horizontal { + display: table; + width: 100%; + table-layout: fixed; +} + +.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; + bottom: auto; + display: inline; + white-space: nowrap; +} + +.oo-ui-processDialog-location { + overflow: hidden; + 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 { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 2; + display: none; + padding: 3em 3em 1.5em 3em; + overflow-x: hidden; + overflow-y: auto; } .oo-ui-buttonedElement > .oo-ui-buttonedElement-button { @@ -370,10 +465,22 @@ padding: 0.5em 0; } +.oo-ui-panelLayout { + position: relative; +} + .oo-ui-panelLayout-scrollable { overflow-y: auto; } +.oo-ui-panelLayout-expanded { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; +} + .oo-ui-stackLayout > .oo-ui-panelLayout { display: none; } -- To view, visit https://gerrit.wikimedia.org/r/146910 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I0fc02c5cae38751ebcc41e41e461bdc8acb31ee3 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/core Gerrit-Branch: master Gerrit-Owner: Trevor Parscal <[email protected]> _______________________________________________ MediaWiki-commits mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
