3 * https://www.mediawiki.org/wiki/OOjs_UI
5 * Copyright 2011–2017 OOjs UI Team and other contributors.
6 * Released under the MIT license
7 * http://oojs.mit-license.org
9 * Date: 2017-11-28T23:28:10Z
12 * WikimediaUI Base v0.10.0
13 * Wikimedia Foundation user interface base variables
16 background: transparent
;
19 -webkit-box-sizing: border-box
;
20 -moz-box-sizing: border-box
;
21 box-sizing: border-box
;
23 .oo-ui-window-content {
30 .oo-ui-window-content:focus {
35 -webkit-touch-callout: none
;
36 -webkit-user-select: none
;
37 -moz-user-select: none
;
38 -ms-user-select: none
;
46 .oo-ui-window-overlay {
52 .oo-ui-dialog-content
> .oo-ui-window-head
,
53 .oo-ui-dialog-content
> .oo-ui-window-body
,
54 .oo-ui-dialog-content > .oo-ui-window-foot {
58 -webkit-box-sizing: border-box
;
59 -moz-box-sizing: border-box
;
60 box-sizing: border-box
;
62 .oo-ui-dialog-content > .oo-ui-window-head {
67 .oo-ui-dialog-content > .oo-ui-window-body {
73 .oo-ui-dialog-content > .oo-ui-window-foot {
77 .oo-ui-messageDialog-actions .oo-ui-actionWidget {
81 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-buttonElement-button {
84 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labelElement-label {
89 .oo-ui-messageDialog-actions-horizontal {
94 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
98 .oo-ui-messageDialog-actions-vertical {
101 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
104 text-overflow: ellipsis
;
106 .oo-ui-messageDialog-content > .oo-ui-window-foot {
107 outline: 1px solid
#a2a9b1;
109 .oo-ui-messageDialog-title
,
110 .oo-ui-messageDialog-message {
114 .oo-ui-messageDialog-title
.oo-ui-labelElement
,
115 .oo-ui-messageDialog-message.oo-ui-labelElement {
118 .oo-ui-messageDialog-title {
123 .oo-ui-messageDialog-message {
129 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
130 border-right: 1px solid
#a2a9b1;
133 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child {
134 border-right-width: 0;
136 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
137 border-bottom: 1px solid
#a2a9b1;
140 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child {
141 border-bottom-width: 0;
143 .oo-ui-messageDialog-actions .oo-ui-actionWidget {
144 min-height: 3.4375em;
147 .oo-ui-messageDialog-actions .oo-ui-actionWidget:last-child {
150 .oo-ui-messageDialog-actions .oo-ui-actionWidget:first-child {
153 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-buttonElement-button {
158 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-labelElement .oo-ui-labelElement-label {
159 line-height: 3.4375em;
162 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
163 background-color: #f8f9fa;
165 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:active {
166 background-color: #c8ccd1;
168 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:focus {
169 box-shadow: inset
0 0 0 1px #36c, 0 0 0 1px #36c;
171 .oo-ui-messageDialog-actions
.oo-ui-actionWidget
.oo-ui-widget-enabled
.oo-ui-flaggedElement-progressive
.oo-ui-buttonElement-button:hover
,
172 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-constructive .oo-ui-buttonElement-button:hover {
173 background-color: #eaf3ff;
175 .oo-ui-messageDialog-actions
.oo-ui-actionWidget
.oo-ui-widget-enabled
.oo-ui-flaggedElement-progressive
.oo-ui-buttonElement-button:active
,
176 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-constructive .oo-ui-buttonElement-button:active {
177 background-color: rgba
(8, 126, 204, 0.1);
179 .oo-ui-messageDialog-actions
.oo-ui-actionWidget
.oo-ui-widget-enabled
.oo-ui-flaggedElement-progressive
.oo-ui-labelElement-label
,
180 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-constructive .oo-ui-labelElement-label {
183 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive .oo-ui-buttonElement-button:hover {
184 background-color: #fee7e6;
186 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive .oo-ui-buttonElement-button:active {
187 background-color: rgba
(212, 83, 83, 0.1);
189 .oo-ui-processDialog-location {
191 text-overflow: ellipsis
;
194 .oo-ui-processDialog-title {
198 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
,
199 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
,
200 .oo-ui-processDialog-actions-other .oo-ui-actionWidget {
203 .oo-ui-processDialog-actions-safe
,
204 .oo-ui-processDialog-actions-primary {
209 .oo-ui-processDialog-actions-safe {
212 .oo-ui-processDialog-actions-primary {
215 .oo-ui-processDialog-errors {
225 .oo-ui-processDialog-content .oo-ui-window-head {
228 .oo-ui-processDialog-content .oo-ui-window-body {
230 outline: 1px solid
#c8ccd1;
232 .oo-ui-processDialog-navigation {
236 .oo-ui-processDialog-location {
241 .oo-ui-processDialog-title {
243 line-height: 3.4375em;
245 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
,
246 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
,
247 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-framed {
250 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-iconElement:first-child
,
251 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-iconElement:first-child
,
252 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child {
255 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-iconElement
> .oo-ui-buttonElement-button
,
256 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-iconElement
> .oo-ui-buttonElement-button
,
257 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
258 padding-left: 2.875em;
260 min-height: 3.4375em;
262 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-iconElement
> .oo-ui-buttonElement-button
> .oo-ui-iconElement-icon
,
263 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-iconElement
> .oo-ui-buttonElement-button
> .oo-ui-iconElement-icon
,
264 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
267 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement:first-child
,
268 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement:first-child
,
269 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child {
272 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement
> .oo-ui-buttonElement-button
,
273 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement
> .oo-ui-buttonElement-button
,
274 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button {
277 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement
.oo-ui-iconElement
> .oo-ui-buttonElement-button
,
278 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement
.oo-ui-iconElement
> .oo-ui-buttonElement-button
,
279 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button {
280 padding-left: 2.625em;
282 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement-label
,
283 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-labelElement-label
,
284 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-frameless .oo-ui-labelElement-label {
285 line-height: 1.875em;
287 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless:hover
,
288 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless:hover {
289 background-color: rgba
(0, 0, 0, 0.05);
291 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless:active
,
292 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless:active {
293 background-color: rgba
(0, 0, 0, 0.1);
295 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-progressive:hover
,
296 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-progressive:hover
,
297 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-constructive:hover
,
298 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive:hover {
299 background-color: rgba
(8, 126, 204, 0.05);
301 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-progressive:active
,
302 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-progressive:active
,
303 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-constructive:active
,
304 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive:active {
305 background-color: rgba
(8, 126, 204, 0.1);
307 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-progressive
.oo-ui-labelElement-label
,
308 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-progressive
.oo-ui-labelElement-label
,
309 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-constructive
.oo-ui-labelElement-label
,
310 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive .oo-ui-labelElement-label {
313 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-destructive:hover
,
314 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive:hover {
315 background-color: rgba
(212, 83, 83, 0.05);
317 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-frameless
.oo-ui-flaggedElement-destructive:active
,
318 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive:active {
319 background-color: rgba
(212, 83, 83, 0.1);
321 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement {
324 .oo-ui-processDialog > .oo-ui-window-frame {
327 .oo-ui-processDialog-errors {
328 background-color: rgba
(255, 255, 255, 0.9);
329 padding: 3em 3em 1.5em 3em;
332 .oo-ui-processDialog-errors .oo-ui-buttonWidget {
333 margin: 2em 1em 2em 1em;
335 .oo-ui-processDialog-errors-title {
340 .oo-ui-processDialog-error {
344 border: 1px solid
#d33;
345 background-color: #fff7f7;
348 .oo-ui-windowManager-modal > .oo-ui-dialog {
355 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-active {
364 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame {
372 .oo-ui-windowManager-fullscreen > .oo-ui-dialog > .oo-ui-window-frame {
378 .oo-ui-windowManager-modal > .oo-ui-dialog {
379 background-color: rgba
(255, 255, 255, 0.5);
381 -webkit-transition: opacity
250ms;
382 -moz-transition: opacity
250ms;
383 transition: opacity
250ms;
385 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
386 background-color: #fff;
388 -webkit-transform: scale
(0.5);
389 -moz-transform: scale
(0.5);
390 -ms-transform: scale
(0.5);
391 transform: scale
(0.5);
392 -webkit-transition: all
250ms;
393 -moz-transition: all
250ms;
394 transition: all
250ms;
396 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup {
399 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready > .oo-ui-window-frame {
401 -webkit-transform: scale
(1);
402 -moz-transform: scale
(1);
403 -ms-transform: scale
(1);
406 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
410 max-height: calc
( 100% - 2em );
411 border: 1px solid
#a2a9b1;
413 box-shadow: 0 2px 2px 0 rgba
(0, 0, 0, 0.25);