From e310a0b017020c8b88b3ef25a928af6ea89222dd Mon Sep 17 00:00:00 2001 From: "James D. Forrester" Date: Tue, 2 Feb 2016 14:10:54 -0800 Subject: [PATCH] Update OOjs UI to v0.15.2 Release notes: https://git.wikimedia.org/blob/oojs%2Fui.git/v0.15.2/History.md Change-Id: I8124a726660443ce514c48182871d46e6b086a10 --- composer.json | 2 +- resources/lib/oojs-ui/i18n/cdo.json | 23 + resources/lib/oojs-ui/i18n/hy.json | 2 +- resources/lib/oojs-ui/i18n/it.json | 5 +- resources/lib/oojs-ui/i18n/sh.json | 7 +- resources/lib/oojs-ui/i18n/xmf.json | 9 +- resources/lib/oojs-ui/i18n/zh-hans.json | 5 +- .../lib/oojs-ui/oojs-ui-apex-noimages.css | 3291 +- resources/lib/oojs-ui/oojs-ui-apex.js | 10 +- .../oojs-ui/oojs-ui-mediawiki-noimages.css | 3140 +- resources/lib/oojs-ui/oojs-ui-mediawiki.js | 10 +- resources/lib/oojs-ui/oojs-ui.js | 29984 ++++++++-------- .../themes/mediawiki/icons-accessibility.json | 2 +- .../themes/mediawiki/icons-alerts.json | 2 +- .../themes/mediawiki/icons-content.json | 2 +- .../mediawiki/icons-editing-advanced.json | 2 +- .../themes/mediawiki/icons-editing-core.json | 10 +- .../themes/mediawiki/icons-editing-list.json | 2 +- .../mediawiki/icons-editing-styling.json | 2 +- .../themes/mediawiki/icons-interactions.json | 2 +- .../themes/mediawiki/icons-layout.json | 10 +- .../themes/mediawiki/icons-location.json | 2 +- .../oojs-ui/themes/mediawiki/icons-media.json | 2 +- .../themes/mediawiki/icons-moderation.json | 10 +- .../themes/mediawiki/icons-movement.json | 2 +- .../themes/mediawiki/icons-wikimedia.json | 2 +- .../lib/oojs-ui/themes/mediawiki/icons.json | 10 +- .../images/icons/add-constructive.svg | 2 +- .../mediawiki/images/icons/add-invert.svg | 2 +- .../images/icons/advanced-invert.svg | 2 +- .../mediawiki/images/icons/alert-invert.svg | 2 +- .../mediawiki/images/icons/alert-warning.svg | 2 +- .../images/icons/align-center-invert.svg | 2 +- .../images/icons/align-float-left-invert.svg | 2 +- .../images/icons/align-float-right-invert.svg | 2 +- .../images/icons/arched-arrow-ltr-invert.svg | 2 +- .../images/icons/arched-arrow-rtl-invert.svg | 2 +- .../images/icons/arrow-ltr-invert.svg | 2 +- .../images/icons/arrow-rtl-invert.svg | 2 +- .../images/icons/article-ltr-invert.svg | 2 +- .../images/icons/article-rtl-invert.svg | 2 +- .../images/icons/articleCheck-ltr-invert.svg | 2 +- .../images/icons/articleCheck-rtl-invert.svg | 2 +- .../icons/articleRedirect-ltr-invert.svg | 2 +- .../icons/articleRedirect-rtl-invert.svg | 2 +- .../images/icons/articleSearch-ltr-invert.svg | 2 +- .../images/icons/articleSearch-rtl-invert.svg | 2 +- .../mediawiki/images/icons/bell-invert.svg | 2 +- .../images/icons/bellOn-ltr-invert.svg | 2 +- .../images/icons/bellOn-rtl-invert.svg | 2 +- .../mediawiki/images/icons/beta-invert.svg | 2 +- .../images/icons/betaLaunch-invert.svg | 2 +- .../images/icons/bigger-ltr-invert.svg | 2 +- .../images/icons/bigger-rtl-invert.svg | 2 +- .../images/icons/block-destructive.svg | 2 +- .../mediawiki/images/icons/block-invert.svg | 2 +- .../images/icons/blockUndo-ltr-invert.svg | 2 +- .../images/icons/blockUndo-rtl-invert.svg | 2 +- .../mediawiki/images/icons/bold-a-invert.svg | 2 +- .../images/icons/bold-arab-ain-invert.svg | 2 +- .../images/icons/bold-arab-dad-invert.svg | 2 +- .../images/icons/bold-armn-to-invert.svg | 2 +- .../mediawiki/images/icons/bold-b-invert.svg | 2 +- .../images/icons/bold-cyrl-be-invert.svg | 2 +- .../images/icons/bold-cyrl-te-invert.svg | 2 +- .../images/icons/bold-cyrl-zhe-invert.svg | 2 +- .../mediawiki/images/icons/bold-f-invert.svg | 2 +- .../mediawiki/images/icons/bold-g-invert.svg | 2 +- .../images/icons/bold-geor-man-invert.svg | 2 +- .../mediawiki/images/icons/bold-l-invert.svg | 2 +- .../mediawiki/images/icons/bold-n-invert.svg | 2 +- .../mediawiki/images/icons/bold-v-invert.svg | 2 +- .../images/icons/book-ltr-invert.svg | 2 +- .../images/icons/book-rtl-invert.svg | 2 +- .../images/icons/bookmark-ltr-invert.svg | 2 +- .../images/icons/bookmark-rtl-invert.svg | 2 +- .../mediawiki/images/icons/bright-invert.svg | 2 +- .../images/icons/browser-ltr-invert.svg | 2 +- .../images/icons/browser-rtl-invert.svg | 2 +- .../images/icons/calendar-ltr-invert.svg | 2 +- .../images/icons/calendar-rtl-invert.svg | 2 +- .../images/icons/cancel-destructive.svg | 2 +- .../mediawiki/images/icons/cancel-invert.svg | 2 +- .../images/icons/caret-ltr-invert.svg | 2 +- .../images/icons/caret-rtl-invert.svg | 2 +- .../images/icons/caretDown-invert.svg | 2 +- .../mediawiki/images/icons/caretUp-invert.svg | 2 +- .../images/icons/case-sensitive-invert.svg | 2 +- .../images/icons/check-constructive.svg | 2 +- .../images/icons/check-destructive.svg | 2 +- .../mediawiki/images/icons/check-invert.svg | 2 +- .../images/icons/check-progressive.svg | 2 +- .../images/icons/circle-constructive.svg | 2 +- .../mediawiki/images/icons/circle-invert.svg | 2 +- .../images/icons/citeArticle-ltr-invert.svg | 2 +- .../images/icons/citeArticle-rtl-invert.svg | 2 +- .../mediawiki/images/icons/clear-invert.svg | 2 +- .../mediawiki/images/icons/clock-invert.svg | 2 +- .../images/icons/close-ltr-invert.svg | 2 +- .../images/icons/close-rtl-invert.svg | 2 +- .../mediawiki/images/icons/code-invert.svg | 2 +- .../images/icons/collapse-invert.svg | 2 +- .../mediawiki/images/icons/comment-invert.svg | 2 +- .../mediawiki/images/icons/die-ltr-invert.svg | 2 +- .../mediawiki/images/icons/die-rtl-invert.svg | 2 +- .../images/icons/downTriangle-invert.svg | 2 +- .../images/icons/download-ltr-invert.svg | 2 +- .../images/icons/download-rtl-invert.svg | 2 +- .../images/icons/edit-ltr-invert.svg | 2 +- .../images/icons/edit-ltr-progressive.svg | 2 +- .../images/icons/edit-rtl-invert.svg | 2 +- .../images/icons/edit-rtl-progressive.svg | 2 +- .../images/icons/editLock-ltr-invert.svg | 2 +- .../images/icons/editLock-rtl-invert.svg | 2 +- .../images/icons/editUndo-ltr-invert.svg | 2 +- .../images/icons/editUndo-rtl-invert.svg | 2 +- .../images/icons/ellipsis-invert.svg | 2 +- .../mediawiki/images/icons/expand-invert.svg | 2 +- .../images/icons/external-link-ltr-invert.svg | 2 +- .../images/icons/external-link-rtl-invert.svg | 2 +- .../mediawiki/images/icons/eye-invert.svg | 2 +- .../images/icons/eyeClosed-invert.svg | 2 +- .../images/icons/find-ltr-invert.svg | 2 +- .../images/icons/find-rtl-invert.svg | 2 +- .../images/icons/flag-ltr-invert.svg | 2 +- .../images/icons/flag-rtl-invert.svg | 2 +- .../images/icons/flagUndo-ltr-invert.svg | 2 +- .../images/icons/flagUndo-rtl-invert.svg | 2 +- .../icons/folderPlaceholder-ltr-invert.svg | 2 +- .../icons/folderPlaceholder-rtl-invert.svg | 2 +- .../images/icons/funnel-ltr-invert.svg | 2 +- .../images/icons/funnel-rtl-invert.svg | 2 +- .../images/icons/halfBright-invert.svg | 2 +- .../mediawiki/images/icons/heart-invert.svg | 2 +- .../images/icons/help-ltr-invert.svg | 2 +- .../images/icons/help-rtl-invert.svg | 2 +- .../mediawiki/images/icons/history-invert.svg | 2 +- .../images/icons/image-ltr-invert.svg | 2 +- .../images/icons/image-rtl-invert.svg | 2 +- .../images/icons/imageAdd-ltr-invert.svg | 2 +- .../images/icons/imageAdd-rtl-invert.svg | 2 +- .../images/icons/imageGallery-ltr-invert.svg | 2 +- .../images/icons/imageGallery-rtl-invert.svg | 2 +- .../images/icons/imageLock-ltr-invert.svg | 2 +- .../images/icons/imageLock-rtl-invert.svg | 2 +- .../images/icons/indent-ltr-invert.svg | 2 +- .../images/icons/indent-rtl-invert.svg | 2 +- .../mediawiki/images/icons/info-invert.svg | 2 +- .../images/icons/italic-a-invert.svg | 2 +- .../icons/italic-arab-keheh-jeem-invert.svg | 2 +- .../images/icons/italic-arab-meem-invert.svg | 2 +- .../images/icons/italic-armn-sha-invert.svg | 2 +- .../images/icons/italic-c-invert.svg | 2 +- .../images/icons/italic-d-invert.svg | 2 +- .../images/icons/italic-e-invert.svg | 2 +- .../images/icons/italic-geor-kan-invert.svg | 2 +- .../images/icons/italic-i-invert.svg | 2 +- .../images/icons/italic-k-invert.svg | 2 +- .../images/icons/italic-s-invert.svg | 2 +- .../images/icons/journal-ltr-invert.svg | 2 +- .../images/icons/journal-rtl-invert.svg | 2 +- .../mediawiki/images/icons/key-ltr-invert.svg | 2 +- .../mediawiki/images/icons/key-rtl-invert.svg | 2 +- .../images/icons/keyboard-ltr-invert.svg | 2 +- .../images/icons/keyboard-rtl-invert.svg | 2 +- .../images/icons/language-ltr-invert.svg | 2 +- .../images/icons/language-rtl-invert.svg | 2 +- .../images/icons/largerText-ltr-invert.svg | 2 +- .../images/icons/largerText-rtl-invert.svg | 2 +- .../images/icons/layout-ltr-invert.svg | 2 +- .../images/icons/layout-rtl-invert.svg | 2 +- .../images/icons/link-ltr-invert.svg | 2 +- .../images/icons/link-rtl-invert.svg | 2 +- .../images/icons/listBullet-ltr-invert.svg | 2 +- .../images/icons/listBullet-rtl-invert.svg | 2 +- .../images/icons/listNumbered-ltr-invert.svg | 2 +- .../images/icons/listNumbered-rtl-invert.svg | 2 +- .../images/icons/lock-ltr-destructive.svg | 2 +- .../images/icons/lock-ltr-invert.svg | 2 +- .../images/icons/lock-rtl-destructive.svg | 2 +- .../images/icons/lock-rtl-invert.svg | 2 +- .../images/icons/logOut-ltr-invert.svg | 2 +- .../images/icons/logOut-rtl-invert.svg | 2 +- .../mediawiki/images/icons/logo-cc-invert.svg | 2 +- .../icons/logo-wikimediaCommons-invert.svg | 2 +- .../images/icons/logo-wikipedia-invert.svg | 2 +- .../mediawiki/images/icons/map-ltr-invert.svg | 2 +- .../mediawiki/images/icons/map-rtl-invert.svg | 2 +- .../mediawiki/images/icons/mapPin-invert.svg | 2 +- .../images/icons/mapPinAdd-ltr-invert.svg | 2 +- .../images/icons/mapPinAdd-rtl-invert.svg | 2 +- .../mediawiki/images/icons/menu-invert.svg | 2 +- .../images/icons/message-ltr-invert.svg | 2 +- .../images/icons/message-rtl-invert.svg | 2 +- .../mediawiki/images/icons/moon-invert.svg | 2 +- .../mediawiki/images/icons/move-invert.svg | 2 +- .../images/icons/move-ltr-invert.svg | 2 +- .../images/icons/move-rtl-invert.svg | 2 +- .../images/icons/newWindow-ltr-invert.svg | 2 +- .../images/icons/newWindow-rtl-invert.svg | 2 +- .../images/icons/newline-ltr-invert.svg | 2 +- .../images/icons/newline-rtl-invert.svg | 2 +- .../images/icons/newspaper-ltr-invert.svg | 2 +- .../images/icons/newspaper-rtl-invert.svg | 2 +- .../images/icons/noWikiText-ltr-invert.svg | 2 +- .../images/icons/noWikiText-rtl-invert.svg | 2 +- .../images/icons/notBright-invert.svg | 2 +- .../mediawiki/images/icons/notice-invert.svg | 2 +- .../icons/ongoingConversation-ltr-invert.svg | 2 +- .../ongoingConversation-ltr-progressive.svg | 2 +- .../icons/ongoingConversation-rtl-invert.svg | 2 +- .../ongoingConversation-rtl-progressive.svg | 2 +- .../images/icons/outdent-ltr-invert.svg | 2 +- .../images/icons/outdent-rtl-invert.svg | 2 +- .../images/icons/outline-ltr-invert.svg | 2 +- .../images/icons/outline-rtl-invert.svg | 2 +- .../images/icons/play-ltr-invert.svg | 2 +- .../images/icons/play-rtl-invert.svg | 2 +- .../images/icons/printer-ltr-invert.svg | 2 +- .../images/icons/printer-rtl-invert.svg | 2 +- .../images/icons/puzzle-ltr-invert.svg | 2 +- .../images/icons/puzzle-rtl-invert.svg | 2 +- .../images/icons/quotes-ltr-invert.svg | 2 +- .../images/icons/quotes-rtl-invert.svg | 2 +- .../images/icons/quotesAdd-ltr-invert.svg | 2 +- .../images/icons/quotesAdd-rtl-invert.svg | 2 +- .../icons/regular-expression-invert.svg | 2 +- .../images/icons/ribbonPrize-invert.svg | 2 +- .../images/icons/search-ltr-invert.svg | 2 +- .../images/icons/search-rtl-invert.svg | 2 +- .../images/icons/secure-link-invert.svg | 2 +- .../images/icons/settings-invert.svg | 2 +- .../images/icons/signature-ltr-invert.svg | 2 +- .../images/icons/signature-rtl-invert.svg | 2 +- .../images/icons/smaller-ltr-invert.svg | 2 +- .../images/icons/smaller-rtl-invert.svg | 2 +- .../images/icons/smallerText-ltr-invert.svg | 2 +- .../images/icons/smallerText-rtl-invert.svg | 2 +- .../images/icons/specialCharacter-invert.svg | 2 +- .../images/icons/speechBubble-ltr-invert.svg | 2 +- .../images/icons/speechBubble-rtl-invert.svg | 2 +- .../icons/speechBubbleAdd-ltr-invert.svg | 2 +- .../icons/speechBubbleAdd-rtl-invert.svg | 2 +- .../images/icons/speechBubbles-ltr-invert.svg | 2 +- .../images/icons/speechBubbles-rtl-invert.svg | 2 +- .../images/icons/star-constructive.svg | 2 +- .../mediawiki/images/icons/star-invert.svg | 2 +- .../mediawiki/images/icons/stop-invert.svg | 2 +- .../images/icons/strikethrough-a-invert.svg | 2 +- .../images/icons/strikethrough-s-invert.svg | 2 +- .../images/icons/strikethrough-y-invert.svg | 2 +- .../images/icons/stripeFlow-ltr-invert.svg | 2 +- .../images/icons/stripeFlow-rtl-invert.svg | 2 +- .../images/icons/stripeSideMenu-invert.svg | 2 +- .../images/icons/stripeSummary-ltr-invert.svg | 2 +- .../images/icons/stripeSummary-rtl-invert.svg | 2 +- .../images/icons/stripeToC-ltr-invert.svg | 2 +- .../icons/stripeToC-ltr-progressive.svg | 2 +- .../images/icons/stripeToC-rtl-invert.svg | 2 +- .../icons/stripeToC-rtl-progressive.svg | 2 +- .../images/icons/subscript-ltr-invert.svg | 2 +- .../images/icons/subscript-rtl-invert.svg | 2 +- .../mediawiki/images/icons/sun-ltr-invert.svg | 2 +- .../mediawiki/images/icons/sun-rtl-invert.svg | 2 +- .../images/icons/superscript-ltr-invert.svg | 2 +- .../images/icons/superscript-rtl-invert.svg | 2 +- .../images/icons/table-caption-invert.svg | 2 +- .../icons/table-insert-column-ltr-invert.svg | 2 +- .../icons/table-insert-column-rtl-invert.svg | 2 +- .../icons/table-insert-row-after-invert.svg | 2 +- .../icons/table-insert-row-before-invert.svg | 2 +- .../mediawiki/images/icons/table-invert.svg | 2 +- .../images/icons/table-merge-cells-invert.svg | 2 +- .../images/icons/tag-constructive.svg | 2 +- .../images/icons/tag-destructive.svg | 2 +- .../mediawiki/images/icons/tag-invert.svg | 2 +- .../images/icons/tag-progressive.svg | 2 +- .../mediawiki/images/icons/tag-warning.svg | 2 +- .../images/icons/templateAdd-ltr-invert.svg | 2 +- .../images/icons/templateAdd-rtl-invert.svg | 2 +- .../icons/text-dir-lefttoright-invert.svg | 2 +- .../icons/text-dir-righttoleft-invert.svg | 2 +- .../images/icons/text-style-invert.svg | 2 +- .../images/icons/trash-destructive.svg | 2 +- .../mediawiki/images/icons/trash-invert.svg | 2 +- .../images/icons/trashUndo-ltr-invert.svg | 2 +- .../images/icons/trashUndo-rtl-invert.svg | 2 +- .../images/icons/unLock-ltr-destructive.svg | 2 +- .../images/icons/unLock-ltr-invert.svg | 2 +- .../images/icons/unLock-rtl-destructive.svg | 2 +- .../images/icons/unLock-rtl-invert.svg | 2 +- .../images/icons/unStar-constructive.svg | 2 +- .../mediawiki/images/icons/unStar-invert.svg | 2 +- .../images/icons/underline-a-invert.svg | 2 +- .../images/icons/underline-u-invert.svg | 2 +- .../images/icons/upTriangle-invert.svg | 2 +- .../images/icons/upload-ltr-invert.svg | 2 +- .../images/icons/upload-rtl-invert.svg | 2 +- .../images/icons/viewCompact-invert.svg | 2 +- .../images/icons/viewDetails-ltr-invert.svg | 2 +- .../images/icons/viewDetails-rtl-invert.svg | 2 +- .../images/icons/visionSimulator-invert.svg | 2 +- .../images/icons/watchlist-ltr-invert.svg | 2 +- .../images/icons/watchlist-rtl-invert.svg | 2 +- .../images/icons/wikiText-invert.svg | 2 +- .../images/icons/wikitrail-ltr-invert.svg | 2 +- .../images/icons/wikitrail-rtl-invert.svg | 2 +- .../mediawiki/images/icons/window-invert.svg | 2 +- .../images/indicators/alert-invert.svg | 2 +- .../images/indicators/arrow-down-invert.svg | 2 +- .../images/indicators/arrow-ltr-invert.svg | 2 +- .../images/indicators/arrow-rtl-invert.svg | 2 +- .../images/indicators/arrow-up-invert.svg | 2 +- .../images/indicators/clear-invert.svg | 2 +- .../images/indicators/required-invert.svg | 2 +- .../images/indicators/search-ltr-invert.svg | 2 +- .../images/indicators/search-rtl-invert.svg | 2 +- .../oojs-ui/themes/mediawiki/indicators.json | 2 +- 318 files changed, 18731 insertions(+), 18401 deletions(-) create mode 100644 resources/lib/oojs-ui/i18n/cdo.json diff --git a/composer.json b/composer.json index 9ff39ade19..68d290b256 100644 --- a/composer.json +++ b/composer.json @@ -21,7 +21,7 @@ "ext-iconv": "*", "liuggio/statsd-php-client": "1.0.18", "mediawiki/at-ease": "1.1.0", - "oojs/oojs-ui": "0.15.1", + "oojs/oojs-ui": "0.15.2", "oyejorge/less.php": "1.7.0.9", "php": ">=5.3.3", "psr/log": "1.0.0", diff --git a/resources/lib/oojs-ui/i18n/cdo.json b/resources/lib/oojs-ui/i18n/cdo.json new file mode 100644 index 0000000000..cb46b4371c --- /dev/null +++ b/resources/lib/oojs-ui/i18n/cdo.json @@ -0,0 +1,23 @@ +{ + "@metadata": { + "authors": [ + "Yejianfei" + ] + }, + "ooui-outline-control-move-down": "下移項目", + "ooui-outline-control-move-up": "上移項目", + "ooui-outline-control-remove": "移除項目", + "ooui-toolbar-more": "更価", + "ooui-toolgroup-expand": "更価", + "ooui-toolgroup-collapse": "更少", + "ooui-dialog-message-accept": "確定", + "ooui-dialog-message-reject": "取消", + "ooui-dialog-process-error": "什乇出毛病了", + "ooui-dialog-process-dismiss": "關閉", + "ooui-dialog-process-retry": "重試", + "ooui-dialog-process-continue": "繼續", + "ooui-selectfile-button-select": "選擇蜀萆文件", + "ooui-selectfile-not-supported": "𣍐支持選擇其文件", + "ooui-selectfile-placeholder": "未選文件", + "ooui-selectfile-dragdrop-placeholder": "共文件拖遘嚽塊" +} diff --git a/resources/lib/oojs-ui/i18n/hy.json b/resources/lib/oojs-ui/i18n/hy.json index 2cd688e868..341d0ff1b5 100644 --- a/resources/lib/oojs-ui/i18n/hy.json +++ b/resources/lib/oojs-ui/i18n/hy.json @@ -7,7 +7,7 @@ "Vahe Gharakhanyan" ] }, - "ooui-outline-control-move-down": "Իջեցնել կետը", + "ooui-outline-control-move-down": "Իջեցնել ներքև", "ooui-outline-control-move-up": "Բարձրացնել կետը", "ooui-outline-control-remove": "Հեռացնել տարրը", "ooui-toolbar-more": "Ավելին", diff --git a/resources/lib/oojs-ui/i18n/it.json b/resources/lib/oojs-ui/i18n/it.json index 68a25b5d02..4b95ffc57b 100644 --- a/resources/lib/oojs-ui/i18n/it.json +++ b/resources/lib/oojs-ui/i18n/it.json @@ -15,7 +15,8 @@ "Ontsed", "Alexmar983", "Nemo bis", - "Jdforrester" + "Jdforrester", + "Fringio" ] }, "ooui-outline-control-move-down": "Sposta in basso", @@ -33,5 +34,5 @@ "ooui-selectfile-button-select": "Seleziona un file", "ooui-selectfile-not-supported": "La selezione del file non è supportata", "ooui-selectfile-placeholder": "Nessun file è selezionato", - "ooui-selectfile-dragdrop-placeholder": "Posiziona i files qui" + "ooui-selectfile-dragdrop-placeholder": "Posiziona i file qui" } diff --git a/resources/lib/oojs-ui/i18n/sh.json b/resources/lib/oojs-ui/i18n/sh.json index db6fa3c4bd..532ba3f737 100644 --- a/resources/lib/oojs-ui/i18n/sh.json +++ b/resources/lib/oojs-ui/i18n/sh.json @@ -1,7 +1,8 @@ { "@metadata": { "authors": [ - "OC Ripper" + "OC Ripper", + "Sf" ] }, "ooui-outline-control-move-down": "Pomakni stavku dolje", @@ -16,6 +17,8 @@ "ooui-dialog-process-dismiss": "Odbaci", "ooui-dialog-process-retry": "Pokušajte ponovo", "ooui-dialog-process-continue": "Nastavi", + "ooui-selectfile-button-select": "Izaberi datoteku", "ooui-selectfile-not-supported": "Izbor datoteke nije podržan", - "ooui-selectfile-placeholder": "Nijedna datoteka nije odabrana" + "ooui-selectfile-placeholder": "Nijedna datoteka nije odabrana", + "ooui-selectfile-dragdrop-placeholder": "Prevuci datoteku ovdje" } diff --git a/resources/lib/oojs-ui/i18n/xmf.json b/resources/lib/oojs-ui/i18n/xmf.json index f5bfa2c661..4109c36eba 100644 --- a/resources/lib/oojs-ui/i18n/xmf.json +++ b/resources/lib/oojs-ui/i18n/xmf.json @@ -1,7 +1,8 @@ { "@metadata": { "authors": [ - "David1010" + "David1010", + "Silovan" ] }, "ooui-outline-control-move-down": "ელემენტის ქვემოთ გადატანა", @@ -15,5 +16,9 @@ "ooui-dialog-process-error": "მოხდა რაღაც შეცდომა", "ooui-dialog-process-dismiss": "დამალვა", "ooui-dialog-process-retry": "კიდევ სცადეთ", - "ooui-dialog-process-continue": "გაგრძელება" + "ooui-dialog-process-continue": "გაგრძელება", + "ooui-selectfile-button-select": "გეგშაგორით ფაილი", + "ooui-selectfile-not-supported": "ფაილიშ აშაგორუა ვა რე ხენწყილი", + "ooui-selectfile-placeholder": "ფაილი ვა რე გიშაგორილი", + "ooui-selectfile-dragdrop-placeholder": "ქინაჸათით ფაილი ათაქ" } diff --git a/resources/lib/oojs-ui/i18n/zh-hans.json b/resources/lib/oojs-ui/i18n/zh-hans.json index 9934d9d00c..132c32d5cd 100644 --- a/resources/lib/oojs-ui/i18n/zh-hans.json +++ b/resources/lib/oojs-ui/i18n/zh-hans.json @@ -17,7 +17,8 @@ "Zhangjintao", "乌拉跨氪", "Great Brightstar", - "Nbdd0121" + "Nbdd0121", + "Yejianfei" ] }, "ooui-outline-control-move-down": "向下移动一项", @@ -33,7 +34,7 @@ "ooui-dialog-process-retry": "重试", "ooui-dialog-process-continue": "继续", "ooui-selectfile-button-select": "选择一个文件", - "ooui-selectfile-not-supported": "文件选择不受支持", + "ooui-selectfile-not-supported": "不支持文件选择器", "ooui-selectfile-placeholder": "没有选定文件", "ooui-selectfile-dragdrop-placeholder": "将文件拖动至此" } diff --git a/resources/lib/oojs-ui/oojs-ui-apex-noimages.css b/resources/lib/oojs-ui/oojs-ui-apex-noimages.css index a616f4d6fa..5d31973b43 100644 --- a/resources/lib/oojs-ui/oojs-ui-apex-noimages.css +++ b/resources/lib/oojs-ui/oojs-ui-apex-noimages.css @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.15.1 + * OOjs UI v0.15.2 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2016 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2016-01-26T21:14:25Z + * Date: 2016-02-02T22:07:06Z */ @-webkit-keyframes oo-ui-progressBarWidget-slide { from { @@ -48,14 +48,6 @@ margin-left: 100%; } } -/* @noflip */ -.oo-ui-rtl { - direction: rtl; -} -/* @noflip */ -.oo-ui-ltr { - direction: ltr; -} .oo-ui-element-hidden { display: none !important; } @@ -172,13 +164,12 @@ -webkit-transition: border-color 100ms ease; -moz-transition: border-color 100ms ease; transition: border-color 100ms ease; - background: #eeeeee; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fff', endColorstr='#ddd'); - 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: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%); - background-image: linear-gradient(to bottom, #ffffff 0%, #dddddd 100%); + background-color: #eeeeee; + 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: linear-gradient(to bottom, #ffffff 0, #dddddd 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffffff', endColorstr='#ffdddddd' )"; } .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button:focus { @@ -195,13 +186,12 @@ 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='#ddd', endColorstr='#fff'); - 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: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%); - background-image: linear-gradient(to bottom, #dddddd 0%, #ffffff 100%); + background-color: #eeeeee; + 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: linear-gradient(to bottom, #dddddd 0, #ffffff 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffdddddd', endColorstr='#ffffffff' )"; } .oo-ui-buttonElement-framed.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { margin-left: -0.5em; @@ -221,13 +211,12 @@ } .oo-ui-buttonElement-framed.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button { border: 1px solid #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: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); - background-image: linear-gradient(to bottom, #eaf4fa 0%, #b0d9ee 100%); + background-color: #cde7f4; + 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: linear-gradient(to bottom, #eaf4fa 0, #b0d9ee 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffeaf4fa', endColorstr='#ffb0d9ee' )"; } .oo-ui-buttonElement-framed.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus { @@ -237,23 +226,21 @@ .oo-ui-buttonElement-framed.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button { border: 1px solid #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: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%); - background-image: linear-gradient(to bottom, #b0d9ee 0%, #eaf4fa 100%); + background-color: #cde7f4; + 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: linear-gradient(to bottom, #b0d9ee 0, #eaf4fa 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb0d9ee', endColorstr='#ffeaf4fa' )"; } .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive > .oo-ui-buttonElement-button { border: 1px solid #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: -o-linear-gradient(top, #f0fbe1 0%, #c3e59a 100%); - background-image: linear-gradient(to bottom, #f0fbe1 0%, #c3e59a 100%); + background-color: #daf0bd; + 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: linear-gradient(to bottom, #f0fbe1 0, #c3e59a 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff0fbe1', endColorstr='#ffc3e59a' )"; } .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive > .oo-ui-buttonElement-button:focus { @@ -263,13 +250,12 @@ .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button { border: 1px solid #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: -o-linear-gradient(top, #c3e59a 0%, #f0fbe1 100%); - background-image: linear-gradient(to bottom, #c3e59a 0%, #f0fbe1 100%); + background-color: #daf0bd; + 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: linear-gradient(to bottom, #c3e59a 0, #f0fbe1 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc3e59a', endColorstr='#fff0fbe1' )"; } .oo-ui-buttonElement-framed.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: #d45353; @@ -298,22 +284,6 @@ -moz-box-sizing: border-box; box-sizing: border-box; } -.oo-ui-draggableElement { - cursor: -webkit-grab -moz-grab, url(images/grab.cur), move; -} -.oo-ui-draggableElement-dragging { - cursor: -webkit-grabbing -moz-grabbing, url(images/grabbing.cur), move; - background: rgba(0, 0, 0, 0.2); - opacity: 0.4; -} -.oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement.oo-ui-optionWidget { - display: inline-block; -} -.oo-ui-draggableGroupElement-placeholder { - position: absolute; - display: block; - background: rgba(0, 0, 0, 0.4); -} .oo-ui-iconElement .oo-ui-iconElement-icon, .oo-ui-iconElement.oo-ui-iconElement-icon { background-size: contain; @@ -334,60 +304,9 @@ .oo-ui-indicatorElement.oo-ui-indicatorElement-indicator { opacity: 0.8; } -.oo-ui-lookupElement > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; -} .oo-ui-pendingElement-pending { background-image: /* @embed */ url(themes/apex/images/textures/pending.gif); } -.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; -} -.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-outlineSelectWidget { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 3em; - overflow-y: auto; -} -.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { - position: absolute; - bottom: 0; - left: 0; - right: 0; -} -.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout { - padding: 1.5em; -} -.oo-ui-bookletLayout-outlinePanel { - border-right: 1px solid #dddddd; -} -.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { - box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25); -} -.oo-ui-indexLayout > .oo-ui-menuLayout-menu { - height: 3em; -} -.oo-ui-indexLayout > .oo-ui-menuLayout-content { - top: 3em; -} -.oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout { - padding: 1.5em; -} .oo-ui-fieldLayout { display: block; margin-bottom: 1em; @@ -550,85 +469,6 @@ .oo-ui-formLayout + .oo-ui-formLayout { margin-top: 2em; } -.oo-ui-menuLayout { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; -} -.oo-ui-menuLayout-menu, -.oo-ui-menuLayout-content { - position: absolute; - -webkit-transition: all 200ms ease; - -moz-transition: all 200ms ease; - transition: all 200ms ease; -} -.oo-ui-menuLayout-menu { - height: 18em; - width: 18em; -} -.oo-ui-menuLayout-content { - top: 18em; - left: 18em; - right: 18em; - bottom: 18em; -} -.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu { - width: 0 !important; - height: 0 !important; - overflow: hidden; -} -.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content { - top: 0 !important; - left: 0 !important; - right: 0 !important; - bottom: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu { - width: auto !important; - left: 0; - top: 0; - right: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content { - right: 0 !important; - bottom: 0 !important; - left: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu { - height: auto !important; - top: 0; - right: 0; - bottom: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content { - bottom: 0 !important; - left: 0 !important; - top: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu { - width: auto !important; - right: 0; - bottom: 0; - left: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content { - left: 0 !important; - top: 0 !important; - right: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu { - height: auto !important; - bottom: 0; - left: 0; - top: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content { - top: 0 !important; - right: 0 !important; - bottom: 0 !important; -} .oo-ui-panelLayout { position: relative; } @@ -652,10 +492,6 @@ .oo-ui-panelLayout-padded.oo-ui-panelLayout-framed { margin: 1em 0; } -.oo-ui-stackLayout-continuous > .oo-ui-panelLayout { - display: block; - position: relative; -} .oo-ui-horizontalLayout > .oo-ui-widget { display: inline-block; vertical-align: middle; @@ -674,808 +510,972 @@ .oo-ui-horizontalLayout > .oo-ui-layout { margin-bottom: 0; } -.oo-ui-popupTool .oo-ui-popupWidget-popup, -.oo-ui-popupTool .oo-ui-popupWidget-anchor { - z-index: 4; +.oo-ui-optionWidget { + position: relative; + display: block; + padding: 0.25em 0.5em; + border: none; } -.oo-ui-popupTool .oo-ui-popupWidget { - /* @noflip */ - margin-left: 1.25em; +.oo-ui-optionWidget.oo-ui-widget-enabled { + cursor: pointer; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup { - border: 0; - border-radius: 0; - margin: 0; +.oo-ui-optionWidget.oo-ui-labelElement .oo-ui-labelElement-label { + display: block; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } -.oo-ui-toolGroupTool:first-child > .oo-ui-popupToolGroup { - border-top-left-radius: 0.3125em; - border-bottom-left-radius: 0.3125em; +.oo-ui-optionWidget-highlighted { + background-color: #e1f3ff; } -.oo-ui-toolGroupTool:last-child > .oo-ui-popupToolGroup { - border-top-right-radius: 0.3125em; - border-bottom-right-radius: 0.3125em; +.oo-ui-optionWidget .oo-ui-labelElement-label { + line-height: 1.5em; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle { - height: 1.875em; - padding: 0.3125em; +.oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected { + background-color: #a7dcff; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { - height: 1.875em; - width: 1.875em; +.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed, +.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted, +.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected { + background-color: #a7dcff; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup.oo-ui-labelElement > .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - line-height: 2.1em; +.oo-ui-optionWidget.oo-ui-widget-disabled { + color: #cccccc; } -.oo-ui-toolGroup { - display: inline-block; - vertical-align: middle; - margin: 0.375em; - border-radius: 0.3125em; - border: 1px solid transparent; - -webkit-transition: border-color 250ms ease; - -moz-transition: border-color 250ms ease; - transition: border-color 250ms ease; +.oo-ui-decoratedOptionWidget { + padding: 0.5em 2em 0.5em 3em; } -.oo-ui-toolGroup-empty { - display: none; +.oo-ui-decoratedOptionWidget .oo-ui-iconElement-icon, +.oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator { + position: absolute; } -.oo-ui-toolGroup .oo-ui-tool-link { - text-decoration: none; +.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon, +.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + top: 0; + height: 100%; } -.oo-ui-toolbar-narrow .oo-ui-toolGroup + .oo-ui-toolGroup { - margin-left: 0; +.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon { + width: 1.875em; + left: 0.5em; } -.oo-ui-toolGroup.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.1); +.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + width: 0.9375em; + right: 0.5em; } -.oo-ui-toolGroup.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title { - color: #000000; +.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, +.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-barToolGroup > .oo-ui-iconElement-icon, -.oo-ui-barToolGroup > .oo-ui-labelElement-label { - display: none; +.oo-ui-radioSelectWidget { + padding: 0.75em 0 0.5em 0; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { - cursor: pointer; +.oo-ui-radioOptionWidget { + cursor: default; + padding: 0; + background-color: transparent; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool { +.oo-ui-radioOptionWidget .oo-ui-radioInputWidget, +.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { display: inline-block; - position: relative; - vertical-align: top; -} -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { - display: block; -} -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-accel { - display: none; -} -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-iconElement-icon { - display: inline-block; - vertical-align: top; -} -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-tool-title { - display: none; -} -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title { - display: inline; -} -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link { - outline: 0; - cursor: default; + vertical-align: middle; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool { - margin: -1px 0 -1px -1px; - border: 1px solid transparent; +.oo-ui-radioOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-radioOptionWidget.oo-ui-optionWidget-pressed, +.oo-ui-radioOptionWidget.oo-ui-optionWidget-highlighted { + background-color: transparent; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool:first-child { - border-top-left-radius: 0.3125em; - border-bottom-left-radius: 0.3125em; +.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { + padding-left: 0.5em; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool:last-child { - margin-right: -1px; - border-top-right-radius: 0.3125em; - border-bottom-right-radius: 0.3125em; +.oo-ui-radioOptionWidget .oo-ui-radioInputWidget { + margin-right: 0; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { - height: 1.875em; - padding: 0.3125em; +.oo-ui-labelWidget { + display: inline-block; + padding: 0.5em 0; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon { +.oo-ui-iconWidget { + display: inline-block; + vertical-align: middle; + line-height: 2.5em; height: 1.875em; width: 1.875em; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title { - line-height: 2.1em; -} -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .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-toolGroup-tools > .oo-ui-tool.oo-ui-tool-active.oo-ui-widget-enabled { - border-color: rgba(0, 0, 0, 0.2); - box-shadow: inset 0 0.0875em 0.0875em 0 rgba(0, 0, 0, 0.07); - background: #f8fbfd; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#F1F7FB', endColorstr='#fff'); - 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: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%); - background-image: linear-gradient(to bottom, #f1f7fb 0%, #ffffff 100%); +.oo-ui-iconWidget.oo-ui-widget-disabled { + opacity: 0.2; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.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-indicatorWidget { + display: inline-block; + vertical-align: middle; + line-height: 2.5em; + height: 0.9375em; + width: 0.9375em; + margin: 0.46875em; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link:focus { - outline: 0; +.oo-ui-indicatorWidget.oo-ui-widget-disabled { + opacity: 0.2; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title { - color: #cccccc; +.oo-ui-buttonWidget { + display: inline-block; + vertical-align: middle; + margin-right: 0.5em; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-buttonWidget:last-child { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover > .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 1; +.oo-ui-buttonGroupWidget { + display: inline-block; + white-space: nowrap; + border-radius: 0.3em; + margin-right: 0.5em; } -.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool:focus { - outline: 0; +.oo-ui-buttonGroupWidget:last-child { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link:focus { - outline: 0; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title { - color: #cccccc; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement:last-child { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed .oo-ui-buttonElement-button { + border-radius: 0; + margin-left: -1px; } -.oo-ui-popupToolGroup { - position: relative; - height: 2.5em; - min-width: 2.5em; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button { + border-bottom-left-radius: 0.3em; + border-top-left-radius: 0.3em; + margin-left: 0; } -.oo-ui-popupToolGroup-handle { - display: block; - cursor: pointer; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button { + border-bottom-right-radius: 0.3em; + border-top-right-radius: 0.3em; } -.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator, -.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { +.oo-ui-popupWidget { position: absolute; + /* @noflip */ + left: 0; } -.oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle { - outline: 0; - cursor: default; +.oo-ui-popupWidget-popup { + position: relative; + overflow: hidden; + z-index: 1; } -.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { +.oo-ui-popupWidget-anchor { display: none; - position: absolute; - z-index: 4; + z-index: 1; } -.oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools { +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor { display: block; -} -.oo-ui-popupToolGroup-left > .oo-ui-toolGroup-tools { + position: absolute; + top: 0; + /* @noflip */ left: 0; + background-repeat: no-repeat; } -.oo-ui-popupToolGroup-right > .oo-ui-toolGroup-tools { - right: 0; -} -.oo-ui-popupToolGroup .oo-ui-tool-link { - display: table; - width: 100%; - vertical-align: middle; - white-space: nowrap; +.oo-ui-popupWidget-head { + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon, -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { - display: table-cell; - vertical-align: middle; +.oo-ui-popupWidget-head > .oo-ui-buttonWidget { + float: right; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { - text-align: right; +.oo-ui-popupWidget-head > .oo-ui-labelElement-label { + float: left; + cursor: default; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel:not(:empty) { - padding-left: 3em; +.oo-ui-popupWidget-body { + clear: both; + overflow: hidden; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup { - min-width: 1.875em; +.oo-ui-popupWidget-popup { + background-color: #ffffff; + border: 1px solid #cccccc; + border-radius: 0.25em; + box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.2); } -.oo-ui-popupToolGroup.oo-ui-iconElement { - min-width: 3.125em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-popup { + margin-top: 6px; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement { - min-width: 2.5em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before, +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { + content: ""; + position: absolute; + width: 0; + height: 0; + border-style: solid; + border-color: transparent; + border-top: 0; } -.oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { - min-width: 4.375em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before { + bottom: -7px; + left: -6px; + border-bottom-color: #aaaaaa; + border-width: 7px; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { - min-width: 3.75em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { + bottom: -7px; + left: -5px; + border-bottom-color: #ffffff; + border-width: 6px; } -.oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - line-height: 2.6em; - margin: 0 1em; +.oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup { + -webkit-transition: width 100ms ease, height 100ms ease, left 100ms ease; + -moz-transition: width 100ms ease, height 100ms ease, left 100ms ease; + transition: width 100ms ease, height 100ms ease, left 100ms ease; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin: 0 0.5em; +.oo-ui-popupWidget-head { + height: 2.5em; } -.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-left: 3em; +.oo-ui-popupWidget-head > .oo-ui-buttonWidget { + margin: 0.25em; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-left: 2.5em; +.oo-ui-popupWidget-head > .oo-ui-labelElement-label { + margin: 0.75em 1em; } -.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-right: 2.25em; +.oo-ui-popupWidget-body-padded { + padding: 0 1em; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-right: 1.75em; +.oo-ui-popupButtonWidget { + position: relative; } -.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { - width: 0.9375em; - height: 0.9375em; - margin: 0.78125em; - top: 0; - right: 0; +.oo-ui-popupButtonWidget .oo-ui-popupWidget { + position: absolute; + cursor: auto; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { - right: -0.3125em; +.oo-ui-popupButtonWidget.oo-ui-buttonElement-frameless > .oo-ui-popupWidget { + /* @noflip */ + left: 1em; } -.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { - width: 1.875em; - height: 1.875em; - margin: 0.3125em; - top: 0; - left: 0.3125em; -} -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { - left: 0; -} -.oo-ui-popupToolGroup-header { - line-height: 2.6em; - margin: 0 0.6em; - font-weight: bold; -} -.oo-ui-popupToolGroup-active.oo-ui-widget-enabled { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - box-shadow: inset 0 0.0875em 0.0875em 0 rgba(0, 0, 0, 0.07); - background: #f8fbfd; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#F1F7FB', endColorstr='#fff'); - 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: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%); - background-image: linear-gradient(to bottom, #f1f7fb 0%, #ffffff 100%); -} -.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { - top: 2.5em; - margin: 0 -1px; - border: 1px solid #cccccc; - background-color: white; - box-shadow: 0 0.3125em 1.25em rgba(0, 0, 0, 0.25); -} -.oo-ui-popupToolGroup .oo-ui-tool-link { - padding: 0.3125em 0 0.3125em 0.3125em; +.oo-ui-popupButtonWidget.oo-ui-buttonElement-framed > .oo-ui-popupWidget { + /* @noflip */ + left: 1.25em; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { - height: 1.875em; - width: 1.875em; - min-width: 1.875em; +.oo-ui-inputWidget { + margin-right: 0.5em; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { - padding-left: 0.5em; +.oo-ui-inputWidget:last-child { + margin-right: 0; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { - line-height: 2em; +.oo-ui-buttonInputWidget { + display: inline-block; + vertical-align: middle; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { - color: #888888; +.oo-ui-buttonInputWidget > button, +.oo-ui-buttonInputWidget > input { + border: 0; + padding: 0; + background-color: transparent; } -.oo-ui-listToolGroup .oo-ui-tool { - display: block; +.oo-ui-dropdownInputWidget { + position: relative; + vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; + width: 100%; + max-width: 50em; } -.oo-ui-listToolGroup .oo-ui-tool-link { - cursor: pointer; -} -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { - cursor: default; +.oo-ui-dropdownInputWidget select { + display: inline-block; + width: 100%; + resize: none; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-listToolGroup .oo-ui-toolGroup-tools { - padding: 0.3125em; +.oo-ui-dropdownInputWidget select { + background-color: #ffffff; + height: 2.5em; + padding: 0.5em; + font-size: inherit; + font-family: inherit; + border: 1px solid rgba(0, 0, 0, 0.1); + border-radius: 0.25em; } -.oo-ui-listToolGroup.oo-ui-popupToolGroup-active { +.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover, +.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus { border-color: rgba(0, 0, 0, 0.2); + outline: none; } -.oo-ui-listToolGroup .oo-ui-tool { - border: 1px solid transparent; - margin: -1px 0; - padding: 0 0.625em 0 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.0875em 0.0875em 0 rgba(0, 0, 0, 0.07); - background: #f8fbfd; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#F1F7FB', endColorstr='#fff'); - 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: -o-linear-gradient(top, #f1f7fb 0%, #ffffff 100%); - background-image: linear-gradient(to bottom, #f1f7fb 0%, #ffffff 100%); -} -.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-dropdownInputWidget.oo-ui-widget-disabled select { + color: #cccccc; + border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.2); +.oo-ui-radioSelectInputWidget .oo-ui-fieldLayout { + margin-bottom: 0; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.2); +.oo-ui-textInputWidget { + position: relative; + vertical-align: middle; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + max-width: 50em; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 1; +.oo-ui-textInputWidget input, +.oo-ui-textInputWidget textarea { + display: inline-block; + width: 100%; + resize: none; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { - color: #cccccc; +.oo-ui-textInputWidget textarea { + overflow: auto; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-accel { - color: #dddddd; +.oo-ui-textInputWidget input[type="search"] { + -webkit-appearance: none; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-textInputWidget input[type="search"]::-ms-clear { + display: none; } -.oo-ui-listToolGroup.oo-ui-widget-disabled { - color: #cccccc; +.oo-ui-textInputWidget input[type="search"]::-ms-reveal { + display: none; } -.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, -.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-textInputWidget input[type="search"]::-webkit-search-decoration, +.oo-ui-textInputWidget input[type="search"]::-webkit-search-cancel-button, +.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-button, +.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-decoration { + display: none; } -.oo-ui-menuToolGroup { - border-color: rgba(0, 0, 0, 0.1); +.oo-ui-textInputWidget > .oo-ui-iconElement-icon, +.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator, +.oo-ui-textInputWidget > .oo-ui-labelElement-label { + display: none; } -.oo-ui-menuToolGroup .oo-ui-tool { +.oo-ui-textInputWidget.oo-ui-iconElement > .oo-ui-iconElement-icon, +.oo-ui-textInputWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { display: block; + position: absolute; + top: 0; + height: 100%; + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } -.oo-ui-menuToolGroup .oo-ui-tool-link { +.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon, +.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { + cursor: text; +} +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator { cursor: pointer; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { - cursor: default; +.oo-ui-textInputWidget.oo-ui-labelElement > .oo-ui-labelElement-label { + display: block; } -.oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { - min-width: 10em; +.oo-ui-textInputWidget > .oo-ui-iconElement-icon { + left: 0; } -.oo-ui-toolbar-narrow .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { - min-width: 8.125em; +.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator { + right: 0; } -.oo-ui-menuToolGroup .oo-ui-toolGroup-tools { - padding: 0.3125em 0 0.3125em 0; +.oo-ui-textInputWidget > .oo-ui-labelElement-label { + position: absolute; + top: 0; } -.oo-ui-menuToolGroup.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.2); +.oo-ui-textInputWidget-labelPosition-after > .oo-ui-labelElement-label { + right: 0; } -.oo-ui-menuToolGroup.oo-ui-popupToolGroup-active { - border-color: rgba(0, 0, 0, 0.25); +.oo-ui-textInputWidget-labelPosition-before > .oo-ui-labelElement-label { + left: 0; } -.oo-ui-menuToolGroup .oo-ui-tool { - padding: 0 1.25em 0 0.3125em; +.oo-ui-textInputWidget input, +.oo-ui-textInputWidget textarea { + padding: 0.5em; + line-height: 1.275em; + font-size: inherit; + font-family: inherit; + background-color: #ffffff; + color: black; + border: 1px solid #cccccc; + box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #dddddd; + border-radius: 0.25em; + -webkit-transition: border-color 250ms ease, box-shadow 250ms ease; + -moz-transition: border-color 250ms ease, box-shadow 250ms ease; + transition: border-color 250ms ease, box-shadow 250ms ease; } -.oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { - background-image: none; +.oo-ui-textInputWidget input.oo-ui-pendingElement-pending, +.oo-ui-textInputWidget textarea.oo-ui-pendingElement-pending { + background-color: transparent; } -.oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconElement-icon { - background-image: url("themes/apex/images/icons/check.png"); - background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/apex/images/icons/check.svg"); - background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/apex/images/icons/check.svg"); - background-image: -o-linear-gradient(transparent, transparent), url("themes/apex/images/icons/check.png"); - background-size: contain; - background-position: center center; - background-repeat: no-repeat; +.oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, +.oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus { + outline: none; + border-color: #a7dcff; + box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { - background-color: #e1f3ff; +.oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly], +.oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly] { + color: #777777; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input, +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea { + background-color: #ffdddd; +} +.oo-ui-textInputWidget.oo-ui-widget-disabled input, +.oo-ui-textInputWidget.oo-ui-widget-disabled textarea { color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { +.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, +.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { opacity: 0.2; } -.oo-ui-menuToolGroup.oo-ui-widget-disabled { - color: #cccccc; - border-color: rgba(0, 0, 0, 0.05); -} -.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, -.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { - opacity: 0.2; -} -.oo-ui-toolbar { - clear: both; +.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-labelElement-label { + color: #dddddd; + text-shadow: 0 1px 1px #ffffff; } -.oo-ui-toolbar-bar { - line-height: 1em; - position: relative; +.oo-ui-textInputWidget.oo-ui-iconElement input, +.oo-ui-textInputWidget.oo-ui-iconElement textarea { + padding-left: 2.475em; } -.oo-ui-toolbar-actions { - float: right; +.oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon { + width: 1.875em; + max-height: 2.375em; + margin-left: 0.3em; } -.oo-ui-toolbar-actions .oo-ui-toolbar { - display: inline-block; +.oo-ui-textInputWidget.oo-ui-indicatorElement input, +.oo-ui-textInputWidget.oo-ui-indicatorElement textarea { + padding-right: 2.4875em; } -.oo-ui-toolbar-tools { - display: inline; - white-space: nowrap; +.oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + width: 0.9375em; + max-height: 2.375em; + margin-right: 0.775em; } -.oo-ui-toolbar-narrow .oo-ui-toolbar-tools { - white-space: normal; +.oo-ui-textInputWidget > .oo-ui-labelElement-label { + padding: 0.4em; + line-height: 1.5em; + color: #888888; } -.oo-ui-toolbar-tools .oo-ui-tool { - white-space: normal; +.oo-ui-textInputWidget-labelPosition-after.oo-ui-indicatorElement > .oo-ui-labelElement-label { + margin-right: 2.0875em; } -.oo-ui-toolbar-tools, -.oo-ui-toolbar-actions, -.oo-ui-toolbar-shadow { - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +.oo-ui-textInputWidget-labelPosition-before.oo-ui-iconElement > .oo-ui-labelElement-label { + margin-left: 2.075em; } -.oo-ui-toolbar-actions .oo-ui-popupWidget { - -webkit-touch-callout: default; - -webkit-user-select: all; - -moz-user-select: all; - -ms-user-select: all; - user-select: all; +.oo-ui-menuSelectWidget { + position: absolute; + background-color: #ffffff; + margin-top: -1px; + border: 1px solid #cccccc; + border-radius: 0 0 0.25em 0.25em; + box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2); } -.oo-ui-toolbar-shadow { - background-position: left top; - background-repeat: repeat-x; +.oo-ui-menuSelectWidget input { position: absolute; - width: 100%; - pointer-events: none; + width: 0; + height: 0; + overflow: hidden; + opacity: 0; } -.oo-ui-toolbar-bar { - border-bottom: 1px solid #cccccc; - background: #f8fbfd; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fff', 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: -o-linear-gradient(top, #ffffff 0%, #f1f7fb 100%); - background-image: linear-gradient(to bottom, #ffffff 0%, #f1f7fb 100%); +.oo-ui-menuOptionWidget { + position: relative; } -.oo-ui-toolbar-bar .oo-ui-toolbar-bar { - border: none; - background: none; +.oo-ui-menuOptionWidget .oo-ui-iconElement-icon { + display: none; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement-framed, -.oo-ui-toolbar-actions > .oo-ui-buttonElement-framed:last-child { - margin-top: 0.4em; - margin-bottom: 0.4em; - margin-right: 0.5em; +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { + background-color: transparent; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless.oo-ui-labelElement, -.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless:last-child.oo-ui-labelElement { - margin: 0; +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon { + display: block; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button, -.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless:last-child.oo-ui-labelElement > .oo-ui-buttonElement-button { - margin: 0; - padding: 0 0.3125em; +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { + background-color: transparent; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label, -.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless:last-child.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label { - margin: 0 1em; - line-height: 3.40625em; +.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted, +.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected { + background-color: #e1f3ff; } -.oo-ui-toolbar-shadow { - background-image: /* @embed */ url(themes/apex/images/toolbar-shadow.png); - bottom: -9px; - height: 9px; - opacity: 0.5; - -webkit-transition: opacity 500ms ease; - -moz-transition: opacity 500ms ease; - transition: opacity 500ms ease; +.oo-ui-menuSectionOptionWidget { + cursor: default; + padding: 0.33em 0.75em; + color: #888888; } -.oo-ui-optionWidget { +.oo-ui-dropdownWidget { + display: inline-block; position: relative; - display: block; - padding: 0.25em 0.5em; - border: none; -} -.oo-ui-optionWidget.oo-ui-widget-enabled { - cursor: pointer; + width: 100%; + max-width: 50em; + background-color: #ffffff; + margin-right: 0.5em; } -.oo-ui-optionWidget.oo-ui-labelElement .oo-ui-labelElement-label { - display: block; +.oo-ui-dropdownWidget-handle { + width: 100%; + display: inline-block; white-space: nowrap; - text-overflow: ellipsis; overflow: hidden; + text-overflow: ellipsis; + -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-optionWidget-highlighted { - background-color: #e1f3ff; +.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator, +.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { + position: absolute; } -.oo-ui-optionWidget .oo-ui-labelElement-label { - line-height: 1.5em; +.oo-ui-dropdownWidget > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; } -.oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected { - background-color: #a7dcff; +.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle { + cursor: pointer; } -.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed, -.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted, -.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected { - background-color: #a7dcff; +.oo-ui-dropdownWidget:last-child { + margin-right: 0; } -.oo-ui-optionWidget.oo-ui-widget-disabled { - color: #cccccc; +.oo-ui-dropdownWidget-handle { + height: 2.5em; + border: 1px solid rgba(0, 0, 0, 0.1); + border-radius: 0.25em; } -.oo-ui-decoratedOptionWidget { - padding: 0.5em 2em 0.5em 3em; +.oo-ui-dropdownWidget-handle:hover { + border-color: rgba(0, 0, 0, 0.2); } -.oo-ui-decoratedOptionWidget .oo-ui-iconElement-icon, -.oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator { - position: absolute; +.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { + right: 0; } -.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon, -.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - top: 0; - height: 100%; +.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { + left: 0.25em; } -.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon { - width: 1.875em; - left: 0.5em; +.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { + line-height: 2.5em; + margin: 0 0.5em; } -.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { +.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { + top: 0; width: 0.9375em; - right: 0.5em; -} -.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, -.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { - opacity: 0.2; + height: 0.9375em; + margin: 0.775em; } -.oo-ui-buttonSelectWidget { - display: inline-block; - white-space: nowrap; - border-radius: 0.3em; - margin-right: 0.5em; +.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { + top: 0; + width: 1.875em; + height: 1.875em; + margin: 0.3em; } -.oo-ui-buttonSelectWidget:last-child { - margin-right: 0; +.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle { + color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button { - border-radius: 0; - margin-left: -1px; +.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle:focus { + outline: 0; } -.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button { - border-bottom-left-radius: 0.3em; - border-top-left-radius: 0.3em; - margin-left: 0; +.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonElement-button { - border-bottom-right-radius: 0.3em; - border-top-right-radius: 0.3em; +.oo-ui-dropdownWidget.oo-ui-iconElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { + margin-left: 3em; } -.oo-ui-radioSelectWidget { - padding: 0.75em 0 0.5em 0; +.oo-ui-dropdownWidget.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { + margin-right: 2em; } -.oo-ui-buttonOptionWidget { +.oo-ui-comboBoxInputWidget { display: inline-block; - padding: 0; - background-color: transparent; -} -.oo-ui-buttonOptionWidget .oo-ui-buttonElement-button { position: relative; + width: 100%; + max-width: 50em; + margin-right: 0.5em; } -.oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon, -.oo-ui-buttonOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - position: static; - display: inline-block; - vertical-align: middle; -} -.oo-ui-buttonOptionWidget .oo-ui-buttonElement-button { - height: 1.875em; -} -.oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon { - margin-top: 0; +.oo-ui-comboBoxInputWidget > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; } -.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed, -.oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted { - background-color: transparent; +.oo-ui-comboBoxInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { + cursor: pointer; } -.oo-ui-radioOptionWidget { - cursor: default; +.oo-ui-comboBoxInputWidget-php input::-webkit-calendar-picker-indicator { + opacity: 0 !important; + position: absolute; + right: 0; + top: 0; + height: 2.5em; + width: 2.5em; padding: 0; - background-color: transparent; -} -.oo-ui-radioOptionWidget .oo-ui-radioInputWidget, -.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { - display: inline-block; - vertical-align: middle; -} -.oo-ui-radioOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-radioOptionWidget.oo-ui-optionWidget-pressed, -.oo-ui-radioOptionWidget.oo-ui-optionWidget-highlighted { - background-color: transparent; } -.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { - padding-left: 0.5em; +.oo-ui-comboBoxInputWidget-php > .oo-ui-indicatorElement-indicator { + pointer-events: none; } -.oo-ui-radioOptionWidget .oo-ui-radioInputWidget { +.oo-ui-comboBoxInputWidget:last-child { margin-right: 0; } -.oo-ui-labelWidget { - display: inline-block; - padding: 0.5em 0; -} -.oo-ui-iconWidget { - display: inline-block; - vertical-align: middle; - line-height: 2.5em; - height: 1.875em; - width: 1.875em; -} -.oo-ui-iconWidget.oo-ui-widget-disabled { +.oo-ui-comboBoxInputWidget.oo-ui-widget-disabled .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator, +.oo-ui-comboBoxInputWidget-empty .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + cursor: default; opacity: 0.2; } -.oo-ui-indicatorWidget { - display: inline-block; - vertical-align: middle; - line-height: 2.5em; - height: 0.9375em; - width: 0.9375em; - margin: 0.46875em; -} -.oo-ui-indicatorWidget.oo-ui-widget-disabled { - opacity: 0.2; +.oo-ui-comboBoxInputWidget > .oo-ui-selectWidget { + margin-top: -3px; } -.oo-ui-buttonWidget { - display: inline-block; - vertical-align: middle; - margin-right: 0.5em; + +/*! + * OOjs UI v0.15.2 + * https://www.mediawiki.org/wiki/OOjs_UI + * + * Copyright 2011–2016 OOjs UI Team and other contributors. + * Released under the MIT license + * http://oojs.mit-license.org + * + * Date: 2016-02-02T22:07:06Z + */ +@-webkit-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-buttonWidget:last-child { - margin-right: 0; +@-moz-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-buttonGroupWidget { - display: inline-block; - white-space: nowrap; - border-radius: 0.3em; - margin-right: 0.5em; +@-ms-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-buttonGroupWidget:last-child { - margin-right: 0; +@-o-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-buttonGroupWidget .oo-ui-buttonElement { - margin-right: 0; +@keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-buttonGroupWidget .oo-ui-buttonElement:last-child { - margin-right: 0; +.oo-ui-draggableElement { + cursor: -webkit-grab -moz-grab, url(images/grab.cur), move; } -.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed .oo-ui-buttonElement-button { - border-radius: 0; - margin-left: -1px; +.oo-ui-draggableElement-dragging { + cursor: -webkit-grabbing -moz-grabbing, url(images/grabbing.cur), move; + background: rgba(0, 0, 0, 0.2); + opacity: 0.4; } -.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button { - border-bottom-left-radius: 0.3em; - border-top-left-radius: 0.3em; - margin-left: 0; +.oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement.oo-ui-optionWidget { + display: inline-block; } -.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button { - border-bottom-right-radius: 0.3em; - border-top-right-radius: 0.3em; +.oo-ui-draggableGroupElement-placeholder { + position: absolute; + display: block; + background: rgba(0, 0, 0, 0.4); } -.oo-ui-toggleButtonWidget { - display: inline-block; - vertical-align: middle; - margin-right: 0.5em; +.oo-ui-lookupElement > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; } -.oo-ui-toggleButtonWidget:last-child { - margin-right: 0; +.oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous > .oo-ui-panelLayout-scrollable { + overflow-y: hidden; } -.oo-ui-toggleSwitchWidget { - position: relative; - display: inline-block; - vertical-align: middle; - overflow: hidden; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout { + width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - -webkit-transform: translateZ(0); - -moz-transform: translateZ(0); - -ms-transform: translateZ(0); - transform: translateZ(0); - height: 2em; - width: 4em; - border-radius: 1em; - box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #dddddd; - border: 1px solid #cccccc; - margin-right: 0.5em; - background: #eeeeee; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ddd', endColorstr='#fff'); - 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: -o-linear-gradient(top, #dddddd 0%, #ffffff 100%); - background-image: linear-gradient(to bottom, #dddddd 0%, #ffffff 100%); } -.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled { - cursor: pointer; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout-scrollable { + overflow-y: auto; } -.oo-ui-toggleSwitchWidget-grip { - position: absolute; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout-padded { + padding: 2em; } -.oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow { +.oo-ui-bookletLayout-outlinePanel-editable > .oo-ui-outlineSelectWidget { position: absolute; top: 0; - bottom: 0; + left: 0; right: 0; + bottom: 3em; + overflow-y: auto; +} +.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { + position: absolute; + bottom: 0; left: 0; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; + right: 0; } -.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow { - display: none; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout { + padding: 1.5em; } -.oo-ui-toggleSwitchWidget:last-child { - margin-right: 0; +.oo-ui-bookletLayout-outlinePanel { + border-right: 1px solid #dddddd; } -.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled { - opacity: 0.5; +.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { + box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.25); } -.oo-ui-toggleSwitchWidget-grip { - top: 0.25em; - left: 0.25em; - width: 1.5em; - height: 1.5em; - margin-top: -1px; - border-radius: 1em; - box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1); - border: 1px #c9c9c9 solid; - -webkit-transition: left 250ms ease, margin-left 250ms ease; - -moz-transition: left 250ms ease, margin-left 250ms ease; - transition: left 250ms ease, margin-left 250ms ease; - background: #eeeeee; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fff', endColorstr='#ddd'); - 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: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%); - background-image: linear-gradient(to bottom, #ffffff 0%, #dddddd 100%); +.oo-ui-indexLayout > .oo-ui-menuLayout-menu { + height: 3em; } -.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover, -.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip { - border-color: #aaaaaa; +.oo-ui-indexLayout > .oo-ui-menuLayout-content { + top: 3em; } -.oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow { - border-radius: 1em; - box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07); - -webkit-transition: opacity 250ms ease; - -moz-transition: opacity 250ms ease; - transition: opacity 250ms ease; - 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: -o-linear-gradient(top, #b0d9ee 0%, #eaf4fa 100%); - background-image: linear-gradient(to bottom, #b0d9ee 0%, #eaf4fa 100%); +.oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout { + padding: 1.5em; } -.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow { - opacity: 1; +.oo-ui-menuLayout { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; +} +.oo-ui-menuLayout-menu, +.oo-ui-menuLayout-content { + position: absolute; + -webkit-transition: all 200ms ease; + -moz-transition: all 200ms ease; + transition: all 200ms ease; +} +.oo-ui-menuLayout-menu { + height: 18em; + width: 18em; +} +.oo-ui-menuLayout-content { + top: 18em; + left: 18em; + right: 18em; + bottom: 18em; +} +.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu { + width: 0 !important; + height: 0 !important; + overflow: hidden; +} +.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content { + top: 0 !important; + left: 0 !important; + right: 0 !important; + bottom: 0 !important; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu { + width: auto !important; + left: 0; + top: 0; + right: 0; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content { + right: 0 !important; + bottom: 0 !important; + left: 0 !important; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu { + height: auto !important; + top: 0; + right: 0; + bottom: 0; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content { + bottom: 0 !important; + left: 0 !important; + top: 0 !important; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu { + width: auto !important; + right: 0; + bottom: 0; + left: 0; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content { + left: 0 !important; + top: 0 !important; + right: 0 !important; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu { + height: auto !important; + bottom: 0; + left: 0; + top: 0; +} +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content { + top: 0 !important; + right: 0 !important; + bottom: 0 !important; +} +.oo-ui-stackLayout-continuous > .oo-ui-panelLayout { + display: block; + position: relative; +} +.oo-ui-buttonSelectWidget { + display: inline-block; + white-space: nowrap; + border-radius: 0.3em; + margin-right: 0.5em; +} +.oo-ui-buttonSelectWidget:last-child { + margin-right: 0; +} +.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button { + border-radius: 0; + margin-left: -1px; +} +.oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button { + 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-buttonElement-button { + border-bottom-right-radius: 0.3em; + border-top-right-radius: 0.3em; +} +.oo-ui-buttonOptionWidget { + display: inline-block; + padding: 0; + background-color: transparent; +} +.oo-ui-buttonOptionWidget .oo-ui-buttonElement-button { + position: relative; +} +.oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon, +.oo-ui-buttonOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + position: static; + display: inline-block; + vertical-align: middle; +} +.oo-ui-buttonOptionWidget .oo-ui-buttonElement-button { + height: 1.875em; +} +.oo-ui-buttonOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon { + margin-top: 0; +} +.oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-buttonOptionWidget.oo-ui-optionWidget-pressed, +.oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted { + background-color: transparent; +} +.oo-ui-toggleButtonWidget { + display: inline-block; + vertical-align: middle; + margin-right: 0.5em; +} +.oo-ui-toggleButtonWidget:last-child { + margin-right: 0; +} +.oo-ui-toggleSwitchWidget { + position: relative; + display: inline-block; + vertical-align: middle; + overflow: hidden; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + -webkit-transform: translateZ(0); + -moz-transform: translateZ(0); + -ms-transform: translateZ(0); + transform: translateZ(0); + height: 2em; + width: 4em; + border-radius: 1em; + box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #dddddd; + border: 1px solid #cccccc; + margin-right: 0.5em; + background-color: #eeeeee; + 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: linear-gradient(to bottom, #dddddd 0, #ffffff 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffdddddd', endColorstr='#ffffffff' )"; +} +.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled { + cursor: pointer; +} +.oo-ui-toggleSwitchWidget-grip { + position: absolute; + display: block; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow { + position: absolute; + top: 0; + bottom: 0; + right: 0; + left: 0; + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow { + display: none; +} +.oo-ui-toggleSwitchWidget:last-child { + margin-right: 0; +} +.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled { + opacity: 0.5; +} +.oo-ui-toggleSwitchWidget-grip { + top: 0.25em; + left: 0.25em; + width: 1.5em; + height: 1.5em; + margin-top: -1px; + border-radius: 1em; + box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.1); + border: 1px #c9c9c9 solid; + -webkit-transition: left 250ms ease, margin-left 250ms ease; + -moz-transition: left 250ms ease, margin-left 250ms ease; + transition: left 250ms ease, margin-left 250ms ease; + background-color: #eeeeee; + 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: linear-gradient(to bottom, #ffffff 0, #dddddd 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffffff', endColorstr='#ffdddddd' )"; +} +.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover, +.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip { + border-color: #aaaaaa; +} +.oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow { + border-radius: 1em; + box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.07); + -webkit-transition: opacity 250ms ease; + -moz-transition: opacity 250ms ease; + transition: opacity 250ms ease; + background-color: #cde7f4; + 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: linear-gradient(to bottom, #b0d9ee 0, #eaf4fa 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb0d9ee', endColorstr='#ffeaf4fa' )"; +} +.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow { + opacity: 1; } .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip { left: 2.25em; @@ -1502,13 +1502,12 @@ -webkit-transition: width 250ms ease, margin-left 250ms ease; -moz-transition: width 250ms ease, margin-left 250ms ease; transition: width 250ms ease, margin-left 250ms ease; - 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: -o-linear-gradient(top, #eaf4fa 0%, #b0d9ee 100%); - background-image: linear-gradient(to bottom, #eaf4fa 0%, #b0d9ee 100%); + background-color: #cde7f4; + 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: linear-gradient(to bottom, #eaf4fa 0, #b0d9ee 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffeaf4fa', endColorstr='#ffb0d9ee' )"; } .oo-ui-progressBarWidget-indeterminate .oo-ui-progressBarWidget-bar { -webkit-animation: oo-ui-progressBarWidget-slide 2s infinite linear; @@ -1521,1024 +1520,1158 @@ .oo-ui-progressBarWidget.oo-ui-widget-disabled { opacity: 0.6; } -.oo-ui-actionWidget.oo-ui-pendingElement-pending { - background-image: /* @embed */ url(themes/apex/images/textures/pending.gif); +.oo-ui-selectFileWidget { + display: inline-block; + vertical-align: middle; + width: 100%; + max-width: 50em; + margin-right: 0.5em; } -.oo-ui-popupWidget { - position: absolute; - /* @noflip */ - left: 0; +.oo-ui-selectFileWidget-selectButton { + display: table-cell; + vertical-align: middle; } -.oo-ui-popupWidget-popup { +.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { position: relative; overflow: hidden; - z-index: 1; -} -.oo-ui-popupWidget-anchor { - display: none; - z-index: 1; } -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor { - display: block; +.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > input[type="file"] { position: absolute; + margin: 0; top: 0; - /* @noflip */ + bottom: 0; left: 0; - background-repeat: no-repeat; + right: 0; + width: 100%; + height: 100%; + opacity: 0; + z-index: 1; + cursor: pointer; + padding-top: 100px; } -.oo-ui-popupWidget-head { - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +.oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > input[type="file"] { + display: none; } -.oo-ui-popupWidget-head > .oo-ui-buttonWidget { - float: right; -} -.oo-ui-popupWidget-head > .oo-ui-labelElement-label { - float: left; - cursor: default; -} -.oo-ui-popupWidget-body { - clear: both; +.oo-ui-selectFileWidget-info { + width: 100%; + display: table-cell; + vertical-align: middle; + position: relative; overflow: hidden; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-popupWidget-popup { - background-color: #ffffff; - border: 1px solid #cccccc; - border-radius: 0.25em; - box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.2); -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-popup { - margin-top: 6px; -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before, -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { - content: ""; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { position: absolute; - width: 0; - height: 0; - border-style: solid; - border-color: transparent; - border-top: 0; -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before { - bottom: -7px; - left: -6px; - border-bottom-color: #aaaaaa; - border-width: 7px; -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { - bottom: -7px; - left: -5px; - border-bottom-color: #ffffff; - border-width: 6px; -} -.oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup { - -webkit-transition: width 100ms ease, height 100ms ease, left 100ms ease; - -moz-transition: width 100ms ease, height 100ms ease, left 100ms ease; - transition: width 100ms ease, height 100ms ease, left 100ms ease; + top: 0; + bottom: 0; + left: 0; + right: 0; + text-overflow: ellipsis; } -.oo-ui-popupWidget-head { - height: 2.5em; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName { + float: left; } -.oo-ui-popupWidget-head > .oo-ui-buttonWidget { - margin: 0.25em; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { + float: right; } -.oo-ui-popupWidget-head > .oo-ui-labelElement-label { - margin: 0.75em 1em; +.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator, +.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { + position: absolute; } -.oo-ui-popupWidget-body-padded { - padding: 0 1em; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { + z-index: 2; } -.oo-ui-popupButtonWidget { - position: relative; +.oo-ui-selectFileWidget-dropTarget { + cursor: default; } -.oo-ui-popupButtonWidget .oo-ui-popupWidget { - position: absolute; - cursor: auto; +.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget { + cursor: pointer; } -.oo-ui-popupButtonWidget.oo-ui-buttonElement-frameless > .oo-ui-popupWidget { - /* @noflip */ - left: 1em; +.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton, +.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton { + display: none; } -.oo-ui-popupButtonWidget.oo-ui-buttonElement-framed > .oo-ui-popupWidget { - /* @noflip */ - left: 1.25em; +.oo-ui-selectFileWidget:last-child { + margin-right: 0; } -.oo-ui-inputWidget { - margin-right: 0.5em; +.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { + margin-left: 0.5em; } -.oo-ui-inputWidget:last-child { - margin-right: 0; +.oo-ui-selectFileWidget-info { + height: 2.4em; + background-color: #ffffff; + border: 1px solid rgba(0, 0, 0, 0.1); + border-radius: 0.25em; } -.oo-ui-buttonInputWidget { - display: inline-block; - vertical-align: middle; +.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { + right: 0; } -.oo-ui-buttonInputWidget > button, -.oo-ui-buttonInputWidget > input { - border: 0; - padding: 0; - background-color: transparent; +.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { + left: 0; } -.oo-ui-dropdownInputWidget { - position: relative; - vertical-align: middle; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { + line-height: 2.3em; + margin: 0; + overflow: hidden; + white-space: nowrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - width: 100%; - max-width: 50em; + text-overflow: ellipsis; + left: 0.5em; + right: 0.5em; } -.oo-ui-dropdownInputWidget select { - display: inline-block; - width: 100%; - resize: none; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { + color: #888888; } -.oo-ui-dropdownInputWidget select { - background-color: #ffffff; - height: 2.5em; - padding: 0.5em; - font-size: inherit; - font-family: inherit; - border: 1px solid rgba(0, 0, 0, 0.1); - border-radius: 0.25em; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { + top: 0; + width: 1.875em; + margin-right: 0; } -.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover, -.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus { - border-color: rgba(0, 0, 0, 0.2); - outline: none; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { + height: 2.3em; } -.oo-ui-dropdownInputWidget.oo-ui-widget-disabled select { +.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { + top: 0; + width: 0.9375em; + height: 2.3em; + margin-right: 0.775em; +} +.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { + top: 0; + width: 1.875em; + height: 2.3em; + margin-left: 0.3em; +} +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info { color: #cccccc; + text-shadow: 0 1px 1px #ffffff; border-color: #dddddd; background-color: #f3f3f3; } -.oo-ui-radioSelectInputWidget .oo-ui-fieldLayout { - margin-bottom: 0; +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-textInputWidget { - position: relative; - vertical-align: middle; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - max-width: 50em; +.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label { + color: #cccccc; } -.oo-ui-textInputWidget input, -.oo-ui-textInputWidget textarea { - display: inline-block; - width: 100%; - resize: none; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + left: 2.475em; } -.oo-ui-textInputWidget textarea { - overflow: auto; +.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 2.175em; } -.oo-ui-textInputWidget input[type="search"] { - -webkit-appearance: none; +.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { + right: 0; } -.oo-ui-textInputWidget input[type="search"]::-ms-clear { - display: none; +.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 4.2625em; } -.oo-ui-textInputWidget input[type="search"]::-ms-reveal { - display: none; +.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { + right: 2.0875em; } -.oo-ui-textInputWidget input[type="search"]::-webkit-search-decoration, -.oo-ui-textInputWidget input[type="search"]::-webkit-search-cancel-button, -.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-button, -.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-decoration { - display: none; +.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, +.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 0.5em; } -.oo-ui-textInputWidget > .oo-ui-iconElement-icon, -.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator, -.oo-ui-textInputWidget > .oo-ui-labelElement-label { - display: none; +.oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, +.oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 2em; } -.oo-ui-textInputWidget.oo-ui-iconElement > .oo-ui-iconElement-icon, -.oo-ui-textInputWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { - display: block; - position: absolute; - top: 0; - height: 100%; +.oo-ui-selectFileWidget-dropTarget { + line-height: 3.5em; + background-color: #ffffff; + border: 1px dashed #aaaaaa; + padding: 0.5em 1em; + margin-bottom: 0.5em; + text-align: center; + vertical-align: middle; +} +.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget:hover, +.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop oo-ui-selectfilewidget-droptarget { + background-color: #e1f3ff; +} +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget, +.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget { + color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; +} +.oo-ui-outlineOptionWidget { + position: relative; + cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; + font-size: 1.1em; + padding: 0.75em; } -.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon, -.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { - cursor: text; -} -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator { - cursor: pointer; -} -.oo-ui-textInputWidget.oo-ui-labelElement > .oo-ui-labelElement-label { - display: block; +.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { + padding-right: 1.5em; } -.oo-ui-textInputWidget > .oo-ui-iconElement-icon { - left: 0; +.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + opacity: 0.5; } -.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator { - right: 0; +.oo-ui-outlineOptionWidget-level-0 { + padding-left: 3.5em; } -.oo-ui-textInputWidget > .oo-ui-labelElement-label { - position: absolute; - top: 0; +.oo-ui-outlineOptionWidget-level-0 .oo-ui-iconElement-icon { + left: 1em; } -.oo-ui-textInputWidget-labelPosition-after > .oo-ui-labelElement-label { - right: 0; +.oo-ui-outlineOptionWidget-level-1 { + padding-left: 5em; } -.oo-ui-textInputWidget-labelPosition-before > .oo-ui-labelElement-label { - left: 0; +.oo-ui-outlineOptionWidget-level-1 .oo-ui-iconElement-icon { + left: 2.5em; } -.oo-ui-textInputWidget input, -.oo-ui-textInputWidget textarea { - padding: 0.5em; - line-height: 1.275em; - font-size: inherit; - font-family: inherit; - background-color: #ffffff; - color: black; - border: 1px solid #cccccc; - box-shadow: 0 0 0 white, inset 0 0.1em 0.2em #dddddd; - border-radius: 0.25em; - -webkit-transition: border-color 250ms ease, box-shadow 250ms ease; - -moz-transition: border-color 250ms ease, box-shadow 250ms ease; - transition: border-color 250ms ease, box-shadow 250ms ease; +.oo-ui-outlineOptionWidget-level-2 { + padding-left: 6.5em; } -.oo-ui-textInputWidget input.oo-ui-pendingElement-pending, -.oo-ui-textInputWidget textarea.oo-ui-pendingElement-pending { - background-color: transparent; +.oo-ui-outlineOptionWidget-level-2 .oo-ui-iconElement-icon { + left: 4em; } -.oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, -.oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus { - outline: none; - border-color: #a7dcff; - box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white; +.oo-ui-selectWidget-depressed .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected { + background-color: #a7dcff; + text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5); } -.oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly], -.oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly] { - color: #777777; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-important { + font-weight: bold; } -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input, -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea { - background-color: #ffdddd; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-placeholder { + font-style: italic; } -.oo-ui-textInputWidget.oo-ui-widget-disabled input, -.oo-ui-textInputWidget.oo-ui-widget-disabled textarea { - color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-iconElement-icon { + opacity: 0.5; } -.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, -.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { - opacity: 0.2; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-labelElement-label { + color: #777777; } -.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-labelElement-label { - color: #dddddd; - text-shadow: 0 1px 1px #ffffff; +.oo-ui-outlineControlsWidget { + height: 3em; + background-color: #ffffff; } -.oo-ui-textInputWidget.oo-ui-iconElement input, -.oo-ui-textInputWidget.oo-ui-iconElement textarea { - padding-left: 2.475em; +.oo-ui-outlineControlsWidget-items, +.oo-ui-outlineControlsWidget-movers { + float: left; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon { - width: 1.875em; - max-height: 2.375em; - margin-left: 0.3em; +.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { + float: left; + background-position: right center; } -.oo-ui-textInputWidget.oo-ui-indicatorElement input, -.oo-ui-textInputWidget.oo-ui-indicatorElement textarea { - padding-right: 2.4875em; +.oo-ui-outlineControlsWidget-items { + float: left; } -.oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - width: 0.9375em; - max-height: 2.375em; - margin-right: 0.775em; +.oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget { + float: left; } -.oo-ui-textInputWidget > .oo-ui-labelElement-label { - padding: 0.4em; - line-height: 1.5em; - color: #888888; +.oo-ui-outlineControlsWidget-movers { + float: right; } -.oo-ui-textInputWidget-labelPosition-after.oo-ui-indicatorElement > .oo-ui-labelElement-label { - margin-right: 2.0875em; +.oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget { + float: right; } -.oo-ui-textInputWidget-labelPosition-before.oo-ui-iconElement > .oo-ui-labelElement-label { - margin-left: 2.075em; +.oo-ui-outlineControlsWidget-items, +.oo-ui-outlineControlsWidget-movers { + height: 2em; + margin: 0.5em 0.5em 0.5em 0; + padding: 0; } -.oo-ui-menuSelectWidget { - position: absolute; - background-color: #ffffff; - margin-top: -1px; - border: 1px solid #cccccc; - border-radius: 0 0 0.25em 0.25em; - box-shadow: 0 0.15em 1em 0 rgba(0, 0, 0, 0.2); +.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { + width: 1.5em; + height: 2em; + margin: 0.5em 0 0.5em 0.5em; + opacity: 0.2; } -.oo-ui-menuSelectWidget input { - position: absolute; - width: 0; - height: 0; +.oo-ui-tabSelectWidget { + text-align: left; + white-space: nowrap; overflow: hidden; - opacity: 0; -} -.oo-ui-menuOptionWidget { - position: relative; + background-color: #eeeeee; + box-shadow: inset 0 -0.015em 0.1em rgba(0, 0, 0, 0.1); } -.oo-ui-menuOptionWidget .oo-ui-iconElement-icon { - display: none; +.oo-ui-tabOptionWidget { + display: inline-block; + vertical-align: bottom; + padding: 0.5em 1em; + margin: 0.5em 0 0 0.75em; + border: 1px solid transparent; + border-bottom: none; + border-top-left-radius: 0.5em; + border-top-right-radius: 0.5em; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { - background-color: transparent; +.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { + padding-right: 1.5em; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon { - display: block; +.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + opacity: 0.5; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { +.oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-pressed { background-color: transparent; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted, -.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected { - background-color: #e1f3ff; +.oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { + background-color: rgba(255, 255, 255, 0.2); + border-color: #dddddd; } -.oo-ui-menuSectionOptionWidget { - cursor: default; - padding: 0.33em 0.75em; - color: #888888; +.oo-ui-tabOptionWidget.oo-ui-widget-enabled:active { + background-color: #ffffff; + border-color: #dddddd; } -.oo-ui-dropdownWidget { +.oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-selectWidget-depressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover { + background-color: #ffffff; + border-color: #dddddd; +} +.oo-ui-capsuleMultiSelectWidget { display: inline-block; position: relative; width: 100%; max-width: 50em; - background-color: #ffffff; - margin-right: 0.5em; } -.oo-ui-dropdownWidget-handle { +.oo-ui-capsuleMultiSelectWidget-handle { width: 100%; display: inline-block; - -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; + position: relative; } -.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator, -.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { - position: absolute; +.oo-ui-capsuleMultiSelectWidget-content { + position: relative; } -.oo-ui-dropdownWidget > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-content > input { + display: none; } -.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle { - cursor: pointer; +.oo-ui-capsuleMultiSelectWidget-group { + display: inline; } -.oo-ui-dropdownWidget:last-child { - margin-right: 0; +.oo-ui-capsuleMultiSelectWidget > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; } -.oo-ui-dropdownWidget-handle { - height: 2.5em; +.oo-ui-capsuleMultiSelectWidget-handle { + background-color: #ffffff; + cursor: text; + min-height: 2.4em; + margin-right: 0.5em; + padding: 0.15em 0.25em; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 0.25em; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-dropdownWidget-handle:hover { - border-color: rgba(0, 0, 0, 0.2); -} -.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { - right: 0; -} -.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { - left: 0.25em; +.oo-ui-capsuleMultiSelectWidget-handle:last-child { + margin-right: 0; } -.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { - line-height: 2.5em; - margin: 0 0.5em; +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator, +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { + position: absolute; + background-position: center center; + background-repeat: no-repeat; } -.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input { + border: none; + line-height: 1.675em; + margin: 0; + margin-left: 0.2em; + padding: 0; + font-size: inherit; + font-family: inherit; + background-color: transparent; + color: black; + vertical-align: middle; +} +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input:focus { + outline: none; +} +.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle { + padding-right: 2.4875em; +} +.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { + right: 0; top: 0; width: 0.9375em; height: 0.9375em; margin: 0.775em; } -.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { +.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle { + padding-left: 2.475em; +} +.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { + left: 0; top: 0; width: 1.875em; height: 1.875em; margin: 0.3em; } -.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle { +.oo-ui-capsuleMultiSelectWidget:hover .oo-ui-capsuleMultiSelectWidget-handle { + border-color: rgba(0, 0, 0, 0.2); +} +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle { color: #cccccc; text-shadow: 0 1px 1px #ffffff; border-color: #dddddd; background-color: #f3f3f3; + cursor: default; } -.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle:focus { - outline: 0; -} -.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon, +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { opacity: 0.2; } -.oo-ui-dropdownWidget.oo-ui-iconElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { - margin-left: 3em; -} -.oo-ui-dropdownWidget.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { - margin-right: 2em; +.oo-ui-capsuleMultiSelectWidget .oo-ui-selectWidget { + border-top-color: #ffffff; } -.oo-ui-selectFileWidget { +.oo-ui-capsuleItemWidget { + position: relative; display: inline-block; + cursor: default; + white-space: nowrap; + width: auto; + max-width: 100%; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; vertical-align: middle; - width: 100%; - max-width: 50em; - margin-right: 0.5em; + padding: 0 0.4em; + margin: 0.1em; + height: 1.7em; + line-height: 1.7em; + background-color: #eeeeee; + 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: linear-gradient(to bottom, #ffffff 0, #dddddd 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffffff', endColorstr='#ffdddddd' )"; + border: 1px solid #cccccc; + color: #555555; + border-radius: 0.25em; } -.oo-ui-selectFileWidget-selectButton { - display: table-cell; - vertical-align: middle; +.oo-ui-capsuleItemWidget > .oo-ui-iconElement-icon { + cursor: pointer; } -.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { - position: relative; +.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon { + cursor: default; +} +.oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label { + display: block; + text-overflow: ellipsis; overflow: hidden; } -.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > input[type="file"] { +.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-labelElement-label { + padding-right: 1.3375em; +} +.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { position: absolute; - margin: 0; + right: 0.4em; top: 0; - bottom: 0; - left: 0; - right: 0; - width: 100%; + width: 0.9375em; height: 100%; - opacity: 0; - z-index: 1; + background-repeat: no-repeat; +} +.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicator-clear { cursor: pointer; - padding-top: 100px; } -.oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > input[type="file"] { - display: none; +.oo-ui-capsuleItemWidget.oo-ui-widget-disabled { + opacity: 0.5; + -webkit-transform: translate3d(0, 0, 0); + box-shadow: none; + color: #333333; + background: #eeeeee; + border-color: #cccccc; } -.oo-ui-selectFileWidget-info { - width: 100%; - display: table-cell; - vertical-align: middle; - position: relative; - overflow: hidden; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { +.oo-ui-searchWidget-query { position: absolute; top: 0; - bottom: 0; left: 0; right: 0; - text-overflow: ellipsis; -} -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName { - float: left; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { - float: right; +.oo-ui-searchWidget-query .oo-ui-textInputWidget { + width: 100%; } -.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator, -.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { +.oo-ui-searchWidget-results { position: absolute; + bottom: 0; + left: 0; + right: 0; + overflow-x: hidden; + overflow-y: auto; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { - z-index: 2; -} -.oo-ui-selectFileWidget-dropTarget { - cursor: default; -} -.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget { - cursor: pointer; +.oo-ui-searchWidget-query { + height: 4em; + padding: 0 1em; + box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2); } -.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton, -.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton { - display: none; +.oo-ui-searchWidget-query .oo-ui-textInputWidget { + margin: 0.75em 0; } -.oo-ui-selectFileWidget:last-child { - margin-right: 0; +.oo-ui-searchWidget-results { + top: 4em; + padding: 1em; + line-height: 0; } -.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { - margin-left: 0.5em; +.oo-ui-numberInputWidget { + display: inline-block; + position: relative; + max-width: 50em; } -.oo-ui-selectFileWidget-info { - height: 2.4em; - background-color: #ffffff; - border: 1px solid rgba(0, 0, 0, 0.1); - border-radius: 0.25em; +.oo-ui-numberInputWidget-field { + display: table; + table-layout: fixed; + width: 100%; } -.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { - right: 0; +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget, +.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { + display: table-cell; + vertical-align: middle; } -.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { - left: 0; +.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { + width: 100%; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { - line-height: 2.3em; - margin: 0; - overflow: hidden; +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { white-space: nowrap; +} +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget > .oo-ui-buttonElement-button { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - text-overflow: ellipsis; - left: 0.5em; - right: 0.5em; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { - color: #888888; -} -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { - top: 0; - width: 1.875em; - margin-right: 0; +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { + width: 2.25em; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { - height: 2.3em; +.oo-ui-numberInputWidget-minusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border-right-width: 0; } -.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { - top: 0; - width: 0.9375em; - height: 2.3em; - margin-right: 0.775em; +.oo-ui-numberInputWidget-plusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + border-left-width: 0; } -.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { - top: 0; - width: 1.875em; - height: 2.3em; - margin-left: 0.3em; +.oo-ui-numberInputWidget .oo-ui-textInputWidget input { + border-radius: 0; } -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info { - color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; + +/*! + * OOjs UI v0.15.2 + * https://www.mediawiki.org/wiki/OOjs_UI + * + * Copyright 2011–2016 OOjs UI Team and other contributors. + * Released under the MIT license + * http://oojs.mit-license.org + * + * Date: 2016-02-02T22:07:06Z + */ +@-webkit-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { - opacity: 0.2; +@-moz-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label { - color: #cccccc; +@-ms-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - left: 2.475em; +@-o-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 2.175em; +@keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { - right: 0; +.oo-ui-popupTool .oo-ui-popupWidget-popup, +.oo-ui-popupTool .oo-ui-popupWidget-anchor { + z-index: 4; } -.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 4.2625em; +.oo-ui-popupTool .oo-ui-popupWidget { + /* @noflip */ + margin-left: 1.25em; } -.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { - right: 2.0875em; +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup { + border: 0; + border-radius: 0; + margin: 0; } -.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, -.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 0.5em; +.oo-ui-toolGroupTool:first-child > .oo-ui-popupToolGroup { + border-top-left-radius: 0.3125em; + border-bottom-left-radius: 0.3125em; } -.oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, -.oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 2em; +.oo-ui-toolGroupTool:last-child > .oo-ui-popupToolGroup { + border-top-right-radius: 0.3125em; + border-bottom-right-radius: 0.3125em; } -.oo-ui-selectFileWidget-dropTarget { - line-height: 3.5em; - background-color: #ffffff; - border: 1px dashed #aaaaaa; - padding: 0.5em 1em; - margin-bottom: 0.5em; - text-align: center; +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle { + height: 1.875em; + padding: 0.3125em; +} +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + height: 1.875em; + width: 1.875em; +} +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup.oo-ui-labelElement > .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + line-height: 2.1em; +} +.oo-ui-toolGroup { + display: inline-block; vertical-align: middle; + margin: 0.375em; + border-radius: 0.3125em; + border: 1px solid transparent; + -webkit-transition: border-color 250ms ease; + -moz-transition: border-color 250ms ease; + transition: border-color 250ms ease; } -.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget:hover, -.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop oo-ui-selectfilewidget-droptarget { - background-color: #e1f3ff; +.oo-ui-toolGroup-empty { + display: none; } -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget, -.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget { - color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; +.oo-ui-toolGroup .oo-ui-tool-link { + text-decoration: none; } -.oo-ui-outlineOptionWidget { - position: relative; - cursor: pointer; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - font-size: 1.1em; - padding: 0.75em; +.oo-ui-toolbar-narrow .oo-ui-toolGroup + .oo-ui-toolGroup { + margin-left: 0; } -.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { - padding-right: 1.5em; +.oo-ui-toolGroup.oo-ui-widget-enabled:hover { + border-color: rgba(0, 0, 0, 0.1); } -.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - opacity: 0.5; +.oo-ui-toolGroup.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title { + color: #000000; } -.oo-ui-outlineOptionWidget-level-0 { - padding-left: 3.5em; +.oo-ui-barToolGroup > .oo-ui-iconElement-icon, +.oo-ui-barToolGroup > .oo-ui-labelElement-label { + display: none; } -.oo-ui-outlineOptionWidget-level-0 .oo-ui-iconElement-icon { - left: 1em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { + cursor: pointer; } -.oo-ui-outlineOptionWidget-level-1 { - padding-left: 5em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool { + display: inline-block; + position: relative; + vertical-align: top; } -.oo-ui-outlineOptionWidget-level-1 .oo-ui-iconElement-icon { - left: 2.5em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { + display: block; } -.oo-ui-outlineOptionWidget-level-2 { - padding-left: 6.5em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-accel { + display: none; } -.oo-ui-outlineOptionWidget-level-2 .oo-ui-iconElement-icon { - left: 4em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-iconElement-icon { + display: inline-block; + vertical-align: top; } -.oo-ui-selectWidget-depressed .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected { - background-color: #a7dcff; - text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5); +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-tool-title { + display: none; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-important { - font-weight: bold; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title { + display: inline; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-placeholder { - font-style: italic; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link { + outline: 0; + cursor: default; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-iconElement-icon { - opacity: 0.5; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool { + margin: -1px 0 -1px -1px; + border: 1px solid transparent; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-labelElement-label { - color: #777777; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool:first-child { + border-top-left-radius: 0.3125em; + border-bottom-left-radius: 0.3125em; } -.oo-ui-outlineControlsWidget { - height: 3em; - background-color: #ffffff; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool:last-child { + margin-right: -1px; + border-top-right-radius: 0.3125em; + border-bottom-right-radius: 0.3125em; } -.oo-ui-outlineControlsWidget-items, -.oo-ui-outlineControlsWidget-movers { - float: left; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { + height: 1.875em; + padding: 0.3125em; } -.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { - float: left; - background-position: right center; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon { + height: 1.875em; + width: 1.875em; } -.oo-ui-outlineControlsWidget-items { - float: left; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title { + line-height: 2.1em; } -.oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget { - float: left; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover { + border-color: rgba(0, 0, 0, 0.2); } -.oo-ui-outlineControlsWidget-movers { - float: right; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-tool-active.oo-ui-widget-enabled { + border-color: rgba(0, 0, 0, 0.2); + box-shadow: inset 0 0.0875em 0.0875em 0 rgba(0, 0, 0, 0.07); + background-color: #f8fbfd; + 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: linear-gradient(to bottom, #f1f7fb 0, #ffffff 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff1f7fb', endColorstr='#ffffffff' )"; } -.oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget { - float: right; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.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-outlineControlsWidget-items, -.oo-ui-outlineControlsWidget-movers { - height: 2em; - margin: 0.5em 0.5em 0.5em 0; - padding: 0; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link:focus { + outline: 0; } -.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { - width: 1.5em; - height: 2em; - margin: 0.5em 0 0.5em 0.5em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title { + color: #cccccc; +} +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-iconElement-icon { opacity: 0.2; } -.oo-ui-tabSelectWidget { - text-align: left; - white-space: nowrap; - overflow: hidden; - background-color: #eeeeee; - box-shadow: inset 0 -0.015em 0.1em rgba(0, 0, 0, 0.1); +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover > .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 1; } -.oo-ui-tabOptionWidget { - display: inline-block; - vertical-align: bottom; - padding: 0.5em 1em; - margin: 0.5em 0 0 0.75em; - border: 1px solid transparent; - border-bottom: none; - border-top-left-radius: 0.5em; - border-top-right-radius: 0.5em; +.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool:focus { + outline: 0; } -.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { - padding-right: 1.5em; +.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link:focus { + outline: 0; } -.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - opacity: 0.5; +.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title { + color: #cccccc; } -.oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-pressed { - background-color: transparent; +.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.2; } -.oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { - background-color: rgba(255, 255, 255, 0.2); - border-color: #dddddd; +.oo-ui-popupToolGroup { + position: relative; + height: 2.5em; + min-width: 2.5em; } -.oo-ui-tabOptionWidget.oo-ui-widget-enabled:active { - background-color: #ffffff; - border-color: #dddddd; +.oo-ui-popupToolGroup-handle { + display: block; + cursor: pointer; } -.oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-selectWidget-depressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover { - background-color: #ffffff; - border-color: #dddddd; +.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator, +.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + position: absolute; } -.oo-ui-capsuleMultiSelectWidget { - display: inline-block; - position: relative; - width: 100%; - max-width: 50em; +.oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle { + outline: 0; + cursor: default; } -.oo-ui-capsuleMultiSelectWidget-handle { - width: 100%; - display: inline-block; - position: relative; +.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { + display: none; + position: absolute; + z-index: 4; } -.oo-ui-capsuleMultiSelectWidget-content { - position: relative; +.oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools { + display: block; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-content > input { - display: none; +.oo-ui-popupToolGroup-left > .oo-ui-toolGroup-tools { + left: 0; } -.oo-ui-capsuleMultiSelectWidget-group { - display: inline; +.oo-ui-popupToolGroup-right > .oo-ui-toolGroup-tools { + right: 0; } -.oo-ui-capsuleMultiSelectWidget > .oo-ui-menuSelectWidget { - z-index: 1; +.oo-ui-popupToolGroup .oo-ui-tool-link { + display: table; width: 100%; + vertical-align: middle; + white-space: nowrap; } -.oo-ui-capsuleMultiSelectWidget-handle { - background-color: #ffffff; - cursor: text; - min-height: 2.4em; - margin-right: 0.5em; - padding: 0.15em 0.25em; - border: 1px solid rgba(0, 0, 0, 0.1); - border-radius: 0.25em; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon, +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { + display: table-cell; + vertical-align: middle; } -.oo-ui-capsuleMultiSelectWidget-handle:last-child { - margin-right: 0; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { + text-align: right; } -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator, -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { - position: absolute; - background-position: center center; - background-repeat: no-repeat; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel:not(:empty) { + padding-left: 3em; } -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input { - border: none; - line-height: 1.675em; - margin: 0; - margin-left: 0.2em; - padding: 0; - font-size: inherit; - font-family: inherit; - background-color: transparent; - color: black; - vertical-align: middle; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup { + min-width: 1.875em; } -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input:focus { - outline: none; +.oo-ui-popupToolGroup.oo-ui-iconElement { + min-width: 3.125em; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle { - padding-right: 2.4875em; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement { + min-width: 2.5em; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { - right: 0; - top: 0; +.oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { + min-width: 4.375em; +} +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { + min-width: 3.75em; +} +.oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + line-height: 2.6em; + margin: 0 1em; +} +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin: 0 0.5em; +} +.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-left: 3em; +} +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-left: 2.5em; +} +.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-right: 2.25em; +} +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-right: 1.75em; +} +.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { width: 0.9375em; height: 0.9375em; - margin: 0.775em; + margin: 0.78125em; + top: 0; + right: 0; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle { - padding-left: 2.475em; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { + right: -0.3125em; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { - left: 0; - top: 0; +.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { width: 1.875em; height: 1.875em; - margin: 0.3em; + margin: 0.3125em; + top: 0; + left: 0.3125em; } -.oo-ui-capsuleMultiSelectWidget:hover .oo-ui-capsuleMultiSelectWidget-handle { - border-color: rgba(0, 0, 0, 0.2); +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + left: 0; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle { - color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; - cursor: default; +.oo-ui-popupToolGroup-header { + line-height: 2.6em; + margin: 0 0.6em; + font-weight: bold; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon, -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { - opacity: 0.2; +.oo-ui-popupToolGroup-active.oo-ui-widget-enabled { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + box-shadow: inset 0 0.0875em 0.0875em 0 rgba(0, 0, 0, 0.07); + background-color: #f8fbfd; + 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: linear-gradient(to bottom, #f1f7fb 0, #ffffff 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff1f7fb', endColorstr='#ffffffff' )"; } -.oo-ui-capsuleMultiSelectWidget .oo-ui-selectWidget { - border-top-color: #ffffff; +.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { + top: 2.5em; + margin: 0 -1px; + border: 1px solid #cccccc; + background-color: white; + box-shadow: 0 0.3125em 1.25em rgba(0, 0, 0, 0.25); } -.oo-ui-capsuleItemWidget { - position: relative; - display: inline-block; - cursor: default; - white-space: nowrap; - width: auto; - max-width: 100%; +.oo-ui-popupToolGroup .oo-ui-tool-link { + padding: 0.3125em 0 0.3125em 0.3125em; +} +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { + height: 1.875em; + width: 1.875em; + min-width: 1.875em; +} +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { + padding-left: 0.5em; +} +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { + line-height: 2em; +} +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { + color: #888888; +} +.oo-ui-listToolGroup .oo-ui-tool { + display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - vertical-align: middle; - padding: 0 0.4em; - margin: 0.1em; - height: 1.7em; - line-height: 1.7em; - background: #eeeeee; - filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fff', endColorstr='#ddd'); - 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: -o-linear-gradient(top, #ffffff 0%, #dddddd 100%); - background-image: linear-gradient(to bottom, #ffffff 0%, #dddddd 100%); - border: 1px solid #cccccc; - color: #555555; - border-radius: 0.25em; } -.oo-ui-capsuleItemWidget > .oo-ui-iconElement-icon { +.oo-ui-listToolGroup .oo-ui-tool-link { cursor: pointer; } -.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon { +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { cursor: default; } -.oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label { - display: block; - text-overflow: ellipsis; - overflow: hidden; +.oo-ui-listToolGroup .oo-ui-toolGroup-tools { + padding: 0.3125em; } -.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-labelElement-label { - padding-right: 1.3375em; +.oo-ui-listToolGroup.oo-ui-popupToolGroup-active { + border-color: rgba(0, 0, 0, 0.2); } -.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { - position: absolute; - right: 0.4em; - top: 0; - width: 0.9375em; - height: 100%; - background-repeat: no-repeat; +.oo-ui-listToolGroup .oo-ui-tool { + border: 1px solid transparent; + margin: -1px 0; + padding: 0 0.625em 0 0; } -.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicator-clear { - cursor: pointer; +.oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled { + border-color: rgba(0, 0, 0, 0.1); + box-shadow: inset 0 0.0875em 0.0875em 0 rgba(0, 0, 0, 0.07); + background-color: #f8fbfd; + 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: linear-gradient(to bottom, #f1f7fb 0, #ffffff 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff1f7fb', endColorstr='#ffffffff' )"; } -.oo-ui-capsuleItemWidget.oo-ui-widget-disabled { - opacity: 0.5; - -webkit-transform: translate3d(0, 0, 0); - box-shadow: none; - color: #333333; - background: #eeeeee; - border-color: #cccccc; +.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-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-indicatorElement-indicator { +.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:hover .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 1; +} +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { + color: #cccccc; +} +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-accel { + color: #dddddd; +} +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { opacity: 0.2; } -.oo-ui-comboBoxInputWidget { - display: inline-block; - position: relative; - width: 100%; - max-width: 50em; - margin-right: 0.5em; +.oo-ui-listToolGroup.oo-ui-widget-disabled { + color: #cccccc; } -.oo-ui-comboBoxInputWidget > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; +.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, +.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { + opacity: 0.2; } -.oo-ui-comboBoxInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { +.oo-ui-menuToolGroup { + border-color: rgba(0, 0, 0, 0.1); +} +.oo-ui-menuToolGroup .oo-ui-tool { + display: block; +} +.oo-ui-menuToolGroup .oo-ui-tool-link { cursor: pointer; } -.oo-ui-comboBoxInputWidget-php input::-webkit-calendar-picker-indicator { - opacity: 0 !important; - position: absolute; - right: 0; - top: 0; - height: 2.5em; - width: 2.5em; - padding: 0; +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { + cursor: default; } -.oo-ui-comboBoxInputWidget-php > .oo-ui-indicatorElement-indicator { - pointer-events: none; +.oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { + min-width: 10em; } -.oo-ui-comboBoxInputWidget:last-child { - margin-right: 0; +.oo-ui-toolbar-narrow .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { + min-width: 8.125em; } -.oo-ui-comboBoxInputWidget.oo-ui-widget-disabled .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator, -.oo-ui-comboBoxInputWidget-empty .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - cursor: default; - opacity: 0.2; +.oo-ui-menuToolGroup .oo-ui-toolGroup-tools { + padding: 0.3125em 0 0.3125em 0; } -.oo-ui-comboBoxInputWidget > .oo-ui-selectWidget { - margin-top: -3px; +.oo-ui-menuToolGroup.oo-ui-widget-enabled:hover { + border-color: rgba(0, 0, 0, 0.2); } -.oo-ui-searchWidget-query { - position: absolute; - top: 0; - left: 0; - right: 0; +.oo-ui-menuToolGroup.oo-ui-popupToolGroup-active { + border-color: rgba(0, 0, 0, 0.25); } -.oo-ui-searchWidget-query .oo-ui-textInputWidget { - width: 100%; +.oo-ui-menuToolGroup .oo-ui-tool { + padding: 0 1.25em 0 0.3125em; } -.oo-ui-searchWidget-results { - position: absolute; - bottom: 0; - left: 0; - right: 0; - overflow-x: hidden; - overflow-y: auto; +.oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { + background-image: none; } -.oo-ui-searchWidget-query { - height: 4em; - padding: 0 1em; - box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2); +.oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconElement-icon { + background-image: url("themes/apex/images/icons/check.png"); + background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/apex/images/icons/check.svg"); + background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/apex/images/icons/check.svg"); + background-image: -o-linear-gradient(transparent, transparent), url("themes/apex/images/icons/check.png"); + background-size: contain; + background-position: center center; + background-repeat: no-repeat; } -.oo-ui-searchWidget-query .oo-ui-textInputWidget { - margin: 0.75em 0; +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { + background-color: #e1f3ff; } -.oo-ui-searchWidget-results { - top: 4em; - padding: 1em; - line-height: 0; +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { + color: #cccccc; } -.oo-ui-numberInputWidget { - display: inline-block; +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.2; +} +.oo-ui-menuToolGroup.oo-ui-widget-disabled { + color: #cccccc; + border-color: rgba(0, 0, 0, 0.05); +} +.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, +.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { + opacity: 0.2; +} +.oo-ui-toolbar { + clear: both; +} +.oo-ui-toolbar-bar { + line-height: 1em; position: relative; - max-width: 50em; } -.oo-ui-numberInputWidget-field { - display: table; - table-layout: fixed; - width: 100%; +.oo-ui-toolbar-actions { + float: right; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget, -.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { - display: table-cell; - vertical-align: middle; +.oo-ui-toolbar-actions .oo-ui-toolbar { + display: inline-block; } -.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { +.oo-ui-toolbar-tools { + display: inline; + white-space: nowrap; +} +.oo-ui-toolbar-narrow .oo-ui-toolbar-tools { + white-space: normal; +} +.oo-ui-toolbar-tools .oo-ui-tool { + white-space: normal; +} +.oo-ui-toolbar-tools, +.oo-ui-toolbar-actions, +.oo-ui-toolbar-shadow { + -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-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; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { - white-space: nowrap; +.oo-ui-toolbar-bar { + border-bottom: 1px solid #cccccc; + background-color: #f8fbfd; + 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: linear-gradient(to bottom, #ffffff 0, #f1f7fb 100%); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffffff', endColorstr='#fff1f7fb' )"; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget > .oo-ui-buttonElement-button { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-toolbar-bar .oo-ui-toolbar-bar { + border: none; + background: none; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { - width: 2.25em; +.oo-ui-toolbar-actions > .oo-ui-buttonElement-framed, +.oo-ui-toolbar-actions > .oo-ui-buttonElement-framed:last-child { + margin-top: 0.4em; + margin-bottom: 0.4em; + margin-right: 0.5em; } -.oo-ui-numberInputWidget-minusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-right-width: 0; +.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless.oo-ui-labelElement, +.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless:last-child.oo-ui-labelElement { + margin: 0; } -.oo-ui-numberInputWidget-plusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-width: 0; +.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button, +.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless:last-child.oo-ui-labelElement > .oo-ui-buttonElement-button { + margin: 0; + padding: 0 0.3125em; } -.oo-ui-numberInputWidget .oo-ui-textInputWidget input { - border-radius: 0; +.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label, +.oo-ui-toolbar-actions > .oo-ui-buttonElement-frameless:last-child.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label { + margin: 0 1em; + line-height: 3.40625em; +} +.oo-ui-toolbar-shadow { + background-image: /* @embed */ url(themes/apex/images/toolbar-shadow.png); + bottom: -9px; + height: 9px; + opacity: 0.5; + -webkit-transition: opacity 500ms ease; + -moz-transition: opacity 500ms ease; + transition: opacity 500ms ease; +} + +/*! + * OOjs UI v0.15.2 + * https://www.mediawiki.org/wiki/OOjs_UI + * + * Copyright 2011–2016 OOjs UI Team and other contributors. + * Released under the MIT license + * http://oojs.mit-license.org + * + * Date: 2016-02-02T22:07:06Z + */ +@-webkit-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +@-moz-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +@-ms-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +@-o-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +@keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +.oo-ui-actionWidget.oo-ui-pendingElement-pending { + background-image: /* @embed */ url(themes/apex/images/textures/pending.gif); } .oo-ui-window { background-color: transparent; diff --git a/resources/lib/oojs-ui/oojs-ui-apex.js b/resources/lib/oojs-ui/oojs-ui-apex.js index 5f9c93ccd3..83ffbd7538 100644 --- a/resources/lib/oojs-ui/oojs-ui-apex.js +++ b/resources/lib/oojs-ui/oojs-ui-apex.js @@ -1,13 +1,17 @@ /*! - * OOjs UI v0.15.1 + * OOjs UI v0.15.2 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2016 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2016-01-26T21:14:23Z + * Date: 2016-02-02T22:07:00Z */ +( function ( OO ) { + +'use strict'; + /** * @class * @extends OO.ui.Theme @@ -26,3 +30,5 @@ OO.inheritClass( OO.ui.ApexTheme, OO.ui.Theme ); /* Instantiation */ OO.ui.theme = new OO.ui.ApexTheme(); + +}( OO ) ); diff --git a/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css b/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css index cd5ef366ac..6a11bdb2a1 100644 --- a/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css +++ b/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.15.1 + * OOjs UI v0.15.2 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2016 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2016-01-26T21:14:25Z + * Date: 2016-02-02T22:07:06Z */ @-webkit-keyframes oo-ui-progressBarWidget-slide { from { @@ -32,14 +32,6 @@ margin-left: 100%; } } -/* @noflip */ -.oo-ui-rtl { - direction: rtl; -} -/* @noflip */ -.oo-ui-ltr { - direction: ltr; -} .oo-ui-element-hidden { display: none !important; } @@ -386,22 +378,6 @@ -moz-box-sizing: border-box; box-sizing: border-box; } -.oo-ui-draggableElement { - cursor: -webkit-grab -moz-grab, url(images/grab.cur), move; -} -.oo-ui-draggableElement-dragging { - cursor: -webkit-grabbing -moz-grabbing, url(images/grabbing.cur), move; - background: rgba(0, 0, 0, 0.2); - opacity: 0.4; -} -.oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement.oo-ui-optionWidget { - display: inline-block; -} -.oo-ui-draggableGroupElement-placeholder { - position: absolute; - display: block; - background: rgba(0, 0, 0, 0.4); -} .oo-ui-iconElement .oo-ui-iconElement-icon, .oo-ui-iconElement.oo-ui-iconElement-icon { background-size: contain; @@ -414,66 +390,9 @@ background-position: center center; background-repeat: no-repeat; } -.oo-ui-lookupElement > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; -} .oo-ui-pendingElement-pending { background-image: /* @embed */ url(themes/mediawiki/images/textures/pending.gif); } -.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; -} -.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-outlineSelectWidget { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 3em; - overflow-y: auto; -} -.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { - position: absolute; - bottom: 0; - left: 0; - right: 0; -} -.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout { - padding: 1.5em; -} -.oo-ui-bookletLayout-outlinePanel { - border-right: 1px solid #dddddd; -} -.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { - box-shadow: 0 0.15em 0 0 rgba(0, 0, 0, 0.15); -} -.oo-ui-indexLayout > .oo-ui-menuLayout-menu { - height: 3em; -} -.oo-ui-indexLayout > .oo-ui-menuLayout-content { - top: 3em; -} -.oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout { - padding: 1.5em; -} -.oo-ui-indexLayout > .oo-ui-menuLayout-menu { - height: 2.75em; -} -.oo-ui-indexLayout > .oo-ui-menuLayout-content { - top: 2.75em; -} .oo-ui-fieldLayout { display: block; margin-bottom: 1em; @@ -634,85 +553,6 @@ .oo-ui-formLayout + .oo-ui-formLayout { margin-top: 2em; } -.oo-ui-menuLayout { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; -} -.oo-ui-menuLayout-menu, -.oo-ui-menuLayout-content { - position: absolute; - -webkit-transition: all 200ms ease; - -moz-transition: all 200ms ease; - transition: all 200ms ease; -} -.oo-ui-menuLayout-menu { - height: 18em; - width: 18em; -} -.oo-ui-menuLayout-content { - top: 18em; - left: 18em; - right: 18em; - bottom: 18em; -} -.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu { - width: 0 !important; - height: 0 !important; - overflow: hidden; -} -.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content { - top: 0 !important; - left: 0 !important; - right: 0 !important; - bottom: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu { - width: auto !important; - left: 0; - top: 0; - right: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content { - right: 0 !important; - bottom: 0 !important; - left: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu { - height: auto !important; - top: 0; - right: 0; - bottom: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content { - bottom: 0 !important; - left: 0 !important; - top: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu { - width: auto !important; - right: 0; - bottom: 0; - left: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content { - left: 0 !important; - top: 0 !important; - right: 0 !important; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu { - height: auto !important; - bottom: 0; - left: 0; - top: 0; -} -.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content { - top: 0 !important; - right: 0 !important; - bottom: 0 !important; -} .oo-ui-panelLayout { position: relative; } @@ -737,10 +577,6 @@ .oo-ui-panelLayout-padded.oo-ui-panelLayout-framed { margin: 1em 0; } -.oo-ui-stackLayout-continuous > .oo-ui-panelLayout { - display: block; - position: relative; -} .oo-ui-horizontalLayout > .oo-ui-widget { display: inline-block; vertical-align: middle; @@ -759,508 +595,979 @@ .oo-ui-horizontalLayout > .oo-ui-layout { margin-bottom: 0; } -.oo-ui-popupTool .oo-ui-popupWidget-popup, -.oo-ui-popupTool .oo-ui-popupWidget-anchor { - z-index: 4; -} -.oo-ui-popupTool .oo-ui-popupWidget { - /* @noflip */ - margin-left: 1.25em; -} -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup { +.oo-ui-optionWidget { + position: relative; + display: block; + padding: 0.25em 0.5em; border: 0; - border-radius: 0; - margin: 0; -} -.oo-ui-toolGroupTool > .oo-ui-toolGroup { - border-right: none; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle { - height: 2.5em; - padding: 0.3125em; +.oo-ui-optionWidget.oo-ui-widget-enabled { + cursor: pointer; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { - height: 2.5em; - width: 1.875em; +.oo-ui-optionWidget.oo-ui-labelElement .oo-ui-labelElement-label { + display: block; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } -.oo-ui-toolGroupTool > .oo-ui-popupToolGroup.oo-ui-labelElement > .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - line-height: 2.1em; +.oo-ui-optionWidget-highlighted { + background-color: #eeeeee; } -.oo-ui-toolGroup { - display: inline-block; - vertical-align: middle; - border-radius: 0; - border-right: 1px solid #dddddd; +.oo-ui-optionWidget .oo-ui-labelElement-label { + line-height: 1.5em; } -.oo-ui-toolGroup-empty { - display: none; +.oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected, +.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed, +.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted, +.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected { + background-color: #d0d0d0; } -.oo-ui-toolGroup .oo-ui-tool-link { - text-decoration: none; +.oo-ui-optionWidget.oo-ui-widget-disabled { + color: #cccccc; } -.oo-ui-toolbar-narrow .oo-ui-toolGroup + .oo-ui-toolGroup { - margin-left: 0; +.oo-ui-decoratedOptionWidget { + padding: 0.5em 2em 0.5em 3em; } -.oo-ui-toolGroup .oo-ui-toolGroup .oo-ui-widget-enabled { - border-right: none !important; +.oo-ui-decoratedOptionWidget .oo-ui-iconElement-icon, +.oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator { + position: absolute; } -.oo-ui-barToolGroup > .oo-ui-iconElement-icon, -.oo-ui-barToolGroup > .oo-ui-labelElement-label { - display: none; +.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon, +.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + top: 0; + height: 100%; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { - cursor: pointer; +.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon { + width: 1.875em; + left: 0.5em; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool { - display: inline-block; - position: relative; - vertical-align: top; +.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + width: 0.9375em; + right: 0.5em; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { - display: block; +.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, +.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-accel { - display: none; +.oo-ui-radioOptionWidget { + cursor: default; + padding: 0.25em 0; + background-color: transparent; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-iconElement-icon { +.oo-ui-radioOptionWidget .oo-ui-radioInputWidget, +.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { display: inline-block; - vertical-align: top; + vertical-align: middle; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-tool-title { - display: none; +.oo-ui-radioOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-radioOptionWidget.oo-ui-optionWidget-pressed, +.oo-ui-radioOptionWidget.oo-ui-optionWidget-highlighted { + background-color: transparent; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title { - display: inline; +.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { + padding: 0.25em 0.25em 0.25em 1em; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link { - outline: 0; - cursor: default; +.oo-ui-radioOptionWidget .oo-ui-radioInputWidget { + margin-right: 0; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { - height: 1.875em; - padding: 0.625em; +.oo-ui-labelWidget { + display: inline-block; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon { - height: 1.875em; +.oo-ui-iconWidget { + display: inline-block; + vertical-align: middle; + line-height: 2.5em; width: 1.875em; + height: 1.875em; } -.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title { - line-height: 2.1em; - padding: 0 0.4em; -} -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.2); - background-color: #eeeeee; -} -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > a.oo-ui-tool-link .oo-ui-tool-title { - color: #555555; -} -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.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-color: #e5e5e5; +.oo-ui-iconWidget.oo-ui-widget-disabled { + opacity: 0.2; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-tool-active.oo-ui-widget-enabled:hover { - background-color: #eeeeee; +.oo-ui-indicatorWidget { + display: inline-block; + vertical-align: middle; + line-height: 2.5em; + width: 0.9375em; + height: 0.9375em; + margin: 0.46875em; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.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-indicatorWidget.oo-ui-widget-disabled { + opacity: 0.2; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title { - color: #cccccc; +.oo-ui-buttonWidget { + display: inline-block; + vertical-align: middle; + margin-right: 0.5em; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-buttonWidget:last-child { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.7; +.oo-ui-buttonGroupWidget { + display: inline-block; + white-space: nowrap; + border-radius: 2px; + margin-right: 0.5em; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover > .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.9; +.oo-ui-buttonGroupWidget:last-child { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:active { - background-color: #e7e7e7; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > a.oo-ui-tool-link .oo-ui-tool-title { - color: #cccccc; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement:last-child { + margin-right: 0; } -.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > a.oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed .oo-ui-buttonElement-button { + border-radius: 0; + margin-left: -1px; } -.oo-ui-popupToolGroup { - position: relative; - height: 3.125em; - min-width: 2em; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button { + border-bottom-left-radius: 2px; + border-top-left-radius: 2px; + margin-left: 0; } -.oo-ui-popupToolGroup-handle { - display: block; - cursor: pointer; +.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button { + border-bottom-right-radius: 2px; + border-top-right-radius: 2px; } -.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator, -.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { +.oo-ui-popupWidget { position: absolute; + /* @noflip */ + left: 0; } -.oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle { - outline: 0; - cursor: default; +.oo-ui-popupWidget-popup { + position: relative; + overflow: hidden; + z-index: 1; } -.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { +.oo-ui-popupWidget-anchor { display: none; - position: absolute; - z-index: 4; + z-index: 1; } -.oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools { +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor { display: block; -} -.oo-ui-popupToolGroup-left > .oo-ui-toolGroup-tools { + position: absolute; + top: 0; + /* @noflip */ left: 0; + background-repeat: no-repeat; } -.oo-ui-popupToolGroup-right > .oo-ui-toolGroup-tools { - right: 0; +.oo-ui-popupWidget-head { + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } -.oo-ui-popupToolGroup .oo-ui-tool-link { - display: table; - width: 100%; - vertical-align: middle; - white-space: nowrap; +.oo-ui-popupWidget-head > .oo-ui-buttonWidget { + float: right; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon, -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { - display: table-cell; - vertical-align: middle; +.oo-ui-popupWidget-head > .oo-ui-labelElement-label { + float: left; + cursor: default; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { - text-align: right; +.oo-ui-popupWidget-body { + clear: both; + overflow: hidden; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel:not(:empty) { - padding-left: 3em; +.oo-ui-popupWidget-popup { + background-color: #ffffff; + border: 1px solid #aaaaaa; + border-radius: 2px; + box-shadow: 0 0.15em 0 0 rgba(0, 0, 0, 0.15); } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup { - min-width: 1.875em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-popup { + margin-top: 9px; } -.oo-ui-popupToolGroup.oo-ui-iconElement { - min-width: 3.125em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before, +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { + content: ""; + position: absolute; + width: 0; + height: 0; + border-style: solid; + border-color: transparent; + border-top: 0; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement { - min-width: 2.5em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before { + bottom: -10px; + left: -9px; + border-bottom-color: #888888; + border-width: 10px; } -.oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { - min-width: 4.375em; +.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { + bottom: -10px; + left: -8px; + border-bottom-color: #ffffff; + border-width: 9px; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { - min-width: 3.75em; +.oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup { + -webkit-transition: width 100ms ease, height 100ms ease, left 100ms ease; + -moz-transition: width 100ms ease, height 100ms ease, left 100ms ease; + transition: width 100ms ease, height 100ms ease, left 100ms ease; } -.oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - line-height: 2.6em; - margin: 0 1em; +.oo-ui-popupWidget-head { + height: 2.5em; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin: 0 0.5em; +.oo-ui-popupWidget-head > .oo-ui-buttonWidget { + margin: 0.25em; } -.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-left: 3em; +.oo-ui-popupWidget-head > .oo-ui-labelElement-label { + margin: 0.75em 1em; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-left: 2.5em; +.oo-ui-popupWidget-body-padded { + padding: 0 1em; } -.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-right: 2em; +.oo-ui-popupButtonWidget { + position: relative; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { - margin-right: 1.75em; +.oo-ui-popupButtonWidget .oo-ui-popupWidget { + position: absolute; + cursor: auto; } -.oo-ui-popupToolGroup.oo-ui-widget-enabled .oo-ui-popupToolGroup-handle:hover { - background-color: #eeeeee; +.oo-ui-popupButtonWidget.oo-ui-buttonElement-frameless > .oo-ui-popupWidget { + /* @noflip */ + left: 1em; } -.oo-ui-popupToolGroup.oo-ui-widget-enabled .oo-ui-popupToolGroup-handle:active { - background-color: #e5e5e5; +.oo-ui-popupButtonWidget.oo-ui-buttonElement-framed > .oo-ui-popupWidget { + /* @noflip */ + left: 1.75em; } -.oo-ui-popupToolGroup-handle { - padding: 0.3125em; - height: 2.5em; +.oo-ui-inputWidget { + margin-right: 0.5em; } -.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { - width: 0.9375em; - height: 1.625em; - margin: 0.78125em 0.5em; - top: 0; - right: 0; - opacity: 0.3; +.oo-ui-inputWidget:last-child { + margin-right: 0; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { - right: -0.3125em; +.oo-ui-buttonInputWidget { + display: inline-block; + vertical-align: middle; } -.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { - width: 1.875em; - height: 2.6em; - margin: 0.25em; +.oo-ui-buttonInputWidget > button, +.oo-ui-buttonInputWidget > input { + border: 0; + padding: 0; + background-color: transparent; +} +.oo-ui-checkboxInputWidget { + position: relative; + line-height: 1.6em; + white-space: nowrap; +} +.oo-ui-checkboxInputWidget * { + font: inherit; + vertical-align: middle; +} +.oo-ui-checkboxInputWidget input[type="checkbox"] { + opacity: 0; + z-index: 1; + position: relative; + cursor: pointer; + margin: 0; + width: 1.6em; + height: 1.6em; + max-width: none; +} +.oo-ui-checkboxInputWidget input[type="checkbox"] + span { + -webkit-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + -moz-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + position: absolute; + left: 0; + border-radius: 2px; + width: 1.6em; + height: 1.6em; + background-color: white; + border: 1px solid #777777; + background-image: url("themes/mediawiki/images/icons/check-constructive.png"); + background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-constructive.svg"); + background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-constructive.svg"); + background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/check-constructive.png"); + background-repeat: no-repeat; + background-position: center center; + background-origin: border-box; + background-size: 0 0; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:checked + span { + background-size: 100% 100%; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:active + span { + background-color: #cccccc; + border-color: #cccccc; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:focus + span { + border-width: 2px; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:focus:hover + span, +.oo-ui-checkboxInputWidget input[type="checkbox"]:hover + span { + border-bottom-width: 3px; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:disabled { + cursor: default; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:disabled + span { + background-color: #dddddd; + border-color: #dddddd; +} +.oo-ui-checkboxInputWidget input[type="checkbox"]:disabled:checked + span { + background-image: url("themes/mediawiki/images/icons/check-invert.png"); + background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-invert.svg"); + background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-invert.svg"); + background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/check-invert.png"); +} +.oo-ui-dropdownInputWidget { + position: relative; + vertical-align: middle; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + max-width: 50em; +} +.oo-ui-dropdownInputWidget select { + display: inline-block; + width: 100%; + resize: none; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.oo-ui-dropdownInputWidget select { + background-color: #ffffff; + height: 2.275em; + font-size: inherit; + font-family: inherit; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + border: 1px solid #cccccc; + border-radius: 2px; + padding-left: 1em; + vertical-align: middle; +} +.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover, +.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus { + border-color: #aaaaaa; + outline: none; +} +.oo-ui-dropdownInputWidget.oo-ui-widget-disabled select { + color: #cccccc; + border-color: #dddddd; + background-color: #f3f3f3; +} +.oo-ui-radioInputWidget { + position: relative; + line-height: 1.6em; + white-space: nowrap; +} +.oo-ui-radioInputWidget * { + font: inherit; + vertical-align: middle; +} +.oo-ui-radioInputWidget input[type="radio"] { + opacity: 0; + z-index: 1; + position: relative; + cursor: pointer; + margin: 0; + width: 1.6em; + height: 1.6em; + max-width: none; +} +.oo-ui-radioInputWidget input[type="radio"] + span { + -webkit-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + -moz-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + position: absolute; + left: 0; + border-radius: 100%; + width: 1.6em; + height: 1.6em; + background: white; + border: 1px solid #777777; + background-image: url("themes/mediawiki/images/icons/circle-constructive.png"); + background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-constructive.svg"); + background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-constructive.svg"); + background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/circle-constructive.png"); + background-repeat: no-repeat; + background-position: center center; + background-origin: border-box; + background-size: 0 0; +} +.oo-ui-radioInputWidget input[type="radio"]:checked + span { + background-size: 100% 100%; +} +.oo-ui-radioInputWidget input[type="radio"]:active + span { + background-color: #cccccc; + border-color: #cccccc; +} +.oo-ui-radioInputWidget input[type="radio"]:focus + span { + border-width: 2px; +} +.oo-ui-radioInputWidget input[type="radio"]:focus:hover + span, +.oo-ui-radioInputWidget input[type="radio"]:hover + span { + border-bottom-width: 3px; +} +.oo-ui-radioInputWidget input[type="radio"]:disabled { + cursor: default; +} +.oo-ui-radioInputWidget input[type="radio"]:disabled + span { + background-color: #dddddd; + border-color: #dddddd; +} +.oo-ui-radioInputWidget input[type="radio"]:disabled:checked + span { + background-image: url("themes/mediawiki/images/icons/circle-invert.png"); + background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-invert.svg"); + background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-invert.svg"); + background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/circle-invert.png"); +} +.oo-ui-radioSelectInputWidget .oo-ui-fieldLayout { + margin-bottom: 0; +} +.oo-ui-textInputWidget { + position: relative; + vertical-align: middle; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + max-width: 50em; +} +.oo-ui-textInputWidget input, +.oo-ui-textInputWidget textarea { + display: inline-block; + width: 100%; + resize: none; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.oo-ui-textInputWidget textarea { + overflow: auto; +} +.oo-ui-textInputWidget input[type="search"] { + -webkit-appearance: none; +} +.oo-ui-textInputWidget input[type="search"]::-ms-clear { + display: none; +} +.oo-ui-textInputWidget input[type="search"]::-ms-reveal { + display: none; +} +.oo-ui-textInputWidget input[type="search"]::-webkit-search-decoration, +.oo-ui-textInputWidget input[type="search"]::-webkit-search-cancel-button, +.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-button, +.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-decoration { + display: none; +} +.oo-ui-textInputWidget > .oo-ui-iconElement-icon, +.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator, +.oo-ui-textInputWidget > .oo-ui-labelElement-label { + display: none; +} +.oo-ui-textInputWidget.oo-ui-iconElement > .oo-ui-iconElement-icon, +.oo-ui-textInputWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { + display: block; + position: absolute; top: 0; - left: 0.3125em; - opacity: 0.7; + height: 100%; + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon, +.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { + cursor: text; +} +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator { + cursor: pointer; +} +.oo-ui-textInputWidget.oo-ui-labelElement > .oo-ui-labelElement-label { + display: block; +} +.oo-ui-textInputWidget > .oo-ui-iconElement-icon { + left: 0; +} +.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator { + right: 0; +} +.oo-ui-textInputWidget > .oo-ui-labelElement-label { + position: absolute; + top: 0; +} +.oo-ui-textInputWidget-labelPosition-after > .oo-ui-labelElement-label { + right: 0; +} +.oo-ui-textInputWidget-labelPosition-before > .oo-ui-labelElement-label { + left: 0; +} +.oo-ui-textInputWidget input, +.oo-ui-textInputWidget textarea { + padding: 0.5em; + line-height: 1.275em; + margin: 0; + font-size: inherit; + font-family: inherit; + background-color: #ffffff; + color: #000000; + border: 1px solid #cccccc; + border-radius: 2px; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.oo-ui-textInputWidget input.oo-ui-pendingElement-pending, +.oo-ui-textInputWidget textarea.oo-ui-pendingElement-pending { + background-color: transparent; +} +.oo-ui-textInputWidget.oo-ui-widget-enabled input, +.oo-ui-textInputWidget.oo-ui-widget-enabled textarea { + box-shadow: inset 0 0 0 0.1em #ffffff; + -webkit-transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); + -moz-transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); + transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); +} +.oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, +.oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus { + outline: none; + border-color: #347bff; + box-shadow: inset 0 0 0 0.1em #347bff; +} +.oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly], +.oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly] { + color: #777777; + text-shadow: 0 1px 1px #ffffff; } -.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { - left: 0; +.oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly]:focus, +.oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly]:focus { + border-color: #cccccc; + box-shadow: inset 0 0 0 0.1em #cccccc; } -.oo-ui-popupToolGroup-header { - line-height: 2.6em; - margin: 0 0.6em; - font-weight: bold; +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input, +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea { + border-color: #ff0000; } -.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-color: #eeeeee; +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input:focus, +.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea:focus { + border-color: #ff0000; + box-shadow: inset 0 0 0 0.1em #ff0000; } -.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { - top: 3.125em; - margin: 0 -1px; - border: 1px solid #cccccc; - background-color: #ffffff; - box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); - min-width: 16em; +.oo-ui-textInputWidget.oo-ui-widget-disabled input, +.oo-ui-textInputWidget.oo-ui-widget-disabled textarea { + color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-popupToolGroup .oo-ui-tool-link { - padding: 0.4em 0.625em; - box-sizing: border-box; +.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, +.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { - height: 2.5em; +.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-labelElement-label { + color: #dddddd; + text-shadow: 0 1px 1px #ffffff; +} +.oo-ui-textInputWidget.oo-ui-iconElement input, +.oo-ui-textInputWidget.oo-ui-iconElement textarea { + padding-left: 2.875em; +} +.oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon { + left: 0; width: 1.875em; - min-width: 1.875em; + max-height: 2.375em; + margin-left: 0.5em; + height: 100%; + background-position: right center; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { - padding-left: 0.5em; - color: #555555; +.oo-ui-textInputWidget.oo-ui-indicatorElement input, +.oo-ui-textInputWidget.oo-ui-indicatorElement textarea { + padding-right: 2.4875em; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { - line-height: 2em; +.oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + width: 0.9375em; + max-height: 2.375em; + margin: 0 0.775em; + height: 100%; } -.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { +.oo-ui-textInputWidget > .oo-ui-labelElement-label { + padding: 0.4em; + line-height: 1.5em; color: #888888; } -.oo-ui-listToolGroup .oo-ui-tool { +.oo-ui-textInputWidget-labelPosition-after.oo-ui-indicatorElement > .oo-ui-labelElement-label { + margin-right: 2.0875em; +} +.oo-ui-textInputWidget-labelPosition-before.oo-ui-iconElement > .oo-ui-labelElement-label { + margin-left: 2.475em; +} +.oo-ui-menuSelectWidget { + position: absolute; + background-color: #ffffff; + margin-top: -1px; + border: 1px solid #aaaaaa; + border-radius: 0 0 2px 2px; + box-shadow: 0 0.15em 0 0 rgba(0, 0, 0, 0.15); +} +.oo-ui-menuSelectWidget input { + position: absolute; + width: 0; + height: 0; + overflow: hidden; + opacity: 0; +} +.oo-ui-menuOptionWidget { + position: relative; + padding: 0.5em 1em; +} +.oo-ui-menuOptionWidget .oo-ui-iconElement-icon { + display: none; +} +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { + background-color: transparent; +} +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon { display: block; +} +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { + background-color: #d8e6fe; + color: rgba(0, 0, 0, 0.8); +} +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon { + display: none; +} +.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted { + background-color: #eeeeee; + color: #000000; +} +.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted { + background-color: #d8e6fe; +} +.oo-ui-menuSectionOptionWidget { + cursor: default; + padding: 0.33em 0.75em; + color: #888888; +} +.oo-ui-dropdownWidget { + display: inline-block; + position: relative; + width: 100%; + max-width: 50em; + background-color: #ffffff; + margin-right: 0.5em; +} +.oo-ui-dropdownWidget-handle { + width: 100%; + display: inline-block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + -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-listToolGroup .oo-ui-tool-link { +.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator, +.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { + position: absolute; +} +.oo-ui-dropdownWidget > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; +} +.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle { cursor: pointer; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { - cursor: default; +.oo-ui-dropdownWidget:last-child { + margin-right: 0; } -.oo-ui-listToolGroup.oo-ui-popupToolGroup-active { - border-color: rgba(0, 0, 0, 0.2); +.oo-ui-dropdownWidget-handle { + padding: 0.5em 0; + height: 2.275em; + line-height: 1.275; + border: 1px solid #cccccc; + border-radius: 2px; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.2); - background-color: #eeeeee; +.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { + right: 0; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:active { - background-color: #e7e7e7; +.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { + left: 0.25em; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.9; +.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { + line-height: 1.275em; + margin: 0 1em; } -.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-color: #e5e5e5; +.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { + top: 0; + width: 0.9375em; + height: 0.9375em; + margin: 0.775em; } -.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-dropdownWidget-handle .oo-ui-iconElement-icon { + top: 0; + width: 1.875em; + height: 1.875em; + margin: 0.3em; } -.oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover { - border-color: rgba(0, 0, 0, 0.2); - background-color: #eeeeee; +.oo-ui-dropdownWidget:hover .oo-ui-dropdownWidget-handle { + border-color: #aaaaaa; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { +.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle { color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-accel { - color: #dddddd; +.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle:focus { + outline: 0; } -.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { +.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { opacity: 0.2; } -.oo-ui-listToolGroup.oo-ui-widget-disabled { - color: #cccccc; +.oo-ui-dropdownWidget.oo-ui-iconElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { + margin-left: 3em; } -.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, -.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-dropdownWidget.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { + margin-right: 2em; } -.oo-ui-menuToolGroup .oo-ui-tool { - display: block; +.oo-ui-dropdownWidget .oo-ui-selectWidget { + border-top-color: #ffffff; } -.oo-ui-menuToolGroup .oo-ui-tool-link { +.oo-ui-comboBoxInputWidget { + display: inline-block; + position: relative; + width: 100%; + max-width: 50em; + margin-right: 0.5em; +} +.oo-ui-comboBoxInputWidget > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; +} +.oo-ui-comboBoxInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { cursor: pointer; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { - cursor: default; +.oo-ui-comboBoxInputWidget-php input::-webkit-calendar-picker-indicator { + opacity: 0 !important; + position: absolute; + right: 0; + top: 0; + height: 2.5em; + width: 2.5em; + padding: 0; +} +.oo-ui-comboBoxInputWidget-php > .oo-ui-indicatorElement-indicator { + pointer-events: none; +} +.oo-ui-comboBoxInputWidget:last-child { + margin-right: 0; +} +.oo-ui-comboBoxInputWidget input, +.oo-ui-comboBoxInputWidget textarea { + height: 2.35em; } -.oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { - min-width: 10em; + +/*! + * OOjs UI v0.15.2 + * https://www.mediawiki.org/wiki/OOjs_UI + * + * Copyright 2011–2016 OOjs UI Team and other contributors. + * Released under the MIT license + * http://oojs.mit-license.org + * + * Date: 2016-02-02T22:07:06Z + */ +@-webkit-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-toolbar-narrow .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { - min-width: 8.125em; +@-moz-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { - background-image: none; +@keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconElement-icon { - background-image: url("themes/mediawiki/images/icons/check.png"); - background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check.svg"); - background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check.svg"); - background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/check.png"); - background-size: contain; - background-position: center center; - background-repeat: no-repeat; +.oo-ui-draggableElement { + cursor: -webkit-grab -moz-grab, url(images/grab.cur), move; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { - background-color: #eeeeee; +.oo-ui-draggableElement-dragging { + cursor: -webkit-grabbing -moz-grabbing, url(images/grabbing.cur), move; + background: rgba(0, 0, 0, 0.2); + opacity: 0.4; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { - color: #cccccc; +.oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement.oo-ui-optionWidget { + display: inline-block; } -.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-draggableGroupElement-placeholder { + position: absolute; + display: block; + background: rgba(0, 0, 0, 0.4); } -.oo-ui-menuToolGroup.oo-ui-widget-disabled { - color: #cccccc; +.oo-ui-lookupElement > .oo-ui-menuSelectWidget { + z-index: 1; + width: 100%; } -.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, -.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { - opacity: 0.2; +.oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous > .oo-ui-panelLayout-scrollable { + overflow-y: hidden; } -.oo-ui-toolbar { - clear: both; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout { + width: 100%; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-toolbar-bar { - line-height: 1em; - position: relative; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout-scrollable { + overflow-y: auto; } -.oo-ui-toolbar-actions { - float: right; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout-padded { + padding: 2em; } -.oo-ui-toolbar-actions .oo-ui-toolbar { - display: inline-block; +.oo-ui-bookletLayout-outlinePanel-editable > .oo-ui-outlineSelectWidget { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 3em; + overflow-y: auto; } -.oo-ui-toolbar-tools { - display: inline; - white-space: nowrap; +.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { + position: absolute; + bottom: 0; + left: 0; + right: 0; } -.oo-ui-toolbar-narrow .oo-ui-toolbar-tools { - white-space: normal; +.oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout { + padding: 1.5em; } -.oo-ui-toolbar-tools .oo-ui-tool { - white-space: normal; +.oo-ui-bookletLayout-outlinePanel { + border-right: 1px solid #dddddd; } -.oo-ui-toolbar-tools, -.oo-ui-toolbar-actions, -.oo-ui-toolbar-shadow { - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; +.oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget { + box-shadow: 0 0.15em 0 0 rgba(0, 0, 0, 0.15); } -.oo-ui-toolbar-actions .oo-ui-popupWidget { - -webkit-touch-callout: default; - -webkit-user-select: all; - -moz-user-select: all; - -ms-user-select: all; - user-select: all; +.oo-ui-indexLayout > .oo-ui-menuLayout-menu { + height: 3em; } -.oo-ui-toolbar-shadow { - background-position: left top; - background-repeat: repeat-x; - position: absolute; - width: 100%; - pointer-events: none; +.oo-ui-indexLayout > .oo-ui-menuLayout-content { + top: 3em; } -.oo-ui-toolbar-bar { - border-bottom: 1px solid #cccccc; - background-color: #ffffff; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); - font-weight: 500; - color: #555555; +.oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout { + padding: 1.5em; } -.oo-ui-toolbar-bar .oo-ui-toolbar-bar { - border: 0; - background: none; - box-shadow: none; +.oo-ui-indexLayout > .oo-ui-menuLayout-menu { + height: 2.75em; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement { - margin: 0; +.oo-ui-indexLayout > .oo-ui-menuLayout-content { + top: 2.75em; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button { - border: 0; - border-radius: 0; - margin: 0; - padding: 0 0.3125em; +.oo-ui-menuLayout { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; } -.oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label { - margin: 0 1em; - line-height: 3.125em; +.oo-ui-menuLayout-menu, +.oo-ui-menuLayout-content { + position: absolute; + -webkit-transition: all 200ms ease; + -moz-transition: all 200ms ease; + transition: all 200ms ease; } -.oo-ui-optionWidget { - position: relative; - display: block; - padding: 0.25em 0.5em; - border: 0; +.oo-ui-menuLayout-menu { + height: 18em; + width: 18em; } -.oo-ui-optionWidget.oo-ui-widget-enabled { - cursor: pointer; +.oo-ui-menuLayout-content { + top: 18em; + left: 18em; + right: 18em; + bottom: 18em; } -.oo-ui-optionWidget.oo-ui-labelElement .oo-ui-labelElement-label { - display: block; - white-space: nowrap; - text-overflow: ellipsis; +.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu { + width: 0 !important; + height: 0 !important; overflow: hidden; } -.oo-ui-optionWidget-highlighted { - background-color: #eeeeee; +.oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content { + top: 0 !important; + left: 0 !important; + right: 0 !important; + bottom: 0 !important; } -.oo-ui-optionWidget .oo-ui-labelElement-label { - line-height: 1.5em; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu { + width: auto !important; + left: 0; + top: 0; + right: 0; } -.oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected, -.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed, -.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted, -.oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected { - background-color: #d0d0d0; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content { + right: 0 !important; + bottom: 0 !important; + left: 0 !important; } -.oo-ui-optionWidget.oo-ui-widget-disabled { - color: #cccccc; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu { + height: auto !important; + top: 0; + right: 0; + bottom: 0; } -.oo-ui-decoratedOptionWidget { - padding: 0.5em 2em 0.5em 3em; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content { + bottom: 0 !important; + left: 0 !important; + top: 0 !important; } -.oo-ui-decoratedOptionWidget .oo-ui-iconElement-icon, -.oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator { - position: absolute; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu { + width: auto !important; + right: 0; + bottom: 0; + left: 0; } -.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon, -.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - top: 0; - height: 100%; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content { + left: 0 !important; + top: 0 !important; + right: 0 !important; } -.oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon { - width: 1.875em; - left: 0.5em; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu { + height: auto !important; + bottom: 0; + left: 0; + top: 0; } -.oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - width: 0.9375em; - right: 0.5em; +.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content { + top: 0 !important; + right: 0 !important; + bottom: 0 !important; } -.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, -.oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { - opacity: 0.2; +.oo-ui-stackLayout-continuous > .oo-ui-panelLayout { + display: block; + position: relative; } .oo-ui-buttonSelectWidget { display: inline-block; @@ -1310,87 +1617,6 @@ .oo-ui-buttonOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { opacity: 1; } -.oo-ui-radioOptionWidget { - cursor: default; - padding: 0.25em 0; - background-color: transparent; -} -.oo-ui-radioOptionWidget .oo-ui-radioInputWidget, -.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { - display: inline-block; - vertical-align: middle; -} -.oo-ui-radioOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-radioOptionWidget.oo-ui-optionWidget-pressed, -.oo-ui-radioOptionWidget.oo-ui-optionWidget-highlighted { - background-color: transparent; -} -.oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label { - padding: 0.25em 0.25em 0.25em 1em; -} -.oo-ui-radioOptionWidget .oo-ui-radioInputWidget { - margin-right: 0; -} -.oo-ui-labelWidget { - display: inline-block; -} -.oo-ui-iconWidget { - display: inline-block; - vertical-align: middle; - line-height: 2.5em; - width: 1.875em; - height: 1.875em; -} -.oo-ui-iconWidget.oo-ui-widget-disabled { - opacity: 0.2; -} -.oo-ui-indicatorWidget { - display: inline-block; - vertical-align: middle; - line-height: 2.5em; - width: 0.9375em; - height: 0.9375em; - margin: 0.46875em; -} -.oo-ui-indicatorWidget.oo-ui-widget-disabled { - opacity: 0.2; -} -.oo-ui-buttonWidget { - display: inline-block; - vertical-align: middle; - margin-right: 0.5em; -} -.oo-ui-buttonWidget:last-child { - margin-right: 0; -} -.oo-ui-buttonGroupWidget { - display: inline-block; - white-space: nowrap; - border-radius: 2px; - margin-right: 0.5em; -} -.oo-ui-buttonGroupWidget:last-child { - margin-right: 0; -} -.oo-ui-buttonGroupWidget .oo-ui-buttonElement { - margin-right: 0; -} -.oo-ui-buttonGroupWidget .oo-ui-buttonElement:last-child { - margin-right: 0; -} -.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed .oo-ui-buttonElement-button { - border-radius: 0; - margin-left: -1px; -} -.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button { - border-bottom-left-radius: 2px; - border-top-left-radius: 2px; - margin-left: 0; -} -.oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button { - border-bottom-right-radius: 2px; - border-top-right-radius: 2px; -} .oo-ui-toggleButtonWidget { display: inline-block; vertical-align: middle; @@ -1550,1183 +1776,1057 @@ .oo-ui-progressBarWidget.oo-ui-widget-disabled { opacity: 0.6; } -.oo-ui-popupWidget { - position: absolute; - /* @noflip */ - left: 0; +.oo-ui-selectFileWidget { + display: inline-block; + vertical-align: middle; + width: 100%; + max-width: 50em; + margin-right: 0.5em; } -.oo-ui-popupWidget-popup { +.oo-ui-selectFileWidget-selectButton { + display: table-cell; + vertical-align: middle; +} +.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { position: relative; overflow: hidden; - z-index: 1; -} -.oo-ui-popupWidget-anchor { - display: none; - z-index: 1; } -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor { - display: block; +.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > input[type="file"] { position: absolute; + margin: 0; top: 0; - /* @noflip */ + bottom: 0; left: 0; - background-repeat: no-repeat; -} -.oo-ui-popupWidget-head { - -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; -} -.oo-ui-popupWidget-head > .oo-ui-labelElement-label { - float: left; - cursor: default; -} -.oo-ui-popupWidget-body { - clear: both; - overflow: hidden; -} -.oo-ui-popupWidget-popup { - background-color: #ffffff; - border: 1px solid #aaaaaa; - border-radius: 2px; - box-shadow: 0 0.15em 0 0 rgba(0, 0, 0, 0.15); -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-popup { - margin-top: 9px; -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before, -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { - content: ""; - position: absolute; - width: 0; - height: 0; - border-style: solid; - border-color: transparent; - border-top: 0; -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before { - bottom: -10px; - left: -9px; - border-bottom-color: #888888; - border-width: 10px; -} -.oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after { - bottom: -10px; - left: -8px; - border-bottom-color: #ffffff; - border-width: 9px; -} -.oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup { - -webkit-transition: width 100ms ease, height 100ms ease, left 100ms ease; - -moz-transition: width 100ms ease, height 100ms ease, left 100ms ease; - transition: width 100ms ease, height 100ms ease, left 100ms ease; -} -.oo-ui-popupWidget-head { - height: 2.5em; -} -.oo-ui-popupWidget-head > .oo-ui-buttonWidget { - margin: 0.25em; -} -.oo-ui-popupWidget-head > .oo-ui-labelElement-label { - margin: 0.75em 1em; -} -.oo-ui-popupWidget-body-padded { - padding: 0 1em; -} -.oo-ui-popupButtonWidget { - position: relative; -} -.oo-ui-popupButtonWidget .oo-ui-popupWidget { - position: absolute; - cursor: auto; -} -.oo-ui-popupButtonWidget.oo-ui-buttonElement-frameless > .oo-ui-popupWidget { - /* @noflip */ - left: 1em; -} -.oo-ui-popupButtonWidget.oo-ui-buttonElement-framed > .oo-ui-popupWidget { - /* @noflip */ - left: 1.75em; -} -.oo-ui-inputWidget { - margin-right: 0.5em; -} -.oo-ui-inputWidget:last-child { - margin-right: 0; -} -.oo-ui-buttonInputWidget { - display: inline-block; - vertical-align: middle; -} -.oo-ui-buttonInputWidget > button, -.oo-ui-buttonInputWidget > input { - border: 0; - padding: 0; - background-color: transparent; -} -.oo-ui-checkboxInputWidget { - position: relative; - line-height: 1.6em; - white-space: nowrap; -} -.oo-ui-checkboxInputWidget * { - font: inherit; - vertical-align: middle; -} -.oo-ui-checkboxInputWidget input[type="checkbox"] { + right: 0; + width: 100%; + height: 100%; opacity: 0; z-index: 1; - position: relative; cursor: pointer; - margin: 0; - width: 1.6em; - height: 1.6em; - max-width: none; + padding-top: 100px; } -.oo-ui-checkboxInputWidget input[type="checkbox"] + span { - -webkit-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); - -moz-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); - transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); +.oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > input[type="file"] { + display: none; +} +.oo-ui-selectFileWidget-info { + width: 100%; + display: table-cell; + vertical-align: middle; + position: relative; + overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; +} +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { position: absolute; + top: 0; + bottom: 0; left: 0; - border-radius: 2px; - width: 1.6em; - height: 1.6em; - background-color: white; - border: 1px solid #777777; - background-image: url("themes/mediawiki/images/icons/check-constructive.png"); - background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-constructive.svg"); - background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-constructive.svg"); - background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/check-constructive.png"); - background-repeat: no-repeat; - background-position: center center; - background-origin: border-box; - background-size: 0 0; + right: 0; + text-overflow: ellipsis; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:checked + span { - background-size: 100% 100%; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName { + float: left; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:active + span { - background-color: #cccccc; - border-color: #cccccc; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { + float: right; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:focus + span { - border-width: 2px; +.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator, +.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { + position: absolute; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:focus:hover + span, -.oo-ui-checkboxInputWidget input[type="checkbox"]:hover + span { - border-bottom-width: 3px; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { + z-index: 2; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:disabled { +.oo-ui-selectFileWidget-dropTarget { cursor: default; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:disabled + span { - background-color: #dddddd; - border-color: #dddddd; +.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget { + cursor: pointer; } -.oo-ui-checkboxInputWidget input[type="checkbox"]:disabled:checked + span { - background-image: url("themes/mediawiki/images/icons/check-invert.png"); - background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-invert.svg"); - background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check-invert.svg"); - background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/check-invert.png"); +.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton, +.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton { + display: none; } -.oo-ui-dropdownInputWidget { - position: relative; - vertical-align: middle; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - max-width: 50em; +.oo-ui-selectFileWidget:last-child { + margin-right: 0; } -.oo-ui-dropdownInputWidget select { - display: inline-block; - width: 100%; - resize: none; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { + margin-left: 0.5em; } -.oo-ui-dropdownInputWidget select { +.oo-ui-selectFileWidget-info { + height: 2.4em; background-color: #ffffff; - height: 2.275em; - font-size: inherit; - font-family: inherit; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; border: 1px solid #cccccc; border-radius: 2px; - padding-left: 1em; - vertical-align: middle; -} -.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover, -.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus { - border-color: #aaaaaa; - outline: none; -} -.oo-ui-dropdownInputWidget.oo-ui-widget-disabled select { - color: #cccccc; - border-color: #dddddd; - background-color: #f3f3f3; } -.oo-ui-radioInputWidget { - position: relative; - line-height: 1.6em; - white-space: nowrap; +.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { + right: 0; } -.oo-ui-radioInputWidget * { - font: inherit; - vertical-align: middle; +.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { + left: 0; } -.oo-ui-radioInputWidget input[type="radio"] { - opacity: 0; - z-index: 1; - position: relative; - cursor: pointer; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { + line-height: 2.3em; margin: 0; - width: 1.6em; - height: 1.6em; - max-width: none; -} -.oo-ui-radioInputWidget input[type="radio"] + span { - -webkit-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); - -moz-transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); - transition: background-size 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + overflow: hidden; + white-space: nowrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - position: absolute; - left: 0; - border-radius: 100%; - width: 1.6em; - height: 1.6em; - background: white; - border: 1px solid #777777; - background-image: url("themes/mediawiki/images/icons/circle-constructive.png"); - background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-constructive.svg"); - background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-constructive.svg"); - background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/circle-constructive.png"); - background-repeat: no-repeat; - background-position: center center; - background-origin: border-box; - background-size: 0 0; + text-overflow: ellipsis; + left: 0.5em; + right: 0.5em; } -.oo-ui-radioInputWidget input[type="radio"]:checked + span { - background-size: 100% 100%; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { + color: #888888; } -.oo-ui-radioInputWidget input[type="radio"]:active + span { - background-color: #cccccc; - border-color: #cccccc; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { + top: 0; + width: 1.875em; + margin-right: 0; } -.oo-ui-radioInputWidget input[type="radio"]:focus + span { - border-width: 2px; +.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { + height: 2.3em; } -.oo-ui-radioInputWidget input[type="radio"]:focus:hover + span, -.oo-ui-radioInputWidget input[type="radio"]:hover + span { - border-bottom-width: 3px; +.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { + top: 0; + width: 0.9375em; + height: 2.3em; + margin-right: 0.775em; } -.oo-ui-radioInputWidget input[type="radio"]:disabled { - cursor: default; +.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { + top: 0; + width: 1.875em; + height: 2.3em; + margin-left: 0.5em; } -.oo-ui-radioInputWidget input[type="radio"]:disabled + span { - background-color: #dddddd; +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info { + color: #cccccc; + text-shadow: 0 1px 1px #ffffff; border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-radioInputWidget input[type="radio"]:disabled:checked + span { - background-image: url("themes/mediawiki/images/icons/circle-invert.png"); - background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-invert.svg"); - background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/circle-invert.svg"); - background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/circle-invert.png"); +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { + opacity: 0.2; } -.oo-ui-radioSelectInputWidget .oo-ui-fieldLayout { - margin-bottom: 0; +.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label { + color: #cccccc; } -.oo-ui-textInputWidget { - position: relative; - vertical-align: middle; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - max-width: 50em; +.oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + left: 2.875em; } -.oo-ui-textInputWidget input, -.oo-ui-textInputWidget textarea { - display: inline-block; - width: 100%; - resize: none; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 2.375em; } -.oo-ui-textInputWidget textarea { - overflow: auto; +.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { + right: 0; } -.oo-ui-textInputWidget input[type="search"] { - -webkit-appearance: none; +.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 4.4625em; } -.oo-ui-textInputWidget input[type="search"]::-ms-clear { - display: none; +.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { + right: 2.0875em; } -.oo-ui-textInputWidget input[type="search"]::-ms-reveal { - display: none; +.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, +.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 0.5em; } -.oo-ui-textInputWidget input[type="search"]::-webkit-search-decoration, -.oo-ui-textInputWidget input[type="search"]::-webkit-search-cancel-button, -.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-button, -.oo-ui-textInputWidget input[type="search"]::-webkit-search-results-decoration { - display: none; +.oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, +.oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { + right: 2em; } -.oo-ui-textInputWidget > .oo-ui-iconElement-icon, -.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator, -.oo-ui-textInputWidget > .oo-ui-labelElement-label { - display: none; +.oo-ui-selectFileWidget-dropTarget { + line-height: 3.5em; + background-color: #ffffff; + border: 1px dashed #cccccc; + padding: 0.5em 1em; + margin-bottom: 0.5em; + text-align: center; + vertical-align: middle; +} +.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget:hover { + background-color: #eeeeee; +} +.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget { + background: rgba(52, 123, 255, 0.1); +} +.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget, +.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget { + color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; } -.oo-ui-textInputWidget.oo-ui-iconElement > .oo-ui-iconElement-icon, -.oo-ui-textInputWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { - display: block; - position: absolute; - top: 0; - height: 100%; +.oo-ui-outlineOptionWidget { + position: relative; + cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; + font-size: 1.1em; + padding: 0.75em; } -.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon, -.oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { - cursor: text; -} -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator { - cursor: pointer; -} -.oo-ui-textInputWidget.oo-ui-labelElement > .oo-ui-labelElement-label { - display: block; -} -.oo-ui-textInputWidget > .oo-ui-iconElement-icon { - left: 0; -} -.oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator { - right: 0; +.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { + padding-right: 1.5em; } -.oo-ui-textInputWidget > .oo-ui-labelElement-label { - position: absolute; - top: 0; +.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + opacity: 0.5; } -.oo-ui-textInputWidget-labelPosition-after > .oo-ui-labelElement-label { - right: 0; +.oo-ui-outlineOptionWidget-level-0 { + padding-left: 3.5em; } -.oo-ui-textInputWidget-labelPosition-before > .oo-ui-labelElement-label { - left: 0; +.oo-ui-outlineOptionWidget-level-0 .oo-ui-iconElement-icon { + left: 1em; } -.oo-ui-textInputWidget input, -.oo-ui-textInputWidget textarea { - padding: 0.5em; - line-height: 1.275em; - margin: 0; - font-size: inherit; - font-family: inherit; - background-color: #ffffff; - color: #000000; - border: 1px solid #cccccc; - border-radius: 2px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-outlineOptionWidget-level-1 { + padding-left: 5em; } -.oo-ui-textInputWidget input.oo-ui-pendingElement-pending, -.oo-ui-textInputWidget textarea.oo-ui-pendingElement-pending { - background-color: transparent; +.oo-ui-outlineOptionWidget-level-1 .oo-ui-iconElement-icon { + left: 2.5em; } -.oo-ui-textInputWidget.oo-ui-widget-enabled input, -.oo-ui-textInputWidget.oo-ui-widget-enabled textarea { - box-shadow: inset 0 0 0 0.1em #ffffff; - -webkit-transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); - -moz-transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); - transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); +.oo-ui-outlineOptionWidget-level-2 { + padding-left: 6.5em; } -.oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, -.oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus { - outline: none; - border-color: #347bff; - box-shadow: inset 0 0 0 0.1em #347bff; +.oo-ui-outlineOptionWidget-level-2 .oo-ui-iconElement-icon { + left: 4em; } -.oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly], -.oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly] { - color: #777777; +.oo-ui-selectWidget-depressed .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected { + background-color: #d0d0d0; text-shadow: 0 1px 1px #ffffff; } -.oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly]:focus, -.oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly]:focus { - border-color: #cccccc; - box-shadow: inset 0 0 0 0.1em #cccccc; -} -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input, -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea { - border-color: #ff0000; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-important { + font-weight: bold; } -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input:focus, -.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea:focus { - border-color: #ff0000; - box-shadow: inset 0 0 0 0.1em #ff0000; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-placeholder { + font-style: italic; } -.oo-ui-textInputWidget.oo-ui-widget-disabled input, -.oo-ui-textInputWidget.oo-ui-widget-disabled textarea { - color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-iconElement-icon { + opacity: 0.5; } -.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon, -.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { - opacity: 0.2; +.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-labelElement-label { + color: #777777; } -.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-labelElement-label { - color: #dddddd; - text-shadow: 0 1px 1px #ffffff; +.oo-ui-outlineControlsWidget { + height: 3em; + background-color: #ffffff; } -.oo-ui-textInputWidget.oo-ui-iconElement input, -.oo-ui-textInputWidget.oo-ui-iconElement textarea { - padding-left: 2.875em; +.oo-ui-outlineControlsWidget-items, +.oo-ui-outlineControlsWidget-movers { + float: left; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } -.oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon { - left: 0; - width: 1.875em; - max-height: 2.375em; - margin-left: 0.5em; - height: 100%; +.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { + float: left; background-position: right center; } -.oo-ui-textInputWidget.oo-ui-indicatorElement input, -.oo-ui-textInputWidget.oo-ui-indicatorElement textarea { - padding-right: 2.4875em; +.oo-ui-outlineControlsWidget-items { + float: left; } -.oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - width: 0.9375em; - max-height: 2.375em; - margin: 0 0.775em; - height: 100%; +.oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget { + float: left; } -.oo-ui-textInputWidget > .oo-ui-labelElement-label { - padding: 0.4em; - line-height: 1.5em; - color: #888888; +.oo-ui-outlineControlsWidget-movers { + float: right; } -.oo-ui-textInputWidget-labelPosition-after.oo-ui-indicatorElement > .oo-ui-labelElement-label { - margin-right: 2.0875em; +.oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget { + float: right; } -.oo-ui-textInputWidget-labelPosition-before.oo-ui-iconElement > .oo-ui-labelElement-label { - margin-left: 2.475em; +.oo-ui-outlineControlsWidget-items, +.oo-ui-outlineControlsWidget-movers { + height: 2em; + margin: 0.5em 0.5em 0.5em 0; + padding: 0; } -.oo-ui-menuSelectWidget { - position: absolute; - background-color: #ffffff; - margin-top: -1px; - border: 1px solid #aaaaaa; - border-radius: 0 0 2px 2px; - box-shadow: 0 0.15em 0 0 rgba(0, 0, 0, 0.15); +.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { + width: 1.5em; + height: 2em; + margin: 0.5em 0 0.5em 0.5em; + opacity: 0.2; } -.oo-ui-menuSelectWidget input { - position: absolute; - width: 0; - height: 0; +.oo-ui-tabSelectWidget { + text-align: left; + white-space: nowrap; overflow: hidden; - opacity: 0; -} -.oo-ui-menuOptionWidget { - position: relative; - padding: 0.5em 1em; -} -.oo-ui-menuOptionWidget .oo-ui-iconElement-icon { - display: none; + background-color: #dddddd; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { - background-color: transparent; +.oo-ui-tabOptionWidget { + display: inline-block; + vertical-align: bottom; + padding: 0.35em 1em; + margin: 0.5em 0 0 0.75em; + border: 1px solid transparent; + border-bottom: none; + border-top-left-radius: 2px; + border-top-right-radius: 2px; + color: #555555; + font-weight: bold; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon { - display: block; +.oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { + background-color: rgba(255, 255, 255, 0.3); } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected { - background-color: #d8e6fe; - color: rgba(0, 0, 0, 0.8); +.oo-ui-tabOptionWidget.oo-ui-widget-enabled:active { + background-color: rgba(255, 255, 255, 0.8); } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon { - display: none; +.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { + padding-right: 1.5em; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted { - background-color: #eeeeee; - color: #000000; +.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { + opacity: 0.5; } -.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted { - background-color: #d8e6fe; +.oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-selectWidget-depressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, +.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover { + background-color: #ffffff; + color: #333333; } -.oo-ui-menuSectionOptionWidget { - cursor: default; - padding: 0.33em 0.75em; - color: #888888; +.oo-ui-capsuleMultiSelectWidget { + display: inline-block; + position: relative; + width: 100%; + max-width: 50em; } -.oo-ui-dropdownWidget { +.oo-ui-capsuleMultiSelectWidget-handle { + width: 100%; display: inline-block; position: relative; +} +.oo-ui-capsuleMultiSelectWidget-content { + position: relative; +} +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-content > input { + display: none; +} +.oo-ui-capsuleMultiSelectWidget-group { + display: inline; +} +.oo-ui-capsuleMultiSelectWidget > .oo-ui-menuSelectWidget { + z-index: 1; width: 100%; - max-width: 50em; +} +.oo-ui-capsuleMultiSelectWidget-handle { background-color: #ffffff; + cursor: text; + min-height: 2.4em; margin-right: 0.5em; -} -.oo-ui-dropdownWidget-handle { - width: 100%; - display: inline-block; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; + padding: 0.15em 0.25em; + border: 1px solid #cccccc; + border-radius: 2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } -.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator, -.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { - position: absolute; -} -.oo-ui-dropdownWidget > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; -} -.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle { - cursor: pointer; -} -.oo-ui-dropdownWidget:last-child { +.oo-ui-capsuleMultiSelectWidget-handle:last-child { margin-right: 0; } -.oo-ui-dropdownWidget-handle { - padding: 0.5em 0; - height: 2.275em; - line-height: 1.275; - border: 1px solid #cccccc; - border-radius: 2px; +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator, +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { + position: absolute; + background-position: center center; + background-repeat: no-repeat; } -.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { - right: 0; +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input { + border: 0; + line-height: 1.675em; + margin: 0 0 0 0.2em; + padding: 0; + font-size: inherit; + font-family: inherit; + background-color: transparent; + color: #000000; + vertical-align: middle; } -.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { - left: 0.25em; +.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input:focus { + outline: none; } -.oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { - line-height: 1.275em; - margin: 0 1em; +.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle { + padding-right: 2.4875em; } -.oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator { +.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { + right: 0; top: 0; width: 0.9375em; height: 0.9375em; margin: 0.775em; } -.oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon { +.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle { + padding-left: 2.475em; +} +.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { + left: 0; top: 0; width: 1.875em; height: 1.875em; margin: 0.3em; } -.oo-ui-dropdownWidget:hover .oo-ui-dropdownWidget-handle { +.oo-ui-capsuleMultiSelectWidget:hover .oo-ui-capsuleMultiSelectWidget-handle { border-color: #aaaaaa; } -.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle { +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle { color: #cccccc; text-shadow: 0 1px 1px #ffffff; border-color: #dddddd; background-color: #f3f3f3; + cursor: default; } -.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle:focus { - outline: 0; -} -.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator { +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon, +.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { opacity: 0.2; } -.oo-ui-dropdownWidget.oo-ui-iconElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { - margin-left: 3em; -} -.oo-ui-dropdownWidget.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label { - margin-right: 2em; -} -.oo-ui-dropdownWidget .oo-ui-selectWidget { +.oo-ui-capsuleMultiSelectWidget .oo-ui-selectWidget { border-top-color: #ffffff; } -.oo-ui-selectFileWidget { +.oo-ui-capsuleItemWidget { + position: relative; display: inline-block; + cursor: default; + white-space: nowrap; + width: auto; + max-width: 100%; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; vertical-align: middle; + padding: 0 0.4em; + margin: 0.1em; + height: 1.7em; + line-height: 1.7em; + background-color: #eeeeee; + border: 1px solid #cccccc; + color: #555555; + border-radius: 2px; +} +.oo-ui-capsuleItemWidget > .oo-ui-iconElement-icon { + cursor: pointer; +} +.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon { + cursor: default; +} +.oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label { + display: block; + text-overflow: ellipsis; + overflow: hidden; +} +.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-labelElement-label { + padding-right: 1.3375em; +} +.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { + position: absolute; + right: 0.4em; + top: 0; + width: 0.9375em; + height: 100%; + background-repeat: no-repeat; +} +.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicator-clear { + cursor: pointer; +} +.oo-ui-capsuleItemWidget.oo-ui-widget-disabled { + color: #cccccc; + text-shadow: 0 1px 1px #ffffff; + border-color: #dddddd; + background-color: #f3f3f3; +} +.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-indicatorElement-indicator { + opacity: 0.2; +} +.oo-ui-searchWidget-query { + position: absolute; + top: 0; + left: 0; + right: 0; +} +.oo-ui-searchWidget-query .oo-ui-textInputWidget { width: 100%; +} +.oo-ui-searchWidget-results { + position: absolute; + bottom: 0; + left: 0; + right: 0; + overflow-x: hidden; + overflow-y: auto; +} +.oo-ui-searchWidget-query { + height: 4em; + padding: 0 1em; + border-bottom: 1px solid #cccccc; +} +.oo-ui-searchWidget-query .oo-ui-textInputWidget { + margin: 0.75em 0; +} +.oo-ui-searchWidget-results { + top: 4em; + padding: 1em; + line-height: 0; +} +.oo-ui-numberInputWidget { + display: inline-block; + position: relative; max-width: 50em; - margin-right: 0.5em; } -.oo-ui-selectFileWidget-selectButton { +.oo-ui-numberInputWidget-field { + display: table; + table-layout: fixed; + width: 100%; +} +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget, +.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { display: table-cell; vertical-align: middle; } -.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { - position: relative; - overflow: hidden; +.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { + width: 100%; +} +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { + white-space: nowrap; +} +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget > .oo-ui-buttonElement-button { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { + width: 2.5em; +} +.oo-ui-numberInputWidget-minusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border-right-width: 0; +} +.oo-ui-numberInputWidget-plusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + border-left-width: 0; +} +.oo-ui-numberInputWidget .oo-ui-textInputWidget input { + border-radius: 0; +} + +/*! + * OOjs UI v0.15.2 + * https://www.mediawiki.org/wiki/OOjs_UI + * + * Copyright 2011–2016 OOjs UI Team and other contributors. + * Released under the MIT license + * http://oojs.mit-license.org + * + * Date: 2016-02-02T22:07:06Z + */ +@-webkit-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +@-moz-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +@keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } +} +.oo-ui-popupTool .oo-ui-popupWidget-popup, +.oo-ui-popupTool .oo-ui-popupWidget-anchor { + z-index: 4; +} +.oo-ui-popupTool .oo-ui-popupWidget { + /* @noflip */ + margin-left: 1.25em; } -.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > input[type="file"] { - position: absolute; +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup { + border: 0; + border-radius: 0; margin: 0; - top: 0; - bottom: 0; - left: 0; - right: 0; - width: 100%; - height: 100%; - opacity: 0; - z-index: 1; - cursor: pointer; - padding-top: 100px; } -.oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > input[type="file"] { - display: none; +.oo-ui-toolGroupTool > .oo-ui-toolGroup { + border-right: none; } -.oo-ui-selectFileWidget-info { - width: 100%; - display: table-cell; - vertical-align: middle; - position: relative; - overflow: hidden; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle { + height: 2.5em; + padding: 0.3125em; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - text-overflow: ellipsis; +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + height: 2.5em; + width: 1.875em; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileName { - float: left; +.oo-ui-toolGroupTool > .oo-ui-popupToolGroup.oo-ui-labelElement > .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + line-height: 2.1em; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { - float: right; +.oo-ui-toolGroup { + display: inline-block; + vertical-align: middle; + border-radius: 0; + border-right: 1px solid #dddddd; } -.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator, -.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { - position: absolute; +.oo-ui-toolGroup-empty { + display: none; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { - z-index: 2; +.oo-ui-toolGroup .oo-ui-tool-link { + text-decoration: none; } -.oo-ui-selectFileWidget-dropTarget { - cursor: default; +.oo-ui-toolbar-narrow .oo-ui-toolGroup + .oo-ui-toolGroup { + margin-left: 0; } -.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget { - cursor: pointer; +.oo-ui-toolGroup .oo-ui-toolGroup .oo-ui-widget-enabled { + border-right: none !important; } -.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton, -.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton { +.oo-ui-barToolGroup > .oo-ui-iconElement-icon, +.oo-ui-barToolGroup > .oo-ui-labelElement-label { display: none; } -.oo-ui-selectFileWidget:last-child { - margin-right: 0; -} -.oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button { - margin-left: 0.5em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { + cursor: pointer; } -.oo-ui-selectFileWidget-info { - height: 2.4em; - background-color: #ffffff; - border: 1px solid #cccccc; - border-radius: 2px; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool { + display: inline-block; + position: relative; + vertical-align: top; } -.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { - right: 0; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { + display: block; } -.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { - left: 0; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-accel { + display: none; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label { - line-height: 2.3em; - margin: 0; - overflow: hidden; - white-space: nowrap; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - text-overflow: ellipsis; - left: 0.5em; - right: 0.5em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-iconElement-icon { + display: inline-block; + vertical-align: top; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-label > .oo-ui-selectFileWidget-fileType { - color: #888888; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-tool-title { + display: none; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton { - top: 0; - width: 1.875em; - margin-right: 0; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title { + display: inline; } -.oo-ui-selectFileWidget-info > .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon { - height: 2.3em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link { + outline: 0; + cursor: default; } -.oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { - top: 0; - width: 0.9375em; - height: 2.3em; - margin-right: 0.775em; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link { + height: 1.875em; + padding: 0.625em; } -.oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon { - top: 0; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-iconElement-icon { + height: 1.875em; width: 1.875em; - height: 2.3em; - margin-left: 0.5em; -} -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info { - color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; -} -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon, -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator { - opacity: 0.2; } -.oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label { - color: #cccccc; +.oo-ui-barToolGroup > .oo-ui-toolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title { + line-height: 2.1em; + padding: 0 0.4em; } -.oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - left: 2.875em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover { + border-color: rgba(0, 0, 0, 0.2); + background-color: #eeeeee; } -.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 2.375em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool > a.oo-ui-tool-link .oo-ui-tool-title { + color: #555555; } -.oo-ui-selectFileWidget .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { - right: 0; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.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-color: #e5e5e5; } -.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 4.4625em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-tool-active.oo-ui-widget-enabled:hover { + background-color: #eeeeee; } -.oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-clearButton { - right: 2.0875em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.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-selectFileWidget-empty .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, -.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 0.5em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title { + color: #cccccc; } -.oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label, -.oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-info .oo-ui-selectFileWidget-label { - right: 2em; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.2; } -.oo-ui-selectFileWidget-dropTarget { - line-height: 3.5em; - background-color: #ffffff; - border: 1px dashed #cccccc; - padding: 0.5em 1em; - margin-bottom: 0.5em; - text-align: center; - vertical-align: middle; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.7; } -.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropTarget:hover { - background-color: #eeeeee; +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:hover > .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.9; } -.oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileWidget-dropTarget { - background: rgba(52, 123, 255, 0.1); +.oo-ui-barToolGroup.oo-ui-widget-enabled > .oo-ui-toolGroup-tools > .oo-ui-tool.oo-ui-widget-enabled:active { + background-color: #e7e7e7; } -.oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-dropTarget, -.oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-dropTarget { +.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > a.oo-ui-tool-link .oo-ui-tool-title { color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; } -.oo-ui-outlineOptionWidget { +.oo-ui-barToolGroup.oo-ui-widget-disabled > .oo-ui-toolGroup-tools > .oo-ui-tool > a.oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.2; +} +.oo-ui-popupToolGroup { position: relative; + height: 3.125em; + min-width: 2em; +} +.oo-ui-popupToolGroup-handle { + display: block; cursor: pointer; - -webkit-touch-callout: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - font-size: 1.1em; - padding: 0.75em; } -.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { - padding-right: 1.5em; +.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator, +.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + position: absolute; } -.oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - opacity: 0.5; +.oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle { + outline: 0; + cursor: default; } -.oo-ui-outlineOptionWidget-level-0 { - padding-left: 3.5em; +.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { + display: none; + position: absolute; + z-index: 4; } -.oo-ui-outlineOptionWidget-level-0 .oo-ui-iconElement-icon { - left: 1em; +.oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools { + display: block; +} +.oo-ui-popupToolGroup-left > .oo-ui-toolGroup-tools { + left: 0; +} +.oo-ui-popupToolGroup-right > .oo-ui-toolGroup-tools { + right: 0; } -.oo-ui-outlineOptionWidget-level-1 { - padding-left: 5em; +.oo-ui-popupToolGroup .oo-ui-tool-link { + display: table; + width: 100%; + vertical-align: middle; + white-space: nowrap; } -.oo-ui-outlineOptionWidget-level-1 .oo-ui-iconElement-icon { - left: 2.5em; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon, +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { + display: table-cell; + vertical-align: middle; } -.oo-ui-outlineOptionWidget-level-2 { - padding-left: 6.5em; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { + text-align: right; } -.oo-ui-outlineOptionWidget-level-2 .oo-ui-iconElement-icon { - left: 4em; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel:not(:empty) { + padding-left: 3em; } -.oo-ui-selectWidget-depressed .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected { - background-color: #d0d0d0; - text-shadow: 0 1px 1px #ffffff; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup { + min-width: 1.875em; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-important { - font-weight: bold; +.oo-ui-popupToolGroup.oo-ui-iconElement { + min-width: 3.125em; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-placeholder { - font-style: italic; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement { + min-width: 2.5em; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-iconElement-icon { - opacity: 0.5; +.oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { + min-width: 4.375em; } -.oo-ui-outlineOptionWidget.oo-ui-flaggedElement-empty .oo-ui-labelElement-label { - color: #777777; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement { + min-width: 3.75em; } -.oo-ui-outlineControlsWidget { - height: 3em; - background-color: #ffffff; +.oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + line-height: 2.6em; + margin: 0 1em; } -.oo-ui-outlineControlsWidget-items, -.oo-ui-outlineControlsWidget-movers { - float: left; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin: 0 0.5em; } -.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { - float: left; - background-position: right center; +.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-left: 3em; } -.oo-ui-outlineControlsWidget-items { - float: left; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-left: 2.5em; } -.oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget { - float: left; +.oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-right: 2em; } -.oo-ui-outlineControlsWidget-movers { - float: right; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label { + margin-right: 1.75em; } -.oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget { - float: right; +.oo-ui-popupToolGroup.oo-ui-widget-enabled .oo-ui-popupToolGroup-handle:hover { + background-color: #eeeeee; } -.oo-ui-outlineControlsWidget-items, -.oo-ui-outlineControlsWidget-movers { - height: 2em; - margin: 0.5em 0.5em 0.5em 0; - padding: 0; +.oo-ui-popupToolGroup.oo-ui-widget-enabled .oo-ui-popupToolGroup-handle:active { + background-color: #e5e5e5; } -.oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon { - width: 1.5em; - height: 2em; - margin: 0.5em 0 0.5em 0.5em; - opacity: 0.2; +.oo-ui-popupToolGroup-handle { + padding: 0.3125em; + height: 2.5em; } -.oo-ui-tabSelectWidget { - text-align: left; - white-space: nowrap; - overflow: hidden; - background-color: #dddddd; +.oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { + width: 0.9375em; + height: 1.625em; + margin: 0.78125em 0.5em; + top: 0; + right: 0; + opacity: 0.3; } -.oo-ui-tabOptionWidget { - display: inline-block; - vertical-align: bottom; - padding: 0.35em 1em; - margin: 0.5em 0 0 0.75em; - border: 1px solid transparent; - border-bottom: none; - border-top-left-radius: 2px; - border-top-right-radius: 2px; - color: #555555; - font-weight: bold; +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator { + right: -0.3125em; } -.oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { - background-color: rgba(255, 255, 255, 0.3); +.oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + width: 1.875em; + height: 2.6em; + margin: 0.25em; + top: 0; + left: 0.3125em; + opacity: 0.7; } -.oo-ui-tabOptionWidget.oo-ui-widget-enabled:active { - background-color: rgba(255, 255, 255, 0.8); +.oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon { + left: 0; } -.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label { - padding-right: 1.5em; +.oo-ui-popupToolGroup-header { + line-height: 2.6em; + margin: 0 0.6em; + font-weight: bold; } -.oo-ui-tabOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { - opacity: 0.5; +.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-color: #eeeeee; } -.oo-ui-selectWidget-pressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-selectWidget-depressed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, -.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected:hover { +.oo-ui-popupToolGroup .oo-ui-toolGroup-tools { + top: 3.125em; + margin: 0 -1px; + border: 1px solid #cccccc; background-color: #ffffff; - color: #333333; -} -.oo-ui-capsuleMultiSelectWidget { - display: inline-block; - position: relative; - width: 100%; - max-width: 50em; + box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); + min-width: 16em; } -.oo-ui-capsuleMultiSelectWidget-handle { - width: 100%; - display: inline-block; - position: relative; +.oo-ui-popupToolGroup .oo-ui-tool-link { + padding: 0.4em 0.625em; + box-sizing: border-box; } -.oo-ui-capsuleMultiSelectWidget-content { - position: relative; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { + height: 2.5em; + width: 1.875em; + min-width: 1.875em; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-content > input { - display: none; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { + padding-left: 0.5em; + color: #555555; } -.oo-ui-capsuleMultiSelectWidget-group { - display: inline; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel, +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title { + line-height: 2em; } -.oo-ui-capsuleMultiSelectWidget > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; +.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-accel { + color: #888888; } -.oo-ui-capsuleMultiSelectWidget-handle { - background-color: #ffffff; - cursor: text; - min-height: 2.4em; - margin-right: 0.5em; - padding: 0.15em 0.25em; - border: 1px solid #cccccc; - border-radius: 2px; +.oo-ui-listToolGroup .oo-ui-tool { + display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } -.oo-ui-capsuleMultiSelectWidget-handle:last-child { - margin-right: 0; +.oo-ui-listToolGroup .oo-ui-tool-link { + cursor: pointer; } -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator, -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { - position: absolute; - background-position: center center; - background-repeat: no-repeat; +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { + cursor: default; } -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input { - border: 0; - line-height: 1.675em; - margin: 0 0 0 0.2em; - padding: 0; - font-size: inherit; - font-family: inherit; - background-color: transparent; - color: #000000; - vertical-align: middle; +.oo-ui-listToolGroup.oo-ui-popupToolGroup-active { + border-color: rgba(0, 0, 0, 0.2); } -.oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-capsuleMultiSelectWidget-content > input:focus { - outline: none; +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { + border-color: rgba(0, 0, 0, 0.2); + background-color: #eeeeee; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle { - padding-right: 2.4875em; +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:active { + background-color: #e7e7e7; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { - right: 0; - top: 0; - width: 0.9375em; - height: 0.9375em; - margin: 0.775em; +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconElement-icon { + opacity: 0.9; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle { - padding-left: 2.475em; +.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-color: #e5e5e5; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-iconElement .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon { - left: 0; - top: 0; - width: 1.875em; - height: 1.875em; - margin: 0.3em; +.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-capsuleMultiSelectWidget:hover .oo-ui-capsuleMultiSelectWidget-handle { - border-color: #aaaaaa; +.oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover { + border-color: rgba(0, 0, 0, 0.2); + background-color: #eeeeee; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle { +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; - cursor: default; } -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-iconElement-icon, -.oo-ui-capsuleMultiSelectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiSelectWidget-handle > .oo-ui-indicatorElement-indicator { +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-accel { + color: #dddddd; +} +.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { opacity: 0.2; } -.oo-ui-capsuleMultiSelectWidget .oo-ui-selectWidget { - border-top-color: #ffffff; +.oo-ui-listToolGroup.oo-ui-widget-disabled { + color: #cccccc; } -.oo-ui-capsuleItemWidget { - position: relative; - display: inline-block; - cursor: default; - white-space: nowrap; - width: auto; - max-width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - vertical-align: middle; - padding: 0 0.4em; - margin: 0.1em; - height: 1.7em; - line-height: 1.7em; - background-color: #eeeeee; - border: 1px solid #cccccc; - color: #555555; - border-radius: 2px; +.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, +.oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { + opacity: 0.2; } -.oo-ui-capsuleItemWidget > .oo-ui-iconElement-icon { +.oo-ui-menuToolGroup .oo-ui-tool { + display: block; +} +.oo-ui-menuToolGroup .oo-ui-tool-link { cursor: pointer; } -.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon { +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link { cursor: default; } -.oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label { - display: block; - text-overflow: ellipsis; - overflow: hidden; +.oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { + min-width: 10em; } -.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-labelElement-label { - padding-right: 1.3375em; +.oo-ui-toolbar-narrow .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle { + min-width: 8.125em; } -.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator { - position: absolute; - right: 0.4em; - top: 0; - width: 0.9375em; - height: 100%; +.oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon { + background-image: none; +} +.oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconElement-icon { + background-image: url("themes/mediawiki/images/icons/check.png"); + background-image: -webkit-linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check.svg"); + background-image: linear-gradient(transparent, transparent), /* @embed */ url("themes/mediawiki/images/icons/check.svg"); + background-image: -o-linear-gradient(transparent, transparent), url("themes/mediawiki/images/icons/check.png"); + background-size: contain; + background-position: center center; background-repeat: no-repeat; } -.oo-ui-capsuleItemWidget.oo-ui-indicatorElement > .oo-ui-indicator-clear { - cursor: pointer; +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover { + background-color: #eeeeee; } -.oo-ui-capsuleItemWidget.oo-ui-widget-disabled { +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title { color: #cccccc; - text-shadow: 0 1px 1px #ffffff; - border-color: #dddddd; - background-color: #f3f3f3; } -.oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-indicatorElement-indicator { +.oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon { opacity: 0.2; } -.oo-ui-comboBoxInputWidget { - display: inline-block; - position: relative; - width: 100%; - max-width: 50em; - margin-right: 0.5em; -} -.oo-ui-comboBoxInputWidget > .oo-ui-menuSelectWidget { - z-index: 1; - width: 100%; -} -.oo-ui-comboBoxInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator { - cursor: pointer; -} -.oo-ui-comboBoxInputWidget-php input::-webkit-calendar-picker-indicator { - opacity: 0 !important; - position: absolute; - right: 0; - top: 0; - height: 2.5em; - width: 2.5em; - padding: 0; +.oo-ui-menuToolGroup.oo-ui-widget-disabled { + color: #cccccc; } -.oo-ui-comboBoxInputWidget-php > .oo-ui-indicatorElement-indicator { - pointer-events: none; +.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator, +.oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon { + opacity: 0.2; } -.oo-ui-comboBoxInputWidget:last-child { - margin-right: 0; +.oo-ui-toolbar { + clear: both; } -.oo-ui-comboBoxInputWidget input, -.oo-ui-comboBoxInputWidget textarea { - height: 2.35em; +.oo-ui-toolbar-bar { + line-height: 1em; + position: relative; } -.oo-ui-searchWidget-query { - position: absolute; - top: 0; - left: 0; - right: 0; +.oo-ui-toolbar-actions { + float: right; } -.oo-ui-searchWidget-query .oo-ui-textInputWidget { - width: 100%; +.oo-ui-toolbar-actions .oo-ui-toolbar { + display: inline-block; } -.oo-ui-searchWidget-results { - position: absolute; - bottom: 0; - left: 0; - right: 0; - overflow-x: hidden; - overflow-y: auto; +.oo-ui-toolbar-tools { + display: inline; + white-space: nowrap; } -.oo-ui-searchWidget-query { - height: 4em; - padding: 0 1em; - border-bottom: 1px solid #cccccc; +.oo-ui-toolbar-narrow .oo-ui-toolbar-tools { + white-space: normal; } -.oo-ui-searchWidget-query .oo-ui-textInputWidget { - margin: 0.75em 0; +.oo-ui-toolbar-tools .oo-ui-tool { + white-space: normal; } -.oo-ui-searchWidget-results { - top: 4em; - padding: 1em; - line-height: 0; +.oo-ui-toolbar-tools, +.oo-ui-toolbar-actions, +.oo-ui-toolbar-shadow { + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } -.oo-ui-numberInputWidget { - display: inline-block; - position: relative; - max-width: 50em; +.oo-ui-toolbar-actions .oo-ui-popupWidget { + -webkit-touch-callout: default; + -webkit-user-select: all; + -moz-user-select: all; + -ms-user-select: all; + user-select: all; } -.oo-ui-numberInputWidget-field { - display: table; - table-layout: fixed; +.oo-ui-toolbar-shadow { + background-position: left top; + background-repeat: repeat-x; + position: absolute; width: 100%; + pointer-events: none; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget, -.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { - display: table-cell; - vertical-align: middle; +.oo-ui-toolbar-bar { + border-bottom: 1px solid #cccccc; + background-color: #ffffff; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); + font-weight: 500; + color: #555555; } -.oo-ui-numberInputWidget-field > .oo-ui-textInputWidget { - width: 100%; +.oo-ui-toolbar-bar .oo-ui-toolbar-bar { + border: 0; + background: none; + box-shadow: none; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { - white-space: nowrap; +.oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement { + margin: 0; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget > .oo-ui-buttonElement-button { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; +.oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button { + border: 0; + border-radius: 0; + margin: 0; + padding: 0 0.3125em; } -.oo-ui-numberInputWidget-field > .oo-ui-buttonWidget { - width: 2.5em; +.oo-ui-toolbar-actions > .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label { + margin: 0 1em; + line-height: 3.125em; } -.oo-ui-numberInputWidget-minusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-right-width: 0; + +/*! + * OOjs UI v0.15.2 + * https://www.mediawiki.org/wiki/OOjs_UI + * + * Copyright 2011–2016 OOjs UI Team and other contributors. + * Released under the MIT license + * http://oojs.mit-license.org + * + * Date: 2016-02-02T22:07:06Z + */ +@-webkit-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-numberInputWidget-plusButton.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-width: 0; +@-moz-keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } -.oo-ui-numberInputWidget .oo-ui-textInputWidget input { - border-radius: 0; +@keyframes oo-ui-progressBarWidget-slide { + from { + margin-left: -40%; + } + to { + margin-left: 100%; + } } .oo-ui-window { background: transparent; diff --git a/resources/lib/oojs-ui/oojs-ui-mediawiki.js b/resources/lib/oojs-ui/oojs-ui-mediawiki.js index ea70fbb7a6..e20b956fae 100644 --- a/resources/lib/oojs-ui/oojs-ui-mediawiki.js +++ b/resources/lib/oojs-ui/oojs-ui-mediawiki.js @@ -1,13 +1,17 @@ /*! - * OOjs UI v0.15.1 + * OOjs UI v0.15.2 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2016 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2016-01-26T21:14:23Z + * Date: 2016-02-02T22:07:00Z */ +( function ( OO ) { + +'use strict'; + /** * @class * @extends OO.ui.Theme @@ -67,3 +71,5 @@ OO.ui.MediaWikiTheme.prototype.getElementClasses = function ( element ) { /* Instantiation */ OO.ui.theme = new OO.ui.MediaWikiTheme(); + +}( OO ) ); diff --git a/resources/lib/oojs-ui/oojs-ui.js b/resources/lib/oojs-ui/oojs-ui.js index 98d4709e3d..9bcdf7e783 100644 --- a/resources/lib/oojs-ui/oojs-ui.js +++ b/resources/lib/oojs-ui/oojs-ui.js @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.15.1 + * OOjs UI v0.15.2 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2016 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2016-01-26T21:14:23Z + * Date: 2016-02-02T22:07:00Z */ ( function ( OO ) { @@ -444,90 +444,6 @@ OO.ui.isSafeUrl = function ( url ) { return false; }; -/** - * Lazy-initialize and return a global OO.ui.WindowManager instance, used by OO.ui.alert and - * OO.ui.confirm. - * - * @private - * @return {OO.ui.WindowManager} - */ -OO.ui.getWindowManager = function () { - if ( !OO.ui.windowManager ) { - OO.ui.windowManager = new OO.ui.WindowManager(); - $( 'body' ).append( OO.ui.windowManager.$element ); - OO.ui.windowManager.addWindows( { - messageDialog: new OO.ui.MessageDialog() - } ); - } - return OO.ui.windowManager; -}; - -/** - * Display a quick modal alert dialog, using a OO.ui.MessageDialog. While the dialog is open, the - * rest of the page will be dimmed out and the user won't be able to interact with it. The dialog - * has only one action button, labelled "OK", clicking it will simply close the dialog. - * - * A window manager is created automatically when this function is called for the first time. - * - * @example - * OO.ui.alert( 'Something happened!' ).done( function () { - * console.log( 'User closed the dialog.' ); - * } ); - * - * @param {jQuery|string} text Message text to display - * @param {Object} [options] Additional options, see OO.ui.MessageDialog#getSetupProcess - * @return {jQuery.Promise} Promise resolved when the user closes the dialog - */ -OO.ui.alert = function ( text, options ) { - return OO.ui.getWindowManager().openWindow( 'messageDialog', $.extend( { - message: text, - verbose: true, - actions: [ OO.ui.MessageDialog.static.actions[ 0 ] ] - }, options ) ).then( function ( opened ) { - return opened.then( function ( closing ) { - return closing.then( function () { - return $.Deferred().resolve(); - } ); - } ); - } ); -}; - -/** - * Display a quick modal confirmation dialog, using a OO.ui.MessageDialog. While the dialog is open, - * the rest of the page will be dimmed out and the user won't be able to interact with it. The - * dialog has two action buttons, one to confirm an operation (labelled "OK") and one to cancel it - * (labelled "Cancel"). - * - * A window manager is created automatically when this function is called for the first time. - * - * @example - * OO.ui.confirm( 'Are you sure?' ).done( function ( confirmed ) { - * if ( confirmed ) { - * console.log( 'User clicked "OK"!' ); - * } else { - * console.log( 'User clicked "Cancel" or closed the dialog.' ); - * } - * } ); - * - * @param {jQuery|string} text Message text to display - * @param {Object} [options] Additional options, see OO.ui.MessageDialog#getSetupProcess - * @return {jQuery.Promise} Promise resolved when the user closes the dialog. If the user chose to - * confirm, the promise will resolve to boolean `true`; otherwise, it will resolve to boolean - * `false`. - */ -OO.ui.confirm = function ( text, options ) { - return OO.ui.getWindowManager().openWindow( 'messageDialog', $.extend( { - message: text, - verbose: true - }, options ) ).then( function ( opened ) { - return opened.then( function ( closing ) { - return closing.then( function ( data ) { - return $.Deferred().resolve( !!( data && data.action === 'accept' ) ); - } ); - } ); - } ); -}; - /*! * Mixin namespace. */ @@ -546,17889 +462,18079 @@ OO.ui.confirm = function ( text, options ) { OO.ui.mixin = {}; /** - * PendingElement is a mixin that is used to create elements that notify users that something is happening - * and that they should wait before proceeding. The pending state is visually represented with a pending - * texture that appears in the head of a pending {@link OO.ui.ProcessDialog process dialog} or in the input - * field of a {@link OO.ui.TextInputWidget text input widget}. - * - * Currently, {@link OO.ui.ActionWidget Action widgets}, which mix in this class, can also be marked as pending, but only when - * used in {@link OO.ui.MessageDialog message dialogs}. The behavior is not currently supported for action widgets used - * in process dialogs. - * - * @example - * function MessageDialog( config ) { - * MessageDialog.parent.call( this, config ); - * } - * OO.inheritClass( MessageDialog, OO.ui.MessageDialog ); - * - * MessageDialog.static.actions = [ - * { action: 'save', label: 'Done', flags: 'primary' }, - * { label: 'Cancel', flags: 'safe' } - * ]; - * - * MessageDialog.prototype.initialize = function () { - * MessageDialog.parent.prototype.initialize.apply( this, arguments ); - * this.content = new OO.ui.PanelLayout( { $: this.$, padded: true } ); - * this.content.$element.append( '

Click the \'Done\' action widget to see its pending state. Note that action widgets can be marked pending in message dialogs but not process dialogs.

' ); - * this.$body.append( this.content.$element ); - * }; - * MessageDialog.prototype.getBodyHeight = function () { - * return 100; - * } - * MessageDialog.prototype.getActionProcess = function ( action ) { - * var dialog = this; - * if ( action === 'save' ) { - * dialog.getActions().get({actions: 'save'})[0].pushPending(); - * return new OO.ui.Process() - * .next( 1000 ) - * .next( function () { - * dialog.getActions().get({actions: 'save'})[0].popPending(); - * } ); - * } - * return MessageDialog.parent.prototype.getActionProcess.call( this, action ); - * }; - * - * var windowManager = new OO.ui.WindowManager(); - * $( 'body' ).append( windowManager.$element ); - * - * var dialog = new MessageDialog(); - * windowManager.addWindows( [ dialog ] ); - * windowManager.openWindow( dialog ); + * Each Element represents a rendering in the DOM—a button or an icon, for example, or anything + * that is visible to a user. Unlike {@link OO.ui.Widget widgets}, plain elements usually do not have events + * connected to them and can't be interacted with. * * @abstract * @class * * @constructor * @param {Object} [config] Configuration options - * @cfg {jQuery} [$pending] Element to mark as pending, defaults to this.$element + * @cfg {string[]} [classes] The names of the CSS classes to apply to the element. CSS styles are added + * to the top level (e.g., the outermost div) of the element. See the [OOjs UI documentation on MediaWiki][2] + * for an example. + * [2]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Buttons_and_Switches#cssExample + * @cfg {string} [id] The HTML id attribute used in the rendered tag. + * @cfg {string} [text] Text to insert + * @cfg {Array} [content] An array of content elements to append (after #text). + * Strings will be html-escaped; use an OO.ui.HtmlSnippet to append raw HTML. + * Instances of OO.ui.Element will have their $element appended. + * @cfg {jQuery} [$content] Content elements to append (after #text). + * @cfg {jQuery} [$element] Wrapper element. Defaults to a new element with #getTagName. + * @cfg {Mixed} [data] Custom data of any type or combination of types (e.g., string, number, array, object). + * Data can also be specified with the #setData method. */ -OO.ui.mixin.PendingElement = function OoUiMixinPendingElement( config ) { +OO.ui.Element = function OoUiElement( config ) { // Configuration initialization config = config || {}; // Properties - this.pending = 0; - this.$pending = null; + this.$ = $; + this.visible = true; + this.data = config.data; + this.$element = config.$element || + $( document.createElement( this.getTagName() ) ); + this.elementGroup = null; + this.debouncedUpdateThemeClassesHandler = OO.ui.debounce( this.debouncedUpdateThemeClasses ); - // Initialisation - this.setPendingElement( config.$pending || this.$element ); + // Initialization + if ( Array.isArray( config.classes ) ) { + this.$element.addClass( config.classes.join( ' ' ) ); + } + if ( config.id ) { + this.$element.attr( 'id', config.id ); + } + if ( config.text ) { + this.$element.text( config.text ); + } + if ( config.content ) { + // The `content` property treats plain strings as text; use an + // HtmlSnippet to append HTML content. `OO.ui.Element`s get their + // appropriate $element appended. + this.$element.append( config.content.map( function ( v ) { + if ( typeof v === 'string' ) { + // Escape string so it is properly represented in HTML. + return document.createTextNode( v ); + } else if ( v instanceof OO.ui.HtmlSnippet ) { + // Bypass escaping. + return v.toString(); + } else if ( v instanceof OO.ui.Element ) { + return v.$element; + } + return v; + } ) ); + } + if ( config.$content ) { + // The `$content` property treats plain strings as HTML. + this.$element.append( config.$content ); + } }; /* Setup */ -OO.initClass( OO.ui.mixin.PendingElement ); +OO.initClass( OO.ui.Element ); -/* Methods */ +/* Static Properties */ /** - * Set the pending element (and clean up any existing one). + * The name of the HTML tag used by the element. * - * @param {jQuery} $pending The element to set to pending. - */ -OO.ui.mixin.PendingElement.prototype.setPendingElement = function ( $pending ) { - if ( this.$pending ) { - this.$pending.removeClass( 'oo-ui-pendingElement-pending' ); - } - - this.$pending = $pending; - if ( this.pending > 0 ) { - this.$pending.addClass( 'oo-ui-pendingElement-pending' ); - } -}; - -/** - * Check if an element is pending. + * The static value may be ignored if the #getTagName method is overridden. * - * @return {boolean} Element is pending + * @static + * @inheritable + * @property {string} */ -OO.ui.mixin.PendingElement.prototype.isPending = function () { - return !!this.pending; -}; +OO.ui.Element.static.tagName = 'div'; + +/* Static Methods */ /** - * Increase the pending counter. The pending state will remain active until the counter is zero - * (i.e., the number of calls to #pushPending and #popPending is the same). + * Reconstitute a JavaScript object corresponding to a widget created + * by the PHP implementation. * - * @chainable + * @param {string|HTMLElement|jQuery} idOrNode + * A DOM id (if a string) or node for the widget to infuse. + * @return {OO.ui.Element} + * The `OO.ui.Element` corresponding to this (infusable) document node. + * For `Tag` objects emitted on the HTML side (used occasionally for content) + * the value returned is a newly-created Element wrapping around the existing + * DOM node. */ -OO.ui.mixin.PendingElement.prototype.pushPending = function () { - if ( this.pending === 0 ) { - this.$pending.addClass( 'oo-ui-pendingElement-pending' ); - this.updateThemeClasses(); +OO.ui.Element.static.infuse = function ( idOrNode ) { + var obj = OO.ui.Element.static.unsafeInfuse( idOrNode, false ); + // Verify that the type matches up. + // FIXME: uncomment after T89721 is fixed (see T90929) + /* + if ( !( obj instanceof this['class'] ) ) { + throw new Error( 'Infusion type mismatch!' ); } - this.pending++; - - return this; + */ + return obj; }; /** - * Decrease the pending counter. The pending state will remain active until the counter is zero - * (i.e., the number of calls to #pushPending and #popPending is the same). - * - * @chainable + * Implementation helper for `infuse`; skips the type check and has an + * extra property so that only the top-level invocation touches the DOM. + * @private + * @param {string|HTMLElement|jQuery} idOrNode + * @param {jQuery.Promise|boolean} domPromise A promise that will be resolved + * when the top-level widget of this infusion is inserted into DOM, + * replacing the original node; or false for top-level invocation. + * @return {OO.ui.Element} */ -OO.ui.mixin.PendingElement.prototype.popPending = function () { - if ( this.pending === 1 ) { - this.$pending.removeClass( 'oo-ui-pendingElement-pending' ); - this.updateThemeClasses(); +OO.ui.Element.static.unsafeInfuse = function ( idOrNode, domPromise ) { + // look for a cached result of a previous infusion. + var id, $elem, data, cls, parts, parent, obj, top, state; + if ( typeof idOrNode === 'string' ) { + id = idOrNode; + $elem = $( document.getElementById( id ) ); + } else { + $elem = $( idOrNode ); + id = $elem.attr( 'id' ); + } + if ( !$elem.length ) { + throw new Error( 'Widget not found: ' + id ); + } + data = $elem.data( 'ooui-infused' ) || $elem[ 0 ].oouiInfused; + if ( data ) { + // cached! + if ( data === true ) { + throw new Error( 'Circular dependency! ' + id ); + } + return data; + } + data = $elem.attr( 'data-ooui' ); + if ( !data ) { + throw new Error( 'No infusion data found: ' + id ); + } + try { + data = $.parseJSON( data ); + } catch ( _ ) { + data = null; + } + if ( !( data && data._ ) ) { + throw new Error( 'No valid infusion data found: ' + id ); + } + if ( data._ === 'Tag' ) { + // Special case: this is a raw Tag; wrap existing node, don't rebuild. + return new OO.ui.Element( { $element: $elem } ); + } + parts = data._.split( '.' ); + cls = OO.getProp.apply( OO, [ window ].concat( parts ) ); + if ( cls === undefined ) { + // The PHP output might be old and not including the "OO.ui" prefix + // TODO: Remove this back-compat after next major release + cls = OO.getProp.apply( OO, [ OO.ui ].concat( parts ) ); + if ( cls === undefined ) { + throw new Error( 'Unknown widget type: id: ' + id + ', class: ' + data._ ); + } } - this.pending = Math.max( 0, this.pending - 1 ); - - return this; -}; - -/** - * ActionSets manage the behavior of the {@link OO.ui.ActionWidget action widgets} that comprise them. - * Actions can be made available for specific contexts (modes) and circumstances - * (abilities). Action sets are primarily used with {@link OO.ui.Dialog Dialogs}. - * - * ActionSets contain two types of actions: - * - * - Special: Special actions are the first visible actions with special flags, such as 'safe' and 'primary', the default special flags. Additional special flags can be configured in subclasses with the static #specialFlags property. - * - Other: Other actions include all non-special visible actions. - * - * Please see the [OOjs UI documentation on MediaWiki][1] for more information. - * - * @example - * // Example: An action set used in a process dialog - * function MyProcessDialog( config ) { - * MyProcessDialog.parent.call( this, config ); - * } - * OO.inheritClass( MyProcessDialog, OO.ui.ProcessDialog ); - * MyProcessDialog.static.title = 'An action set in a process dialog'; - * // An action set that uses modes ('edit' and 'help' mode, in this example). - * MyProcessDialog.static.actions = [ - * { action: 'continue', modes: 'edit', label: 'Continue', flags: [ 'primary', 'constructive' ] }, - * { action: 'help', modes: 'edit', label: 'Help' }, - * { modes: 'edit', label: 'Cancel', flags: 'safe' }, - * { action: 'back', modes: 'help', label: 'Back', flags: 'safe' } - * ]; - * - * MyProcessDialog.prototype.initialize = function () { - * MyProcessDialog.parent.prototype.initialize.apply( this, arguments ); - * this.panel1 = new OO.ui.PanelLayout( { padded: true, expanded: false } ); - * this.panel1.$element.append( '

This dialog uses an action set (continue, help, cancel, back) configured with modes. This is edit mode. Click \'help\' to see help mode.

' ); - * this.panel2 = new OO.ui.PanelLayout( { padded: true, expanded: false } ); - * this.panel2.$element.append( '

This is help mode. Only the \'back\' action widget is configured to be visible here. Click \'back\' to return to \'edit\' mode.

' ); - * this.stackLayout = new OO.ui.StackLayout( { - * items: [ this.panel1, this.panel2 ] - * } ); - * this.$body.append( this.stackLayout.$element ); - * }; - * MyProcessDialog.prototype.getSetupProcess = function ( data ) { - * return MyProcessDialog.parent.prototype.getSetupProcess.call( this, data ) - * .next( function () { - * this.actions.setMode( 'edit' ); - * }, this ); - * }; - * MyProcessDialog.prototype.getActionProcess = function ( action ) { - * if ( action === 'help' ) { - * this.actions.setMode( 'help' ); - * this.stackLayout.setItem( this.panel2 ); - * } else if ( action === 'back' ) { - * this.actions.setMode( 'edit' ); - * this.stackLayout.setItem( this.panel1 ); - * } else if ( action === 'continue' ) { - * var dialog = this; - * return new OO.ui.Process( function () { - * dialog.close(); - * } ); - * } - * return MyProcessDialog.parent.prototype.getActionProcess.call( this, action ); - * }; - * MyProcessDialog.prototype.getBodyHeight = function () { - * return this.panel1.$element.outerHeight( true ); - * }; - * var windowManager = new OO.ui.WindowManager(); - * $( 'body' ).append( windowManager.$element ); - * var dialog = new MyProcessDialog( { - * size: 'medium' - * } ); - * windowManager.addWindows( [ dialog ] ); - * windowManager.openWindow( dialog ); - * - * [1]: https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs#Action_sets - * - * @abstract - * @class - * @mixins OO.EventEmitter - * - * @constructor - * @param {Object} [config] Configuration options - */ -OO.ui.ActionSet = function OoUiActionSet( config ) { - // Configuration initialization - config = config || {}; - // Mixin constructors - OO.EventEmitter.call( this ); + // Verify that we're creating an OO.ui.Element instance + parent = cls.parent; - // Properties - this.list = []; - this.categories = { - actions: 'getAction', - flags: 'getFlags', - modes: 'getModes' - }; - this.categorized = {}; - this.special = {}; - this.others = []; - this.organized = false; - this.changing = false; - this.changed = false; -}; + while ( parent !== undefined ) { + if ( parent === OO.ui.Element ) { + // Safe + break; + } -/* Setup */ + parent = parent.parent; + } -OO.mixinClass( OO.ui.ActionSet, OO.EventEmitter ); + if ( parent !== OO.ui.Element ) { + throw new Error( 'Unknown widget type: id: ' + id + ', class: ' + data._ ); + } -/* Static Properties */ + if ( domPromise === false ) { + top = $.Deferred(); + domPromise = top.promise(); + } + $elem.data( 'ooui-infused', true ); // prevent loops + data.id = id; // implicit + data = OO.copy( data, null, function deserialize( value ) { + if ( OO.isPlainObject( value ) ) { + if ( value.tag ) { + return OO.ui.Element.static.unsafeInfuse( value.tag, domPromise ); + } + if ( value.html ) { + return new OO.ui.HtmlSnippet( value.html ); + } + } + } ); + // allow widgets to reuse parts of the DOM + data = cls.static.reusePreInfuseDOM( $elem[ 0 ], data ); + // pick up dynamic state, like focus, value of form inputs, scroll position, etc. + state = cls.static.gatherPreInfuseState( $elem[ 0 ], data ); + // rebuild widget + // jscs:disable requireCapitalizedConstructors + obj = new cls( data ); + // jscs:enable requireCapitalizedConstructors + // now replace old DOM with this new DOM. + if ( top ) { + // An efficient constructor might be able to reuse the entire DOM tree of the original element, + // so only mutate the DOM if we need to. + if ( $elem[ 0 ] !== obj.$element[ 0 ] ) { + $elem.replaceWith( obj.$element ); + // This element is now gone from the DOM, but if anyone is holding a reference to it, + // let's allow them to OO.ui.infuse() it and do what they expect (T105828). + // Do not use jQuery.data(), as using it on detached nodes leaks memory in 1.x line by design. + $elem[ 0 ].oouiInfused = obj; + } + top.resolve(); + } + obj.$element.data( 'ooui-infused', obj ); + // set the 'data-ooui' attribute so we can identify infused widgets + obj.$element.attr( 'data-ooui', '' ); + // restore dynamic state after the new element is inserted into DOM + domPromise.done( obj.restorePreInfuseState.bind( obj, state ) ); + return obj; +}; /** - * Symbolic name of the flags used to identify special actions. Special actions are displayed in the - * header of a {@link OO.ui.ProcessDialog process dialog}. - * See the [OOjs UI documentation on MediaWiki][2] for more information and examples. + * Pick out parts of `node`'s DOM to be reused when infusing a widget. * - * [2]:https://www.mediawiki.org/wiki/OOjs_UI/Windows/Process_Dialogs + * This method **must not** make any changes to the DOM, only find interesting pieces and add them + * to `config` (which should then be returned). Actual DOM juggling should then be done by the + * constructor, which will be given the enhanced config. * - * @abstract - * @static - * @inheritable - * @property {string} + * @protected + * @param {HTMLElement} node + * @param {Object} config + * @return {Object} */ -OO.ui.ActionSet.static.specialFlags = [ 'safe', 'primary' ]; - -/* Events */ +OO.ui.Element.static.reusePreInfuseDOM = function ( node, config ) { + return config; +}; /** - * @event click + * Gather the dynamic state (focus, value of form inputs, scroll position, etc.) of a HTML DOM node + * (and its children) that represent an Element of the same class and the given configuration, + * generated by the PHP implementation. * - * A 'click' event is emitted when an action is clicked. + * This method is called just before `node` is detached from the DOM. The return value of this + * function will be passed to #restorePreInfuseState after the newly created widget's #$element + * is inserted into DOM to replace `node`. * - * @param {OO.ui.ActionWidget} action Action that was clicked + * @protected + * @param {HTMLElement} node + * @param {Object} config + * @return {Object} */ +OO.ui.Element.static.gatherPreInfuseState = function () { + return {}; +}; /** - * @event resize - * - * A 'resize' event is emitted when an action widget is resized. + * Get a jQuery function within a specific document. * - * @param {OO.ui.ActionWidget} action Action that was resized + * @static + * @param {jQuery|HTMLElement|HTMLDocument|Window} context Context to bind the function to + * @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.static.getJQuery = function ( context, $iframe ) { + function wrapper( selector ) { + return $( selector, wrapper.context ); + } -/** - * @event add - * - * An 'add' event is emitted when actions are {@link #method-add added} to the action set. - * - * @param {OO.ui.ActionWidget[]} added Actions added - */ + wrapper.context = this.getDocument( context ); -/** - * @event remove - * - * A 'remove' event is emitted when actions are {@link #method-remove removed} - * or {@link #clear cleared}. - * - * @param {OO.ui.ActionWidget[]} added Actions removed - */ + if ( $iframe ) { + wrapper.$iframe = $iframe; + } + + return wrapper; +}; /** - * @event change - * - * A 'change' event is emitted when actions are {@link #method-add added}, {@link #clear cleared}, - * or {@link #method-remove removed} from the action set or when the {@link #setMode mode} is changed. + * Get the document of an element. * + * @static + * @param {jQuery|HTMLElement|HTMLDocument|Window} obj Object to get the document for + * @return {HTMLDocument|null} Document object */ - -/* Methods */ +OO.ui.Element.static.getDocument = function ( obj ) { + // jQuery - selections created "offscreen" won't have a context, so .context isn't reliable + return ( obj[ 0 ] && obj[ 0 ].ownerDocument ) || + // Empty jQuery selections might have a context + obj.context || + // HTMLElement + obj.ownerDocument || + // Window + obj.document || + // HTMLDocument + ( obj.nodeType === 9 && obj ) || + null; +}; /** - * Handle action change events. + * Get the window of an element or document. * - * @private - * @fires change + * @static + * @param {jQuery|HTMLElement|HTMLDocument|Window} obj Context to get the window for + * @return {Window} Window object */ -OO.ui.ActionSet.prototype.onActionChange = function () { - this.organized = false; - if ( this.changing ) { - this.changed = true; - } else { - this.emit( 'change' ); - } +OO.ui.Element.static.getWindow = function ( obj ) { + var doc = this.getDocument( obj ); + return doc.defaultView; }; /** - * Check if an action is one of the special actions. + * Get the direction of an element or document. * - * @param {OO.ui.ActionWidget} action Action to check - * @return {boolean} Action is special + * @static + * @param {jQuery|HTMLElement|HTMLDocument|Window} obj Context to get the direction for + * @return {string} Text direction, either 'ltr' or 'rtl' */ -OO.ui.ActionSet.prototype.isSpecial = function ( action ) { - var flag; +OO.ui.Element.static.getDir = function ( obj ) { + var isDoc, isWin; - for ( flag in this.special ) { - if ( action === this.special[ flag ] ) { - return true; + if ( obj instanceof jQuery ) { + obj = obj[ 0 ]; + } + isDoc = obj.nodeType === 9; + isWin = obj.document !== undefined; + if ( isDoc || isWin ) { + if ( isWin ) { + obj = obj.document; } + obj = obj.body; } - - return false; + return $( obj ).css( 'direction' ); }; /** - * Get action widgets based on the specified filter: ‘actions’, ‘flags’, ‘modes’, ‘visible’, - * or ‘disabled’. + * Get the offset between two frames. * - * @param {Object} [filters] Filters to use, omit to get all actions - * @param {string|string[]} [filters.actions] Actions that action widgets must have - * @param {string|string[]} [filters.flags] Flags that action widgets must have (e.g., 'safe') - * @param {string|string[]} [filters.modes] Modes that action widgets must have - * @param {boolean} [filters.visible] Action widgets must be visible - * @param {boolean} [filters.disabled] Action widgets must be disabled - * @return {OO.ui.ActionWidget[]} Action widgets matching all criteria + * TODO: Make this function not use recursion. + * + * @static + * @param {Window} from Window of the child frame + * @param {Window} [to=window] Window of the parent frame + * @param {Object} [offset] Offset to start with, used internally + * @return {Object} Offset object, containing left and top properties */ -OO.ui.ActionSet.prototype.get = function ( filters ) { - var i, len, list, category, actions, index, match, matches; +OO.ui.Element.static.getFrameOffset = function ( from, to, offset ) { + var i, len, frames, frame, rect; - if ( filters ) { - this.organize(); + if ( !to ) { + to = window; + } + if ( !offset ) { + offset = { top: 0, left: 0 }; + } + if ( from.parent === from ) { + return offset; + } - // Collect category candidates - matches = []; - for ( category in this.categorized ) { - list = filters[ category ]; - if ( list ) { - if ( !Array.isArray( list ) ) { - list = [ list ]; - } - for ( i = 0, len = list.length; i < len; i++ ) { - actions = this.categorized[ category ][ list[ i ] ]; - if ( Array.isArray( actions ) ) { - matches.push.apply( matches, actions ); - } - } - } - } - // Remove by boolean filters - for ( i = 0, len = matches.length; i < len; i++ ) { - match = matches[ i ]; - if ( - ( filters.visible !== undefined && match.isVisible() !== filters.visible ) || - ( filters.disabled !== undefined && match.isDisabled() !== filters.disabled ) - ) { - matches.splice( i, 1 ); - len--; - i--; - } + // Get iframe element + frames = from.parent.document.getElementsByTagName( 'iframe' ); + for ( i = 0, len = frames.length; i < len; i++ ) { + if ( frames[ i ].contentWindow === from ) { + frame = frames[ i ]; + break; } - // Remove duplicates - for ( i = 0, len = matches.length; i < len; i++ ) { - match = matches[ i ]; - index = matches.lastIndexOf( match ); - while ( index !== i ) { - matches.splice( index, 1 ); - len--; - index = matches.lastIndexOf( match ); - } + } + + // Recursively accumulate offset values + if ( frame ) { + rect = frame.getBoundingClientRect(); + offset.left += rect.left; + offset.top += rect.top; + if ( from !== to ) { + this.getFrameOffset( from.parent, offset ); } - return matches; } - return this.list.slice(); + return offset; }; /** - * Get 'special' actions. + * Get the offset between two elements. * - * Special actions are the first visible action widgets with special flags, such as 'safe' and 'primary'. - * Special flags can be configured in subclasses by changing the static #specialFlags property. + * The two elements may be in a different frame, but in that case the frame $element is in must + * be contained in the frame $anchor is in. * - * @return {OO.ui.ActionWidget[]|null} 'Special' action widgets. + * @static + * @param {jQuery} $element Element whose position to get + * @param {jQuery} $anchor Element to get $element's position relative to + * @return {Object} Translated position coordinates, containing top and left properties */ -OO.ui.ActionSet.prototype.getSpecial = function () { - this.organize(); - return $.extend( {}, this.special ); +OO.ui.Element.static.getRelativePosition = function ( $element, $anchor ) { + var iframe, iframePos, + pos = $element.offset(), + anchorPos = $anchor.offset(), + elementDocument = this.getDocument( $element ), + anchorDocument = this.getDocument( $anchor ); + + // If $element isn't in the same document as $anchor, traverse up + while ( elementDocument !== anchorDocument ) { + iframe = elementDocument.defaultView.frameElement; + if ( !iframe ) { + throw new Error( '$element frame is not contained in $anchor frame' ); + } + iframePos = $( iframe ).offset(); + pos.left += iframePos.left; + pos.top += iframePos.top; + elementDocument = iframe.ownerDocument; + } + pos.left -= anchorPos.left; + pos.top -= anchorPos.top; + return pos; }; /** - * Get 'other' actions. - * - * Other actions include all non-special visible action widgets. + * Get element border sizes. * - * @return {OO.ui.ActionWidget[]} 'Other' action widgets + * @static + * @param {HTMLElement} el Element to measure + * @return {Object} Dimensions object with `top`, `left`, `bottom` and `right` properties */ -OO.ui.ActionSet.prototype.getOthers = function () { - this.organize(); - return this.others.slice(); +OO.ui.Element.static.getBorders = function ( el ) { + var doc = el.ownerDocument, + win = doc.defaultView, + style = win.getComputedStyle( el, null ), + $el = $( el ), + top = parseFloat( style ? style.borderTopWidth : $el.css( 'borderTopWidth' ) ) || 0, + left = parseFloat( style ? style.borderLeftWidth : $el.css( 'borderLeftWidth' ) ) || 0, + bottom = parseFloat( style ? style.borderBottomWidth : $el.css( 'borderBottomWidth' ) ) || 0, + right = parseFloat( style ? style.borderRightWidth : $el.css( 'borderRightWidth' ) ) || 0; + + return { + top: top, + left: left, + bottom: bottom, + right: right + }; }; /** - * Set the mode (e.g., ‘edit’ or ‘view’). Only {@link OO.ui.ActionWidget#modes actions} configured - * to be available in the specified mode will be made visible. All other actions will be hidden. + * Get dimensions of an element or window. * - * @param {string} mode The mode. Only actions configured to be available in the specified - * mode will be made visible. - * @chainable - * @fires toggle - * @fires change + * @static + * @param {HTMLElement|Window} el Element to measure + * @return {Object} Dimensions object with `borders`, `scroll`, `scrollbar` and `rect` properties */ -OO.ui.ActionSet.prototype.setMode = function ( mode ) { - var i, len, action; +OO.ui.Element.static.getDimensions = function ( el ) { + var $el, $win, + doc = el.ownerDocument || el.document, + win = doc.defaultView; - this.changing = true; - for ( i = 0, len = this.list.length; i < len; i++ ) { - action = this.list[ i ]; - action.toggle( action.hasMode( mode ) ); + if ( win === el || el === doc.documentElement ) { + $win = $( win ); + return { + borders: { top: 0, left: 0, bottom: 0, right: 0 }, + scroll: { + top: $win.scrollTop(), + left: $win.scrollLeft() + }, + scrollbar: { right: 0, bottom: 0 }, + rect: { + top: 0, + left: 0, + bottom: $win.innerHeight(), + right: $win.innerWidth() + } + }; + } else { + $el = $( el ); + return { + borders: this.getBorders( el ), + scroll: { + top: $el.scrollTop(), + left: $el.scrollLeft() + }, + scrollbar: { + right: $el.innerWidth() - el.clientWidth, + bottom: $el.innerHeight() - el.clientHeight + }, + rect: el.getBoundingClientRect() + }; } - - this.organized = false; - this.changing = false; - this.emit( 'change' ); - - return this; }; /** - * Set the abilities of the specified actions. + * Get scrollable object parent * - * Action widgets that are configured with the specified actions will be enabled - * or disabled based on the boolean values specified in the `actions` - * parameter. + * documentElement can't be used to get or set the scrollTop + * property on Blink. Changing and testing its value lets us + * use 'body' or 'documentElement' based on what is working. * - * @param {Object.} actions A list keyed by action name with boolean - * values that indicate whether or not the action should be enabled. - * @chainable + * https://code.google.com/p/chromium/issues/detail?id=303131 + * + * @static + * @param {HTMLElement} el Element to find scrollable parent for + * @return {HTMLElement} Scrollable parent */ -OO.ui.ActionSet.prototype.setAbilities = function ( actions ) { - var i, len, action, item; +OO.ui.Element.static.getRootScrollableElement = function ( el ) { + var scrollTop, body; - for ( i = 0, len = this.list.length; i < len; i++ ) { - item = this.list[ i ]; - action = item.getAction(); - if ( actions[ action ] !== undefined ) { - item.setDisabled( !actions[ action ] ); + if ( OO.ui.scrollableElement === undefined ) { + body = el.ownerDocument.body; + scrollTop = body.scrollTop; + body.scrollTop = 1; + + if ( body.scrollTop === 1 ) { + body.scrollTop = scrollTop; + OO.ui.scrollableElement = 'body'; + } else { + OO.ui.scrollableElement = 'documentElement'; } } - return this; + return el.ownerDocument[ OO.ui.scrollableElement ]; }; /** - * Executes a function once per action. + * Get closest scrollable container. * - * When making changes to multiple actions, use this method instead of iterating over the actions - * manually to defer emitting a #change event until after all actions have been changed. + * Traverses up until either a scrollable element or the root is reached, in which case the window + * will be returned. * - * @param {Object|null} actions Filters to use to determine which actions to iterate over; see #get - * @param {Function} callback Callback to run for each action; callback is invoked with three - * arguments: the action, the action's index, the list of actions being iterated over - * @chainable + * @static + * @param {HTMLElement} el Element to find scrollable container for + * @param {string} [dimension] Dimension of scrolling to look for; `x`, `y` or omit for either + * @return {HTMLElement} Closest scrollable container */ -OO.ui.ActionSet.prototype.forEach = function ( filter, callback ) { - this.changed = false; - this.changing = true; - this.get( filter ).forEach( callback ); - this.changing = false; - if ( this.changed ) { - this.emit( 'change' ); +OO.ui.Element.static.getClosestScrollableContainer = function ( el, dimension ) { + var i, val, + // props = [ 'overflow' ] doesn't work due to https://bugzilla.mozilla.org/show_bug.cgi?id=889091 + props = [ 'overflow-x', 'overflow-y' ], + $parent = $( el ).parent(); + + if ( dimension === 'x' || dimension === 'y' ) { + props = [ 'overflow-' + dimension ]; } - return this; + while ( $parent.length ) { + if ( $parent[ 0 ] === this.getRootScrollableElement( el ) ) { + return $parent[ 0 ]; + } + i = props.length; + while ( i-- ) { + val = $parent.css( props[ i ] ); + if ( val === 'auto' || val === 'scroll' ) { + return $parent[ 0 ]; + } + } + $parent = $parent.parent(); + } + return this.getDocument( el ).body; }; /** - * Add action widgets to the action set. + * Scroll element into view. * - * @param {OO.ui.ActionWidget[]} actions Action widgets to add - * @chainable - * @fires add - * @fires change + * @static + * @param {HTMLElement} el Element to scroll into view + * @param {Object} [config] Configuration options + * @param {string} [config.duration] jQuery animation duration value + * @param {string} [config.direction] Scroll in only one direction, e.g. 'x' or 'y', omit + * to scroll in both directions + * @param {Function} [config.complete] Function to call when scrolling completes */ -OO.ui.ActionSet.prototype.add = function ( actions ) { - var i, len, action; +OO.ui.Element.static.scrollIntoView = function ( el, config ) { + var rel, anim, callback, sc, $sc, eld, scd, $win; - this.changing = true; - for ( i = 0, len = actions.length; i < len; i++ ) { - action = actions[ i ]; - action.connect( this, { - click: [ 'emit', 'click', action ], - resize: [ 'emit', 'resize', action ], - toggle: [ 'onActionChange' ] - } ); - this.list.push( action ); - } - this.organized = false; - this.emit( 'add', actions ); - this.changing = false; - this.emit( 'change' ); + // Configuration initialization + config = config || {}; - return this; -}; + anim = {}; + callback = typeof config.complete === 'function' && config.complete; + sc = this.getClosestScrollableContainer( el, config.direction ); + $sc = $( sc ); + eld = this.getDimensions( el ); + scd = this.getDimensions( sc ); + $win = $( this.getWindow( el ) ); -/** - * Remove action widgets from the set. - * - * To remove all actions, you may wish to use the #clear method instead. - * - * @param {OO.ui.ActionWidget[]} actions Action widgets to remove - * @chainable - * @fires remove - * @fires change - */ -OO.ui.ActionSet.prototype.remove = function ( actions ) { - var i, len, index, action; + // Compute the distances between the edges of el and the edges of the scroll viewport + if ( $sc.is( 'html, body' ) ) { + // If the scrollable container is the root, this is easy + rel = { + top: eld.rect.top, + bottom: $win.innerHeight() - eld.rect.bottom, + left: eld.rect.left, + right: $win.innerWidth() - eld.rect.right + }; + } else { + // Otherwise, we have to subtract el's coordinates from sc's coordinates + rel = { + top: eld.rect.top - ( scd.rect.top + scd.borders.top ), + bottom: scd.rect.bottom - scd.borders.bottom - scd.scrollbar.bottom - eld.rect.bottom, + left: eld.rect.left - ( scd.rect.left + scd.borders.left ), + right: scd.rect.right - scd.borders.right - scd.scrollbar.right - eld.rect.right + }; + } - this.changing = true; - for ( i = 0, len = actions.length; i < len; i++ ) { - action = actions[ i ]; - index = this.list.indexOf( action ); - if ( index !== -1 ) { - action.disconnect( this ); - this.list.splice( index, 1 ); + if ( !config.direction || config.direction === 'y' ) { + if ( rel.top < 0 ) { + anim.scrollTop = scd.scroll.top + rel.top; + } else if ( rel.top > 0 && rel.bottom < 0 ) { + anim.scrollTop = scd.scroll.top + Math.min( rel.top, -rel.bottom ); + } + } + if ( !config.direction || config.direction === 'x' ) { + if ( rel.left < 0 ) { + anim.scrollLeft = scd.scroll.left + rel.left; + } else if ( rel.left > 0 && rel.right < 0 ) { + anim.scrollLeft = scd.scroll.left + Math.min( rel.left, -rel.right ); + } + } + if ( !$.isEmptyObject( anim ) ) { + $sc.stop( true ).animate( anim, config.duration || 'fast' ); + if ( callback ) { + $sc.queue( function ( next ) { + callback(); + next(); + } ); + } + } else { + if ( callback ) { + callback(); } } - this.organized = false; - this.emit( 'remove', actions ); - this.changing = false; - this.emit( 'change' ); - - return this; }; /** - * Remove all action widets from the set. + * Force the browser to reconsider whether it really needs to render scrollbars inside the element + * and reserve space for them, because it probably doesn't. * - * To remove only specified actions, use the {@link #method-remove remove} method instead. + * Workaround primarily for , but also + * similar bugs in other browsers. "Just" forcing a reflow is not sufficient in all cases, we need + * to first actually detach (or hide, but detaching is simpler) all children, *then* force a reflow, + * and then reattach (or show) them back. * - * @chainable - * @fires remove - * @fires change + * @static + * @param {HTMLElement} el Element to reconsider the scrollbars on */ -OO.ui.ActionSet.prototype.clear = function () { - var i, len, action, - removed = this.list.slice(); - - this.changing = true; - for ( i = 0, len = this.list.length; i < len; i++ ) { - action = this.list[ i ]; - action.disconnect( this ); +OO.ui.Element.static.reconsiderScrollbars = function ( el ) { + var i, len, scrollLeft, scrollTop, nodes = []; + // Save scroll position + scrollLeft = el.scrollLeft; + scrollTop = el.scrollTop; + // Detach all children + while ( el.firstChild ) { + nodes.push( el.firstChild ); + el.removeChild( el.firstChild ); } - - this.list = []; - - this.organized = false; - this.emit( 'remove', removed ); - this.changing = false; - this.emit( 'change' ); - - return this; + // Force reflow + void el.offsetHeight; + // Reattach all children + for ( i = 0, len = nodes.length; i < len; i++ ) { + el.appendChild( nodes[ i ] ); + } + // Restore scroll position (no-op if scrollbars disappeared) + el.scrollLeft = scrollLeft; + el.scrollTop = scrollTop; }; +/* Methods */ + /** - * Organize actions. - * - * This is called whenever organized information is requested. It will only reorganize the actions - * if something has changed since the last time it ran. + * Toggle visibility of an element. * - * @private + * @param {boolean} [show] Make element visible, omit to toggle visibility + * @fires visible * @chainable */ -OO.ui.ActionSet.prototype.organize = function () { - var i, iLen, j, jLen, flag, action, category, list, item, special, - specialFlags = this.constructor.static.specialFlags; +OO.ui.Element.prototype.toggle = function ( show ) { + show = show === undefined ? !this.visible : !!show; - if ( !this.organized ) { - this.categorized = {}; - this.special = {}; - this.others = []; - for ( i = 0, iLen = this.list.length; i < iLen; i++ ) { - action = this.list[ i ]; - if ( action.isVisible() ) { - // Populate categories - for ( category in this.categories ) { - if ( !this.categorized[ category ] ) { - this.categorized[ category ] = {}; - } - list = action[ this.categories[ category ] ](); - if ( !Array.isArray( list ) ) { - list = [ list ]; - } - for ( j = 0, jLen = list.length; j < jLen; j++ ) { - item = list[ j ]; - if ( !this.categorized[ category ][ item ] ) { - this.categorized[ category ][ item ] = []; - } - this.categorized[ category ][ item ].push( action ); - } - } - // Populate special/others - special = false; - for ( j = 0, jLen = specialFlags.length; j < jLen; j++ ) { - flag = specialFlags[ j ]; - if ( !this.special[ flag ] && action.hasFlag( flag ) ) { - this.special[ flag ] = action; - special = true; - break; - } - } - if ( !special ) { - this.others.push( action ); - } - } - } - this.organized = true; + if ( show !== this.isVisible() ) { + this.visible = show; + this.$element.toggleClass( 'oo-ui-element-hidden', !this.visible ); + this.emit( 'toggle', show ); } return this; }; /** - * Each Element represents a rendering in the DOM—a button or an icon, for example, or anything - * that is visible to a user. Unlike {@link OO.ui.Widget widgets}, plain elements usually do not have events - * connected to them and can't be interacted with. - * - * @abstract - * @class + * Check if element is visible. * - * @constructor - * @param {Object} [config] Configuration options - * @cfg {string[]} [classes] The names of the CSS classes to apply to the element. CSS styles are added - * to the top level (e.g., the outermost div) of the element. See the [OOjs UI documentation on MediaWiki][2] - * for an example. - * [2]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Buttons_and_Switches#cssExample - * @cfg {string} [id] The HTML id attribute used in the rendered tag. - * @cfg {string} [text] Text to insert - * @cfg {Array} [content] An array of content elements to append (after #text). - * Strings will be html-escaped; use an OO.ui.HtmlSnippet to append raw HTML. - * Instances of OO.ui.Element will have their $element appended. - * @cfg {jQuery} [$content] Content elements to append (after #text). - * @cfg {jQuery} [$element] Wrapper element. Defaults to a new element with #getTagName. - * @cfg {Mixed} [data] Custom data of any type or combination of types (e.g., string, number, array, object). - * Data can also be specified with the #setData method. + * @return {boolean} element is visible */ -OO.ui.Element = function OoUiElement( config ) { - // Configuration initialization - config = config || {}; +OO.ui.Element.prototype.isVisible = function () { + return this.visible; +}; - // Properties - this.$ = $; - this.visible = true; - this.data = config.data; - this.$element = config.$element || - $( document.createElement( this.getTagName() ) ); - this.elementGroup = null; - this.debouncedUpdateThemeClassesHandler = OO.ui.debounce( this.debouncedUpdateThemeClasses ); +/** + * Get element data. + * + * @return {Mixed} Element data + */ +OO.ui.Element.prototype.getData = function () { + return this.data; +}; - // Initialization - if ( Array.isArray( config.classes ) ) { - this.$element.addClass( config.classes.join( ' ' ) ); - } - if ( config.id ) { - this.$element.attr( 'id', config.id ); - } - if ( config.text ) { - this.$element.text( config.text ); - } - if ( config.content ) { - // The `content` property treats plain strings as text; use an - // HtmlSnippet to append HTML content. `OO.ui.Element`s get their - // appropriate $element appended. - this.$element.append( config.content.map( function ( v ) { - if ( typeof v === 'string' ) { - // Escape string so it is properly represented in HTML. - return document.createTextNode( v ); - } else if ( v instanceof OO.ui.HtmlSnippet ) { - // Bypass escaping. - return v.toString(); - } else if ( v instanceof OO.ui.Element ) { - return v.$element; - } - return v; - } ) ); - } - if ( config.$content ) { - // The `$content` property treats plain strings as HTML. - this.$element.append( config.$content ); - } +/** + * Set element data. + * + * @param {Mixed} Element data + * @chainable + */ +OO.ui.Element.prototype.setData = function ( data ) { + this.data = data; + return this; }; -/* Setup */ +/** + * Check if element supports one or more methods. + * + * @param {string|string[]} methods Method or list of methods to check + * @return {boolean} All methods are supported + */ +OO.ui.Element.prototype.supports = function ( methods ) { + var i, len, + support = 0; -OO.initClass( OO.ui.Element ); + methods = Array.isArray( methods ) ? methods : [ methods ]; + for ( i = 0, len = methods.length; i < len; i++ ) { + if ( $.isFunction( this[ methods[ i ] ] ) ) { + support++; + } + } -/* Static Properties */ + return methods.length === support; +}; /** - * The name of the HTML tag used by the element. - * - * The static value may be ignored if the #getTagName method is overridden. + * Update the theme-provided classes. * - * @static - * @inheritable - * @property {string} + * @localdoc This is called in element mixins and widget classes any time state changes. + * Updating is debounced, minimizing overhead of changing multiple attributes and + * guaranteeing that theme updates do not occur within an element's constructor */ -OO.ui.Element.static.tagName = 'div'; +OO.ui.Element.prototype.updateThemeClasses = function () { + this.debouncedUpdateThemeClassesHandler(); +}; -/* Static Methods */ +/** + * @private + * @localdoc This method is called directly from the QUnit tests instead of #updateThemeClasses, to + * make them synchronous. + */ +OO.ui.Element.prototype.debouncedUpdateThemeClasses = function () { + OO.ui.theme.updateElementClasses( this ); +}; /** - * Reconstitute a JavaScript object corresponding to a widget created - * by the PHP implementation. + * Get the HTML tag name. * - * @param {string|HTMLElement|jQuery} idOrNode - * A DOM id (if a string) or node for the widget to infuse. - * @return {OO.ui.Element} - * The `OO.ui.Element` corresponding to this (infusable) document node. - * For `Tag` objects emitted on the HTML side (used occasionally for content) - * the value returned is a newly-created Element wrapping around the existing - * DOM node. + * Override this method to base the result on instance information. + * + * @return {string} HTML tag name */ -OO.ui.Element.static.infuse = function ( idOrNode ) { - var obj = OO.ui.Element.static.unsafeInfuse( idOrNode, false ); - // Verify that the type matches up. - // FIXME: uncomment after T89721 is fixed (see T90929) - /* - if ( !( obj instanceof this['class'] ) ) { - throw new Error( 'Infusion type mismatch!' ); - } - */ - return obj; +OO.ui.Element.prototype.getTagName = function () { + return this.constructor.static.tagName; }; /** - * Implementation helper for `infuse`; skips the type check and has an - * extra property so that only the top-level invocation touches the DOM. - * @private - * @param {string|HTMLElement|jQuery} idOrNode - * @param {jQuery.Promise|boolean} domPromise A promise that will be resolved - * when the top-level widget of this infusion is inserted into DOM, - * replacing the original node; or false for top-level invocation. - * @return {OO.ui.Element} + * Check if the element is attached to the DOM + * @return {boolean} The element is attached to the DOM */ -OO.ui.Element.static.unsafeInfuse = function ( idOrNode, domPromise ) { - // look for a cached result of a previous infusion. - var id, $elem, data, cls, parts, parent, obj, top, state; - if ( typeof idOrNode === 'string' ) { - id = idOrNode; - $elem = $( document.getElementById( id ) ); - } else { - $elem = $( idOrNode ); - id = $elem.attr( 'id' ); - } - if ( !$elem.length ) { - throw new Error( 'Widget not found: ' + id ); - } - data = $elem.data( 'ooui-infused' ) || $elem[ 0 ].oouiInfused; - if ( data ) { - // cached! - if ( data === true ) { - throw new Error( 'Circular dependency! ' + id ); - } - return data; - } - data = $elem.attr( 'data-ooui' ); - if ( !data ) { - throw new Error( 'No infusion data found: ' + id ); - } - try { - data = $.parseJSON( data ); - } catch ( _ ) { - data = null; - } - if ( !( data && data._ ) ) { - throw new Error( 'No valid infusion data found: ' + id ); - } - if ( data._ === 'Tag' ) { - // Special case: this is a raw Tag; wrap existing node, don't rebuild. - return new OO.ui.Element( { $element: $elem } ); - } - parts = data._.split( '.' ); - cls = OO.getProp.apply( OO, [ window ].concat( parts ) ); - if ( cls === undefined ) { - // The PHP output might be old and not including the "OO.ui" prefix - // TODO: Remove this back-compat after next major release - cls = OO.getProp.apply( OO, [ OO.ui ].concat( parts ) ); - if ( cls === undefined ) { - throw new Error( 'Unknown widget type: id: ' + id + ', class: ' + data._ ); - } - } - - // Verify that we're creating an OO.ui.Element instance - parent = cls.parent; - - while ( parent !== undefined ) { - if ( parent === OO.ui.Element ) { - // Safe - break; - } - - parent = parent.parent; - } - - if ( parent !== OO.ui.Element ) { - throw new Error( 'Unknown widget type: id: ' + id + ', class: ' + data._ ); - } - - if ( domPromise === false ) { - top = $.Deferred(); - domPromise = top.promise(); - } - $elem.data( 'ooui-infused', true ); // prevent loops - data.id = id; // implicit - data = OO.copy( data, null, function deserialize( value ) { - if ( OO.isPlainObject( value ) ) { - if ( value.tag ) { - return OO.ui.Element.static.unsafeInfuse( value.tag, domPromise ); - } - if ( value.html ) { - return new OO.ui.HtmlSnippet( value.html ); - } - } - } ); - // allow widgets to reuse parts of the DOM - data = cls.static.reusePreInfuseDOM( $elem[ 0 ], data ); - // pick up dynamic state, like focus, value of form inputs, scroll position, etc. - state = cls.static.gatherPreInfuseState( $elem[ 0 ], data ); - // rebuild widget - // jscs:disable requireCapitalizedConstructors - obj = new cls( data ); - // jscs:enable requireCapitalizedConstructors - // now replace old DOM with this new DOM. - if ( top ) { - // An efficient constructor might be able to reuse the entire DOM tree of the original element, - // so only mutate the DOM if we need to. - if ( $elem[ 0 ] !== obj.$element[ 0 ] ) { - $elem.replaceWith( obj.$element ); - // This element is now gone from the DOM, but if anyone is holding a reference to it, - // let's allow them to OO.ui.infuse() it and do what they expect (T105828). - // Do not use jQuery.data(), as using it on detached nodes leaks memory in 1.x line by design. - $elem[ 0 ].oouiInfused = obj; - } - top.resolve(); - } - obj.$element.data( 'ooui-infused', obj ); - // set the 'data-ooui' attribute so we can identify infused widgets - obj.$element.attr( 'data-ooui', '' ); - // restore dynamic state after the new element is inserted into DOM - domPromise.done( obj.restorePreInfuseState.bind( obj, state ) ); - return obj; +OO.ui.Element.prototype.isElementAttached = function () { + return $.contains( this.getElementDocument(), this.$element[ 0 ] ); }; /** - * Pick out parts of `node`'s DOM to be reused when infusing a widget. - * - * This method **must not** make any changes to the DOM, only find interesting pieces and add them - * to `config` (which should then be returned). Actual DOM juggling should then be done by the - * constructor, which will be given the enhanced config. + * Get the DOM document. * - * @protected - * @param {HTMLElement} node - * @param {Object} config - * @return {Object} + * @return {HTMLDocument} Document object */ -OO.ui.Element.static.reusePreInfuseDOM = function ( node, config ) { - return config; +OO.ui.Element.prototype.getElementDocument = function () { + // Don't cache this in other ways either because subclasses could can change this.$element + return OO.ui.Element.static.getDocument( this.$element ); }; /** - * Gather the dynamic state (focus, value of form inputs, scroll position, etc.) of a HTML DOM node - * (and its children) that represent an Element of the same class and the given configuration, - * generated by the PHP implementation. - * - * This method is called just before `node` is detached from the DOM. The return value of this - * function will be passed to #restorePreInfuseState after the newly created widget's #$element - * is inserted into DOM to replace `node`. + * Get the DOM window. * - * @protected - * @param {HTMLElement} node - * @param {Object} config - * @return {Object} + * @return {Window} Window object */ -OO.ui.Element.static.gatherPreInfuseState = function () { - return {}; +OO.ui.Element.prototype.getElementWindow = function () { + return OO.ui.Element.static.getWindow( this.$element ); }; /** - * Get a jQuery function within a specific document. - * - * @static - * @param {jQuery|HTMLElement|HTMLDocument|Window} context Context to bind the function to - * @param {jQuery} [$iframe] HTML iframe element that contains the document, omit if document is - * not in an iframe - * @return {Function} Bound jQuery function + * Get closest scrollable container. */ -OO.ui.Element.static.getJQuery = function ( context, $iframe ) { - function wrapper( selector ) { - return $( selector, wrapper.context ); - } - - wrapper.context = this.getDocument( context ); - - if ( $iframe ) { - wrapper.$iframe = $iframe; - } - - return wrapper; +OO.ui.Element.prototype.getClosestScrollableElementContainer = function () { + return OO.ui.Element.static.getClosestScrollableContainer( this.$element[ 0 ] ); }; /** - * Get the document of an element. + * Get group element is in. * - * @static - * @param {jQuery|HTMLElement|HTMLDocument|Window} obj Object to get the document for - * @return {HTMLDocument|null} Document object + * @return {OO.ui.mixin.GroupElement|null} Group element, null if none */ -OO.ui.Element.static.getDocument = function ( obj ) { - // jQuery - selections created "offscreen" won't have a context, so .context isn't reliable - return ( obj[ 0 ] && obj[ 0 ].ownerDocument ) || - // Empty jQuery selections might have a context - obj.context || - // HTMLElement - obj.ownerDocument || - // Window - obj.document || - // HTMLDocument - ( obj.nodeType === 9 && obj ) || - null; +OO.ui.Element.prototype.getElementGroup = function () { + return this.elementGroup; }; /** - * Get the window of an element or document. + * Set group element is in. * - * @static - * @param {jQuery|HTMLElement|HTMLDocument|Window} obj Context to get the window for - * @return {Window} Window object + * @param {OO.ui.mixin.GroupElement|null} group Group element, null if none + * @chainable */ -OO.ui.Element.static.getWindow = function ( obj ) { - var doc = this.getDocument( obj ); - return doc.defaultView; +OO.ui.Element.prototype.setElementGroup = function ( group ) { + this.elementGroup = group; + return this; }; /** - * Get the direction of an element or document. + * Scroll element into view. * - * @static - * @param {jQuery|HTMLElement|HTMLDocument|Window} obj Context to get the direction for - * @return {string} Text direction, either 'ltr' or 'rtl' + * @param {Object} [config] Configuration options */ -OO.ui.Element.static.getDir = function ( obj ) { - var isDoc, isWin; +OO.ui.Element.prototype.scrollElementIntoView = function ( config ) { + return OO.ui.Element.static.scrollIntoView( this.$element[ 0 ], config ); +}; - if ( obj instanceof jQuery ) { - obj = obj[ 0 ]; - } - isDoc = obj.nodeType === 9; - isWin = obj.document !== undefined; - if ( isDoc || isWin ) { - if ( isWin ) { - obj = obj.document; - } - obj = obj.body; - } - return $( obj ).css( 'direction' ); +/** + * Restore the pre-infusion dynamic state for this widget. + * + * This method is called after #$element has been inserted into DOM. The parameter is the return + * value of #gatherPreInfuseState. + * + * @protected + * @param {Object} state + */ +OO.ui.Element.prototype.restorePreInfuseState = function () { }; /** - * Get the offset between two frames. + * Wraps an HTML snippet for use with configuration values which default + * to strings. This bypasses the default html-escaping done to string + * values. * - * TODO: Make this function not use recursion. + * @class * - * @static - * @param {Window} from Window of the child frame - * @param {Window} [to=window] Window of the parent frame - * @param {Object} [offset] Offset to start with, used internally - * @return {Object} Offset object, containing left and top properties + * @constructor + * @param {string} [content] HTML content */ -OO.ui.Element.static.getFrameOffset = function ( from, to, offset ) { - var i, len, frames, frame, rect; +OO.ui.HtmlSnippet = function OoUiHtmlSnippet( content ) { + // Properties + this.content = content; +}; - if ( !to ) { - to = window; - } - if ( !offset ) { - offset = { top: 0, left: 0 }; - } - if ( from.parent === from ) { - return offset; - } +/* Setup */ - // Get iframe element - frames = from.parent.document.getElementsByTagName( 'iframe' ); - for ( i = 0, len = frames.length; i < len; i++ ) { - if ( frames[ i ].contentWindow === from ) { - frame = frames[ i ]; - break; - } - } +OO.initClass( OO.ui.HtmlSnippet ); - // Recursively accumulate offset values - if ( frame ) { - rect = frame.getBoundingClientRect(); - offset.left += rect.left; - offset.top += rect.top; - if ( from !== to ) { - this.getFrameOffset( from.parent, offset ); - } - } - return offset; +/* Methods */ + +/** + * Render into HTML. + * + * @return {string} Unchanged HTML snippet. + */ +OO.ui.HtmlSnippet.prototype.toString = function () { + return this.content; }; /** - * Get the offset between two elements. + * Layouts are containers for elements and are used to arrange other widgets of arbitrary type in a way + * that is centrally controlled and can be updated dynamically. Layouts can be, and usually are, combined. + * See {@link OO.ui.FieldsetLayout FieldsetLayout}, {@link OO.ui.FieldLayout FieldLayout}, {@link OO.ui.FormLayout FormLayout}, + * {@link OO.ui.PanelLayout PanelLayout}, {@link OO.ui.StackLayout StackLayout}, {@link OO.ui.PageLayout PageLayout}, + * {@link OO.ui.HorizontalLayout HorizontalLayout}, and {@link OO.ui.BookletLayout BookletLayout} for more information and examples. * - * The two elements may be in a different frame, but in that case the frame $element is in must - * be contained in the frame $anchor is in. + * @abstract + * @class + * @extends OO.ui.Element + * @mixins OO.EventEmitter * - * @static - * @param {jQuery} $element Element whose position to get - * @param {jQuery} $anchor Element to get $element's position relative to - * @return {Object} Translated position coordinates, containing top and left properties + * @constructor + * @param {Object} [config] Configuration options */ -OO.ui.Element.static.getRelativePosition = function ( $element, $anchor ) { - var iframe, iframePos, - pos = $element.offset(), - anchorPos = $anchor.offset(), - elementDocument = this.getDocument( $element ), - anchorDocument = this.getDocument( $anchor ); +OO.ui.Layout = function OoUiLayout( config ) { + // Configuration initialization + config = config || {}; - // If $element isn't in the same document as $anchor, traverse up - while ( elementDocument !== anchorDocument ) { - iframe = elementDocument.defaultView.frameElement; - if ( !iframe ) { - throw new Error( '$element frame is not contained in $anchor frame' ); - } - iframePos = $( iframe ).offset(); - pos.left += iframePos.left; - pos.top += iframePos.top; - elementDocument = iframe.ownerDocument; - } - pos.left -= anchorPos.left; - pos.top -= anchorPos.top; - return pos; + // Parent constructor + OO.ui.Layout.parent.call( this, config ); + + // Mixin constructors + OO.EventEmitter.call( this ); + + // Initialization + this.$element.addClass( 'oo-ui-layout' ); }; +/* Setup */ + +OO.inheritClass( OO.ui.Layout, OO.ui.Element ); +OO.mixinClass( OO.ui.Layout, OO.EventEmitter ); + /** - * Get element border sizes. + * Widgets are compositions of one or more OOjs UI elements that users can both view + * and interact with. All widgets can be configured and modified via a standard API, + * and their state can change dynamically according to a model. * - * @static - * @param {HTMLElement} el Element to measure - * @return {Object} Dimensions object with `top`, `left`, `bottom` and `right` properties + * @abstract + * @class + * @extends OO.ui.Element + * @mixins OO.EventEmitter + * + * @constructor + * @param {Object} [config] Configuration options + * @cfg {boolean} [disabled=false] Disable the widget. Disabled widgets cannot be used and their + * appearance reflects this state. */ -OO.ui.Element.static.getBorders = function ( el ) { - var doc = el.ownerDocument, - win = doc.defaultView, - style = win.getComputedStyle( el, null ), - $el = $( el ), - top = parseFloat( style ? style.borderTopWidth : $el.css( 'borderTopWidth' ) ) || 0, - left = parseFloat( style ? style.borderLeftWidth : $el.css( 'borderLeftWidth' ) ) || 0, - bottom = parseFloat( style ? style.borderBottomWidth : $el.css( 'borderBottomWidth' ) ) || 0, - right = parseFloat( style ? style.borderRightWidth : $el.css( 'borderRightWidth' ) ) || 0; +OO.ui.Widget = function OoUiWidget( config ) { + // Initialize config + config = $.extend( { disabled: false }, config ); - return { - top: top, - left: left, - bottom: bottom, - right: right - }; + // Parent constructor + OO.ui.Widget.parent.call( this, config ); + + // Mixin constructors + OO.EventEmitter.call( this ); + + // Properties + this.disabled = null; + this.wasDisabled = null; + + // Initialization + this.$element.addClass( 'oo-ui-widget' ); + this.setDisabled( !!config.disabled ); }; +/* Setup */ + +OO.inheritClass( OO.ui.Widget, OO.ui.Element ); +OO.mixinClass( OO.ui.Widget, OO.EventEmitter ); + +/* Static Properties */ + /** - * Get dimensions of an element or window. + * Whether this widget will behave reasonably when wrapped in a HTML `