3 * https://www.mediawiki.org/wiki/OOjs_UI
5 * Copyright 2011–2014 OOjs Team and other contributors.
6 * Released under the MIT license
7 * http://oojs.mit-license.org
9 * Date: 2014-09-11T19:39:50Z
14 * Base styles invoke these mixins at the end of their definitions. Override these mixins to add
15 * additional rules to the base styles.
20 * Themes should include this file after defining their variables and mixins.
30 .oo-ui-buttonElement > .oo-ui-buttonElement-button {
32 display: inline-block
;
33 vertical-align: middle
;
34 -webkit-touch-callout: none
;
35 -webkit-user-select: none
;
36 -moz-user-select: none
;
37 -ms-user-select: none
;
40 .oo-ui-buttonElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
43 .oo-ui-buttonElement > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
46 .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
49 .oo-ui-buttonElement
.oo-ui-indicatorElement
> .oo-ui-buttonElement-button
> .oo-ui-indicatorElement-indicator
,
50 .oo-ui-buttonElement.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
51 display: inline-block
;
52 vertical-align: middle
;
53 background-position: center center
;
54 background-repeat: no-repeat
;
56 .oo-ui-buttonElement-frameless {
57 display: inline-block
;
60 .oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
61 display: inline-block
;
62 vertical-align: middle
;
64 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
65 display: inline-block
;
69 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
70 display: inline-block
;
71 vertical-align: middle
;
73 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
> .oo-ui-buttonElement-button
,
74 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button
,
75 .oo-ui-buttonElement-framed.oo-ui-widget-disabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
78 .oo-ui-buttonElement > .oo-ui-buttonElement-button {
81 .oo-ui-buttonElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
84 .oo-ui-buttonElement > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
87 .oo-ui-buttonElement
.oo-ui-indicatorElement
> .oo-ui-buttonElement-button
> .oo-ui-indicatorElement-indicator
,
88 .oo-ui-buttonElement.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
93 .oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
94 /* Don't animate opacities for now, causes wiggling in Chrome (bug 63020) */
95 /*.oo-ui-transition(opacity 200ms);*/
97 .oo-ui-buttonElement-frameless
> .oo-ui-buttonElement-button:hover
> .oo-ui-iconElement-icon
,
98 .oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button:focus > .oo-ui-iconElement-icon {
101 .oo-ui-buttonElement-frameless
> .oo-ui-buttonElement-button:hover
> .oo-ui-labelElement-label
,
102 .oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button:focus > .oo-ui-labelElement-label {
105 .oo-ui-buttonElement-frameless > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
107 margin-right: 0.25em;
109 .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
112 .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-constructive > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
115 .oo-ui-buttonElement-frameless.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
118 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
121 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
124 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
126 padding: 0.2em 0.8em;
127 border-radius: 0.3em;
128 text-shadow: 0 1px 1px rgba
(255, 255, 255, 0.5);
129 border: 1px #c9c9c9 solid
;
130 -webkit-transition: border-color
100ms ease-in-out
;
131 -moz-transition: border-color
100ms ease-in-out
;
132 -ms-transition: border-color
100ms ease-in-out
;
133 -o-transition: border-color
100ms ease-in-out
;
134 transition: border-color
100ms ease-in-out
;
136 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#ffffff', endColorstr
='#dddddd');
137 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #ffffff), color-stop
(100%, #dddddd));
138 background-image: -webkit-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
139 background-image: -moz-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
140 background-image: -ms-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
141 background-image: -o-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
142 background-image: linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
144 .oo-ui-buttonElement-framed
> .oo-ui-buttonElement-button:hover
,
145 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button:focus {
148 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
151 .oo-ui-buttonElement-framed
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button
,
152 .oo-ui-buttonElement-framed.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
153 box-shadow: inset
0 1px 4px 0 rgba
(0, 0, 0, 0.07);
155 border-color: #c9c9c9;
157 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#dddddd', endColorstr
='#ffffff');
158 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #dddddd), color-stop
(100%, #ffffff));
159 background-image: -webkit-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
160 background-image: -moz-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
161 background-image: -ms-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
162 background-image: -o-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
163 background-image: linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
165 .oo-ui-buttonElement-framed.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
166 margin-right: -0.5em;
169 .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
170 margin-right: -0.5em;
173 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button {
174 border: solid
1px #a6cee1;
176 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#eaf4fa', endColorstr
='#b0d9ee');
177 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #eaf4fa), color-stop
(100%, #b0d9ee));
178 background-image: -webkit-linear-gradient
(top
, #eaf4fa 0%, #b0d9ee 100%);
179 background-image: -moz-linear-gradient
(top
, #eaf4fa 0%, #b0d9ee 100%);
180 background-image: -ms-linear-gradient
(top
, #eaf4fa 0%, #b0d9ee 100%);
181 background-image: -o-linear-gradient
(top
, #eaf4fa 0%, #b0d9ee 100%);
182 background-image: linear-gradient
(top
, #eaf4fa 0%, #b0d9ee 100%);
184 .oo-ui-buttonElement-framed
.oo-ui-flaggedElement-primary
> .oo-ui-buttonElement-button:hover
,
185 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button:focus {
186 border-color: #9dc2d4;
188 .oo-ui-buttonElement-framed
.oo-ui-flaggedElement-primary
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button
,
189 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
190 border: solid
1px #a6cee1;
192 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#b0d9ee', endColorstr
='#eaf4fa');
193 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #b0d9ee), color-stop
(100%, #eaf4fa));
194 background-image: -webkit-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
195 background-image: -moz-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
196 background-image: -ms-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
197 background-image: -o-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
198 background-image: linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
200 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive > .oo-ui-buttonElement-button {
201 border: solid
1px #b8d892;
203 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#f0fbe1', endColorstr
='#c3e59a');
204 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #f0fbe1), color-stop
(100%, #c3e59a));
205 background-image: -webkit-linear-gradient
(top
, #f0fbe1 0%, #c3e59a 100%);
206 background-image: -moz-linear-gradient
(top
, #f0fbe1 0%, #c3e59a 100%);
207 background-image: -ms-linear-gradient
(top
, #f0fbe1 0%, #c3e59a 100%);
208 background-image: -o-linear-gradient
(top
, #f0fbe1 0%, #c3e59a 100%);
209 background-image: linear-gradient
(top
, #f0fbe1 0%, #c3e59a 100%);
211 .oo-ui-buttonElement-framed
.oo-ui-flaggedElement-constructive
> .oo-ui-buttonElement-button:hover
,
212 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive > .oo-ui-buttonElement-button:focus {
213 border-color: #adcb89;
215 .oo-ui-buttonElement-framed
.oo-ui-flaggedElement-constructive
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button
,
216 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-constructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
217 border: solid
1px #b8d892;
219 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#c3e59a', endColorstr
='#f0fbe1');
220 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #c3e59a), color-stop
(100%, #f0fbe1));
221 background-image: -webkit-linear-gradient
(top
, #c3e59a 0%, #f0fbe1 100%);
222 background-image: -moz-linear-gradient
(top
, #c3e59a 0%, #f0fbe1 100%);
223 background-image: -ms-linear-gradient
(top
, #c3e59a 0%, #f0fbe1 100%);
224 background-image: -o-linear-gradient
(top
, #c3e59a 0%, #f0fbe1 100%);
225 background-image: linear-gradient
(top
, #c3e59a 0%, #f0fbe1 100%);
227 .oo-ui-buttonElement-framed.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
230 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
> .oo-ui-buttonElement-button
,
231 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button
,
232 .oo-ui-buttonElement-framed.oo-ui-widget-disabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
239 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
> .oo-ui-buttonElement-button:hover
,
240 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button:hover
,
241 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
.oo-ui-buttonElement-pressed
> .oo-ui-buttonElement-button:hover
,
242 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
> .oo-ui-buttonElement-button:focus
,
243 .oo-ui-buttonElement-framed
.oo-ui-widget-disabled
.oo-ui-buttonElement-active
> .oo-ui-buttonElement-button:focus
,
244 .oo-ui-buttonElement-framed.oo-ui-widget-disabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button:focus {
248 .oo-ui-clippableElement-clippable {
249 -webkit-box-sizing: border-box
;
250 -moz-box-sizing: border-box
;
251 box-sizing: border-box
;
253 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous .oo-ui-panelLayout-scrollable {
256 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
258 -webkit-box-sizing: border-box
;
259 -moz-box-sizing: border-box
;
260 box-sizing: border-box
;
262 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-scrollable {
265 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout-padded {
268 .oo-ui-bookletLayout-outlinePanel-editable .oo-ui-outlineWidget {
276 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
282 .oo-ui-bookletLayout-stackLayout .oo-ui-panelLayout {
285 .oo-ui-bookletLayout-outlinePanel {
286 border-left: solid
1px #ddd;
288 .oo-ui-bookletLayout-outlinePanel .oo-ui-outlineControlsWidget {
289 box-shadow: 0 0 0.25em rgba
(0, 0, 0, 0.25);
294 .oo-ui-fieldLayout:before
,
295 .oo-ui-fieldLayout:after {
299 .oo-ui-fieldLayout:after {
302 .oo-ui-fieldLayout
.oo-ui-fieldLayout-align-left
> .oo-ui-labelElement-label
,
303 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labelElement-label {
307 .oo-ui-fieldLayout
.oo-ui-fieldLayout-align-left
> .oo-ui-fieldLayout-field
,
308 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-field {
312 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labelElement-label {
315 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-labelElement-label {
316 display: inline-block
;
317 vertical-align: middle
;
319 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-field {
320 display: inline-block
;
321 vertical-align: middle
;
323 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-labelElement-label {
324 display: inline-block
;
326 .oo-ui-fieldLayout > .oo-ui-popupButtonWidget > .oo-ui-popupWidget > .oo-ui-popupWidget-popup {
329 .oo-ui-fieldLayout:last-child {
332 .oo-ui-fieldLayout
.oo-ui-fieldLayout-align-left
> .oo-ui-labelElement-label
,
333 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-labelElement-label {
338 .oo-ui-fieldLayout
.oo-ui-fieldLayout-align-left
> .oo-ui-fieldLayout-field
,
339 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-field {
342 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-labelElement-label {
343 padding: 0.75em 0.5em 0.5em 0.5em;
345 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-field {
348 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-labelElement-label {
351 .oo-ui-fieldLayout > .oo-ui-popupButtonWidget > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
354 .oo-ui-fieldLayout-disabled .oo-ui-labelElement-label {
357 .oo-ui-fieldsetLayout {
363 .oo-ui-fieldsetLayout.oo-ui-iconElement > .oo-ui-iconElement-icon {
366 background-position: center center
;
367 background-repeat: no-repeat
;
369 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-labelElement-label {
370 display: inline-block
;
372 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout {
375 .oo-ui-fieldsetLayout > .oo-ui-labelElement-label {
377 margin-bottom: 0.5em;
380 .oo-ui-fieldsetLayout.oo-ui-iconElement > .oo-ui-labelElement-label {
381 padding-right: 1.75em;
384 .oo-ui-fieldsetLayout.oo-ui-iconElement > .oo-ui-iconElement-icon {
400 .oo-ui-panelLayout-scrollable {
403 .oo-ui-panelLayout-expanded {
410 .oo-ui-panelLayout-padded {
413 .oo-ui-stackLayout > .oo-ui-panelLayout {
416 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
420 .oo-ui-popupTool
.oo-ui-popupWidget-popup
,
421 .oo-ui-popupTool .oo-ui-popupWidget-anchor {
424 .oo-ui-popupTool .oo-ui-popupWidget {
425 margin-right: 1.25em;
429 display: inline-block
;
430 vertical-align: middle
;
432 border-radius: 0.25em;
433 border: solid
1px transparent
;
434 -webkit-transition: border-color
300ms ease-in-out
;
435 -moz-transition: border-color
300ms ease-in-out
;
436 -ms-transition: border-color
300ms ease-in-out
;
437 -o-transition: border-color
300ms ease-in-out
;
438 transition: border-color
300ms ease-in-out
;
440 .oo-ui-toolGroup-empty {
443 .oo-ui-toolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
444 background-position: center center
;
445 background-repeat: no-repeat
;
447 .oo-ui-toolGroup.oo-ui-widget-enabled:hover {
448 border-color: rgba
(0, 0, 0, 0.1);
450 .oo-ui-toolGroup.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
453 .oo-ui-barToolGroup
> .oo-ui-iconElement-icon
,
454 .oo-ui-barToolGroup > .oo-ui-labelElement-label {
457 .oo-ui-barToolGroup .oo-ui-tool {
458 display: inline-block
;
462 .oo-ui-barToolGroup .oo-ui-tool-link {
465 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
468 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
471 .oo-ui-barToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
474 .oo-ui-barToolGroup
.oo-ui-tool-title
,
475 .oo-ui-barToolGroup .oo-ui-tool-accel {
478 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-link {
481 .oo-ui-barToolGroup .oo-ui-tool {
482 margin: -1px -1px -1px 0;
483 border: solid
1px transparent
;
485 .oo-ui-barToolGroup .oo-ui-tool:first-child {
486 border-top-right-radius: 0.25em;
487 border-bottom-right-radius: 0.25em;
489 .oo-ui-barToolGroup .oo-ui-tool:last-child {
491 border-top-left-radius: 0.25em;
492 border-bottom-left-radius: 0.25em;
494 .oo-ui-barToolGroup .oo-ui-tool-link {
498 .oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
503 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled:hover {
504 border-color: rgba
(0, 0, 0, 0.2);
506 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-active.oo-ui-widget-enabled {
507 border-color: rgba
(0, 0, 0, 0.2);
508 box-shadow: inset
0 0.07em 0.07em 0 rgba
(0, 0, 0, 0.07);
510 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#f1f7fb', endColorstr
='#ffffff');
511 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #f1f7fb), color-stop
(100%, #ffffff));
512 background-image: -webkit-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
513 background-image: -moz-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
514 background-image: -ms-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
515 background-image: -o-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
516 background-image: linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
518 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
519 border-right-color: rgba
(0, 0, 0, 0.1);
521 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon {
524 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconElement-icon {
527 .oo-ui-barToolGroup.oo-ui-widget-enabled .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconElement-icon {
530 .oo-ui-barToolGroup.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon {
533 .oo-ui-popupToolGroup {
538 .oo-ui-popupToolGroup-handle {
542 .oo-ui-popupToolGroup-handle
.oo-ui-indicatorElement-indicator
,
543 .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
545 background-position: center center
;
546 background-repeat: no-repeat
;
548 .oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle {
551 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
556 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools .oo-ui-iconElement-icon {
557 background-repeat: no-repeat
;
558 background-position: center center
;
560 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled > .oo-ui-toolGroup-tools {
563 .oo-ui-popupToolGroup-left > .oo-ui-toolGroup-tools {
566 .oo-ui-popupToolGroup-right > .oo-ui-toolGroup-tools {
569 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
570 display: inline-block
;
571 vertical-align: middle
;
573 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
574 display: inline-block
;
575 vertical-align: middle
;
577 .oo-ui-popupToolGroup .oo-ui-tool-accel {
580 .oo-ui-popupToolGroup.oo-ui-indicatorElement.oo-ui-iconElement {
583 .oo-ui-popupToolGroup-handle
.oo-ui-indicatorElement-indicator
,
584 .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
590 .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
593 .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
596 .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
601 .oo-ui-popupToolGroup-header {
607 .oo-ui-popupToolGroup-active.oo-ui-widget-enabled {
608 border-bottom-right-radius: 0;
609 border-bottom-left-radius: 0;
610 box-shadow: inset
0 0.07em 0.07em 0 rgba
(0, 0, 0, 0.07);
612 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#f1f7fb', endColorstr
='#ffffff');
613 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #f1f7fb), color-stop
(100%, #ffffff));
614 background-image: -webkit-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
615 background-image: -moz-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
616 background-image: -ms-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
617 background-image: -o-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
618 background-image: linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
620 .oo-ui-popupToolGroup.oo-ui-iconElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
623 .oo-ui-popupToolGroup.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
626 .oo-ui-popupToolGroup .oo-ui-toolGroup-tools {
629 border: solid
1px #ccc;
630 background-color: white
;
631 box-shadow: 0 0.25em 1em rgba
(0, 0, 0, 0.25);
633 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
638 .oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
642 .oo-ui-listToolGroup .oo-ui-tool {
643 display: inline-block
;
645 -webkit-box-sizing: border-box
;
646 -moz-box-sizing: border-box
;
647 box-sizing: border-box
;
649 .oo-ui-listToolGroup .oo-ui-tool-link {
654 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
657 .oo-ui-listToolGroup .oo-ui-toolGroup-tools {
660 .oo-ui-listToolGroup.oo-ui-popupToolGroup-active {
661 border-color: rgba
(0, 0, 0, 0.2);
663 .oo-ui-listToolGroup .oo-ui-tool {
664 border: solid
1px transparent
;
667 .oo-ui-listToolGroup .oo-ui-tool-link {
670 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled {
671 border-color: rgba
(0, 0, 0, 0.1);
672 box-shadow: inset
0 0.07em 0.07em 0 rgba
(0, 0, 0, 0.07);
674 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#f1f7fb', endColorstr
='#ffffff');
675 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #f1f7fb), color-stop
(100%, #ffffff));
676 background-image: -webkit-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
677 background-image: -moz-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
678 background-image: -ms-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
679 background-image: -o-linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
680 background-image: linear-gradient
(top
, #f1f7fb 0%, #ffffff 100%);
682 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled + .oo-ui-tool-active.oo-ui-widget-enabled {
683 border-top-color: rgba
(0, 0, 0, 0.1);
685 .oo-ui-listToolGroup .oo-ui-tool-active.oo-ui-widget-enabled:hover {
686 border-color: rgba
(0, 0, 0, 0.2);
688 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
689 border-color: rgba
(0, 0, 0, 0.2);
691 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-iconElement-icon {
694 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-tool-link .oo-ui-iconElement-icon {
697 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
700 .oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon {
703 .oo-ui-listToolGroup.oo-ui-widget-disabled {
706 .oo-ui-listToolGroup
.oo-ui-widget-disabled
.oo-ui-indicatorElement-indicator
,
707 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon {
710 .oo-ui-menuToolGroup {
711 border-color: rgba
(0, 0, 0, 0.1);
713 .oo-ui-menuToolGroup .oo-ui-tool {
716 .oo-ui-menuToolGroup .oo-ui-tool-link {
721 .oo-ui-menuToolGroup .oo-ui-tool-link .oo-ui-iconElement-icon {
722 background-image: none
;
724 .oo-ui-menuToolGroup .oo-ui-tool-active .oo-ui-tool-link .oo-ui-iconElement-icon {
725 background-image: /* @embed */ url
(images/icons/check.svg);
727 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link {
730 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
733 .oo-ui-menuToolGroup .oo-ui-toolGroup-tools {
734 padding: 0.25em 0 0.25em 0;
736 .oo-ui-menuToolGroup.oo-ui-widget-enabled:hover {
737 border-color: rgba
(0, 0, 0, 0.2);
739 .oo-ui-menuToolGroup.oo-ui-popupToolGroup-active {
740 border-color: rgba
(0, 0, 0, 0.25);
742 .oo-ui-menuToolGroup .oo-ui-tool-link {
743 padding: 0 0.25em 0 1em;
745 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-enabled:hover {
746 background-color: #e1f3ff;
748 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-tool-title {
751 .oo-ui-menuToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link .oo-ui-iconElement-icon {
754 .oo-ui-menuToolGroup.oo-ui-widget-disabled {
756 border-color: rgba
(0, 0, 0, 0.05);
758 .oo-ui-menuToolGroup
.oo-ui-widget-disabled
.oo-ui-indicatorElement-indicator
,
759 .oo-ui-menuToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon {
768 .oo-ui-toolbar-actions {
771 .oo-ui-toolbar-tools {
774 .oo-ui-toolbar-tools
,
775 .oo-ui-toolbar-actions
,
776 .oo-ui-toolbar-shadow {
777 -webkit-touch-callout: none
;
778 -webkit-user-select: none
;
779 -moz-user-select: none
;
780 -ms-user-select: none
;
783 .oo-ui-toolbar-actions .oo-ui-popupWidget {
784 -webkit-touch-callout: default
;
785 -webkit-user-select: all
;
786 -moz-user-select: all
;
787 -ms-user-select: all
;
790 .oo-ui-toolbar-shadow {
791 background-position: right top
;
792 background-repeat: repeat-x
;
795 pointer-events: none
;
798 border-bottom: solid
1px #ccc;
800 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#ffffff', endColorstr
='#f1f7fb');
801 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #ffffff), color-stop
(100%, #f1f7fb));
802 background-image: -webkit-linear-gradient
(top
, #ffffff 0%, #f1f7fb 100%);
803 background-image: -moz-linear-gradient
(top
, #ffffff 0%, #f1f7fb 100%);
804 background-image: -ms-linear-gradient
(top
, #ffffff 0%, #f1f7fb 100%);
805 background-image: -o-linear-gradient
(top
, #ffffff 0%, #f1f7fb 100%);
806 background-image: linear-gradient
(top
, #ffffff 0%, #f1f7fb 100%);
808 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
812 .oo-ui-toolbar-shadow {
813 background-image: /* @embed */ url
(images
/toolbar-shadow
.png
);
817 -webkit-transition: opacity
500ms ease-in-out
;
818 -moz-transition: opacity
500ms ease-in-out
;
819 -ms-transition: opacity
500ms ease-in-out
;
820 -o-transition: opacity
500ms ease-in-out
;
821 transition: opacity
500ms ease-in-out
;
823 .oo-ui-optionWidget {
827 padding: 0.5em 3em 0.5em 2em;
830 .oo-ui-optionWidget.oo-ui-widget-disabled {
833 .oo-ui-optionWidget .oo-ui-labelElement-label {
836 text-overflow: ellipsis
;
839 .oo-ui-optionWidget-highlighted {
840 background-color: #e1f3ff;
842 .oo-ui-optionWidget .oo-ui-labelElement-label {
845 .oo-ui-selectWidget-depressed .oo-ui-optionWidget-selected {
846 background-color: #a7dcff;
848 .oo-ui-selectWidget-pressed .oo-ui-optionWidget-pressed {
849 background-color: #a7dcff;
851 .oo-ui-optionWidget.oo-ui-widget-disabled {
854 .oo-ui-decoratedOptionWidget
.oo-ui-iconElement-icon
,
855 .oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator {
857 background-repeat: no-repeat
;
858 background-position: center center
;
860 .oo-ui-decoratedOptionWidget
.oo-ui-iconElement-icon
,
861 .oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator {
867 .oo-ui-decoratedOptionWidget .oo-ui-iconElement-icon {
870 .oo-ui-decoratedOptionWidget .oo-ui-indicatorElement-indicator {
873 .oo-ui-buttonSelectWidget {
874 display: inline-block
;
876 border-radius: 0.3em;
878 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
882 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button {
883 border-bottom-right-radius: 0.3em;
884 border-top-right-radius: 0.3em;
887 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonElement-button {
888 border-bottom-left-radius: 0.3em;
889 border-top-left-radius: 0.3em;
891 .oo-ui-buttonOptionWidget {
892 display: inline-block
;
894 background-color: transparent
;
896 .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
899 .oo-ui-buttonOptionWidget
.oo-ui-iconElement
.oo-ui-iconElement-icon
,
900 .oo-ui-buttonOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
902 display: inline-block
;
903 vertical-align: middle
;
905 .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
908 .oo-ui-buttonOptionWidget
.oo-ui-iconElement
.oo-ui-iconElement-icon
,
909 .oo-ui-buttonOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
913 .oo-ui-buttonOptionWidget
.oo-ui-optionWidget-selected
,
914 .oo-ui-buttonOptionWidget
.oo-ui-optionWidget-pressed
,
915 .oo-ui-buttonOptionWidget.oo-ui-optionWidget-highlighted {
916 background-color: transparent
;
919 display: inline-block
;
923 display: inline-block
;
924 vertical-align: middle
;
925 background-position: center center
;
926 background-repeat: no-repeat
;
932 .oo-ui-iconWidget.oo-ui-widget-disabled {
935 .oo-ui-indicatorWidget {
936 display: inline-block
;
937 vertical-align: middle
;
938 background-position: center center
;
939 background-repeat: no-repeat
;
945 .oo-ui-indicatorWidget.oo-ui-widget-disabled {
948 .oo-ui-buttonWidget {
949 display: inline-block
;
950 vertical-align: middle
;
952 .oo-ui-buttonGroupWidget {
953 display: inline-block
;
955 border-radius: 0.3em;
957 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed .oo-ui-buttonElement-button {
962 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button {
963 border-bottom-right-radius: 0.3em;
964 border-top-right-radius: 0.3em;
967 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button {
968 border-bottom-left-radius: 0.3em;
969 border-top-left-radius: 0.3em;
971 .oo-ui-toggleSwitchWidget {
973 display: inline-block
;
974 vertical-align: middle
;
977 -webkit-box-sizing: border-box
;
978 -moz-box-sizing: border-box
;
979 box-sizing: border-box
;
980 -webkit-transform: translateZ
(0px);
981 -moz-transform: translateZ
(0px);
982 -ms-transform: translateZ
(0px);
983 -o-transform: translateZ
(0px);
984 transform: translateZ
(0px);
988 box-shadow: 0 0 0 white
, inset
0 0.1em 0.2em #ddd;
989 border: solid
1px #ccc;
991 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#dddddd', endColorstr
='#ffffff');
992 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #dddddd), color-stop
(100%, #ffffff));
993 background-image: -webkit-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
994 background-image: -moz-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
995 background-image: -ms-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
996 background-image: -o-linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
997 background-image: linear-gradient
(top
, #dddddd 0%, #ffffff 100%);
999 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1002 .oo-ui-toggleSwitchWidget-grip {
1005 -webkit-box-sizing: border-box
;
1006 -moz-box-sizing: border-box
;
1007 box-sizing: border-box
;
1009 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1015 -webkit-touch-callout: none
;
1016 -webkit-user-select: none
;
1017 -moz-user-select: none
;
1018 -ms-user-select: none
;
1021 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1024 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
1027 .oo-ui-toggleSwitchWidget-grip {
1034 box-shadow: 0 0.1em 0.25em rgba
(0, 0, 0, 0.1);
1035 border: 1px #c9c9c9 solid
;
1036 -webkit-transition: right
200ms ease-in-out
, margin-right
200ms ease-in-out
;
1037 -moz-transition: right
200ms ease-in-out
, margin-right
200ms ease-in-out
;
1038 -ms-transition: right
200ms ease-in-out
, margin-right
200ms ease-in-out
;
1039 -o-transition: right
200ms ease-in-out
, margin-right
200ms ease-in-out
;
1040 transition: right
200ms ease-in-out
, margin-right
200ms ease-in-out
;
1041 background: #eeeeee;
1042 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#ffffff', endColorstr
='#dddddd');
1043 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #ffffff), color-stop
(100%, #dddddd));
1044 background-image: -webkit-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
1045 background-image: -moz-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
1046 background-image: -ms-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
1047 background-image: -o-linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
1048 background-image: linear-gradient
(top
, #ffffff 0%, #dddddd 100%);
1050 .oo-ui-toggleSwitchWidget
.oo-ui-widget-enabled:hover
,
1051 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
1054 .oo-ui-toggleSwitchWidget .oo-ui-toggleSwitchWidget-glow {
1056 box-shadow: inset
0 1px 4px 0 rgba
(0, 0, 0, 0.07);
1057 -webkit-transition: opacity
200ms ease-in-out
;
1058 -moz-transition: opacity
200ms ease-in-out
;
1059 -ms-transition: opacity
200ms ease-in-out
;
1060 -o-transition: opacity
200ms ease-in-out
;
1061 transition: opacity
200ms ease-in-out
;
1062 background: #cde7f4;
1063 filter: progid:DXImageTransform
.Microsoft
.gradient
(GradientType
=0, startColorstr
='#b0d9ee', endColorstr
='#eaf4fa');
1064 background-image: -webkit-gradient
(linear
, left top
, left bottom
, color-stop
(0%, #b0d9ee), color-stop
(100%, #eaf4fa));
1065 background-image: -webkit-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
1066 background-image: -moz-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
1067 background-image: -ms-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
1068 background-image: -o-linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
1069 background-image: linear-gradient
(top
, #b0d9ee 0%, #eaf4fa 100%);
1071 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-glow {
1074 .oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
1078 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-glow {
1082 .oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
1086 .oo-ui-popupWidget-popup {
1091 .oo-ui-popupWidget-anchor {
1095 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor {
1098 background-repeat: no-repeat
;
1100 .oo-ui-popupWidget-head {
1101 -webkit-touch-callout: none
;
1102 -webkit-user-select: none
;
1103 -moz-user-select: none
;
1104 -ms-user-select: none
;
1107 .oo-ui-popupWidget-head .oo-ui-buttonWidget {
1110 .oo-ui-popupWidget-head .oo-ui-labelElement-label {
1114 .oo-ui-popupWidget-body {
1118 .oo-ui-popupWidget-popup {
1119 border: solid
1px #ccc;
1120 border-radius: 0.25em;
1121 background-color: #fff;
1122 box-shadow: 0 0.15em 0.5em 0 rgba
(0, 0, 0, 0.2);
1124 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-popup {
1127 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor {
1131 background-image: /* @embed */ url
(images/anchor.svg);
1133 .oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup {
1134 -webkit-transition: width
100ms ease-in-out
, height
100ms ease-in-out
, right
100ms ease-in-out
;
1135 -moz-transition: width
100ms ease-in-out
, height
100ms ease-in-out
, right
100ms ease-in-out
;
1136 -ms-transition: width
100ms ease-in-out
, height
100ms ease-in-out
, right
100ms ease-in-out
;
1137 -o-transition: width
100ms ease-in-out
, height
100ms ease-in-out
, right
100ms ease-in-out
;
1138 transition: width
100ms ease-in-out
, height
100ms ease-in-out
, right
100ms ease-in-out
;
1140 .oo-ui-popupWidget-head {
1143 .oo-ui-popupWidget-head .oo-ui-buttonWidget {
1146 .oo-ui-popupWidget-head .oo-ui-labelElement-label {
1149 .oo-ui-popupWidget-body {
1150 box-shadow: 0 0 0.66em rgba
(0, 0, 0, 0.25);
1152 .oo-ui-popupWidget-body-padded {
1155 .oo-ui-popupButtonWidget {
1158 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
1163 .oo-ui-textInputWidget {
1165 -webkit-box-sizing: border-box
;
1166 -moz-box-sizing: border-box
;
1167 box-sizing: border-box
;
1170 .oo-ui-textInputWidget input
,
1171 .oo-ui-textInputWidget textarea {
1172 display: inline-block
;
1175 -webkit-box-sizing: border-box
;
1176 -moz-box-sizing: border-box
;
1177 box-sizing: border-box
;
1179 .oo-ui-textInputWidget
> .oo-ui-iconElement-icon
,
1180 .oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator {
1184 background-repeat: no-repeat
;
1186 -webkit-touch-callout: none
;
1187 -webkit-user-select: none
;
1188 -moz-user-select: none
;
1189 -ms-user-select: none
;
1192 .oo-ui-textInputWidget > .oo-ui-iconElement-icon {
1195 .oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator {
1198 .oo-ui-textInputWidget input
,
1199 .oo-ui-textInputWidget textarea {
1202 font-family: sans-serif
;
1203 background-color: #fff;
1204 border: solid
1px #ccc;
1205 box-shadow: 0 0 0 white
, inset
0 0.1em 0.2em #ddd;
1206 border-radius: 0.25em;
1207 -webkit-transition: border-color
200ms, box-shadow
200ms;
1208 -moz-transition: border-color
200ms, box-shadow
200ms;
1209 -ms-transition: border-color
200ms, box-shadow
200ms;
1210 -o-transition: border-color
200ms, box-shadow
200ms;
1211 transition: border-color
200ms, box-shadow
200ms;
1213 .oo-ui-textInputWidget-decorated input
,
1214 .oo-ui-textInputWidget-decorated textarea {
1217 .oo-ui-textInputWidget-icon {
1220 .oo-ui-textInputWidget
.oo-ui-widget-enabled
input:focus
,
1221 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
1223 border-color: #a7dcff;
1224 box-shadow: 0 0 0.3em #a7dcff, 0 0 0 white
;
1226 .oo-ui-textInputWidget input
[readonly
],
1227 .oo-ui-textInputWidget textarea[readonly] {
1229 text-shadow: 0 1px 1px #fff;
1231 .oo-ui-textInputWidget-pending input
,
1232 .oo-ui-textInputWidget-pending textarea {
1233 background-color: transparent
;
1235 .oo-ui-textInputWidget
.oo-ui-widget-disabled input
,
1236 .oo-ui-textInputWidget
.oo-ui-widget-disabled
input:focus
,
1237 .oo-ui-textInputWidget
.oo-ui-widget-disabled textarea
,
1238 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea:focus {
1240 text-shadow: 0 1px 1px #fff;
1242 background-color: #f3f3f3;
1244 .oo-ui-textInputWidget
.oo-ui-iconElement-icon
,
1245 .oo-ui-textInputWidget .oo-ui-indicatorElement-indicator {
1248 .oo-ui-textInputWidget
.oo-ui-iconElement input
,
1249 .oo-ui-textInputWidget.oo-ui-iconElement textarea {
1252 .oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon {
1254 background-position: left center
;
1256 .oo-ui-textInputWidget
.oo-ui-indicatorElement input
,
1257 .oo-ui-textInputWidget.oo-ui-indicatorElement textarea {
1258 padding-left: 1.5em;
1260 .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
1262 background-position: right center
;
1268 border: solid
1px #ccc;
1269 border-radius: 0 0 0.25em 0.25em;
1270 box-shadow: 0 0.15em 1em 0 rgba
(0, 0, 0, 0.2);
1272 .oo-ui-menuWidget input {
1279 .oo-ui-menuItemWidget {
1282 .oo-ui-menuItemWidget .oo-ui-iconElement-icon {
1285 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
1286 background-color: transparent
;
1288 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected .oo-ui-iconElement-icon {
1291 .oo-ui-menuItemWidget.oo-ui-optionWidget-selected {
1292 background-color: transparent
;
1294 .oo-ui-menuItemWidget
.oo-ui-optionWidget-highlighted
,
1295 .oo-ui-menuItemWidget.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
1296 background-color: #e1f3ff;
1298 .oo-ui-menuSectionItemWidget {
1300 padding: 0.33em 0.75em;
1303 .oo-ui-inlineMenuWidget {
1305 display: inline-block
;
1309 .oo-ui-inlineMenuWidget-handle {
1311 display: inline-block
;
1313 -webkit-touch-callout: none
;
1314 -webkit-user-select: none
;
1315 -moz-user-select: none
;
1316 -ms-user-select: none
;
1318 -webkit-box-sizing: border-box
;
1319 -moz-box-sizing: border-box
;
1320 box-sizing: border-box
;
1322 .oo-ui-inlineMenuWidget-handle
.oo-ui-indicatorElement-indicator
,
1323 .oo-ui-inlineMenuWidget-handle .oo-ui-iconElement-icon {
1325 background-position: center center
;
1326 background-repeat: no-repeat
;
1328 .oo-ui-inlineMenuWidget .oo-ui-menuWidget {
1332 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
1335 .oo-ui-inlineMenuWidget-handle {
1337 border: solid
1px rgba
(0, 0, 0, 0.1);
1338 border-radius: 0.25em;
1340 .oo-ui-inlineMenuWidget-handle:hover {
1341 border-color: rgba
(0, 0, 0, 0.2);
1343 .oo-ui-inlineMenuWidget-handle .oo-ui-indicatorElement-indicator {
1346 .oo-ui-inlineMenuWidget-handle .oo-ui-iconElement-icon {
1349 .oo-ui-inlineMenuWidget-handle .oo-ui-labelElement-label {
1353 .oo-ui-inlineMenuWidget-handle
.oo-ui-indicatorElement-indicator
,
1354 .oo-ui-inlineMenuWidget-handle .oo-ui-iconElement-icon {
1360 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-inlineMenuWidget-handle {
1362 text-shadow: 0 1px 1px #fff;
1364 background-color: #f3f3f3;
1366 .oo-ui-inlineMenuWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator {
1369 .oo-ui-inlineMenuWidget.oo-ui-iconElement .oo-ui-inlineMenuWidget-handle .oo-ui-labelElement-label {
1372 .oo-ui-inlineMenuWidget.oo-ui-indicatorElement .oo-ui-inlineMenuWidget-handle .oo-ui-labelElement-label {
1375 .oo-ui-outlineItemWidget {
1378 -webkit-touch-callout: none
;
1379 -webkit-user-select: none
;
1380 -moz-user-select: none
;
1381 -ms-user-select: none
;
1386 .oo-ui-outlineItemWidget.oo-ui-indicatorElement .oo-ui-labelElement-label {
1387 padding-left: 1.5em;
1389 .oo-ui-outlineItemWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
1392 .oo-ui-outlineItemWidget-level-0 {
1393 padding-right: 3.5em;
1395 .oo-ui-outlineItemWidget-level-0 .oo-ui-iconElement-icon {
1398 .oo-ui-outlineItemWidget-level-1 {
1401 .oo-ui-outlineItemWidget-level-1 .oo-ui-iconElement-icon {
1404 .oo-ui-outlineItemWidget-level-2 {
1405 padding-right: 6.5em;
1407 .oo-ui-outlineItemWidget-level-2 .oo-ui-iconElement-icon {
1410 .oo-ui-selectWidget-depressed .oo-ui-outlineItemWidget.oo-ui-optionWidget-selected {
1411 background-color: #a7dcff;
1412 text-shadow: 0 1px 1px rgba
(255, 255, 255, 0.5);
1414 .oo-ui-outlineItemWidget.oo-ui-flaggedElement-important {
1417 .oo-ui-outlineItemWidget.oo-ui-flaggedElement-placeholder {
1420 .oo-ui-outlineItemWidget.oo-ui-flaggedElement-empty .oo-ui-iconElement-icon {
1423 .oo-ui-outlineItemWidget.oo-ui-flaggedElement-empty .oo-ui-labelElement-label {
1426 .oo-ui-outlineControlsWidget {
1428 background-color: #fff;
1430 .oo-ui-outlineControlsWidget-items
,
1431 .oo-ui-outlineControlsWidget-movers {
1433 -webkit-box-sizing: border-box
;
1434 -moz-box-sizing: border-box
;
1435 box-sizing: border-box
;
1437 .oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon {
1439 background-position: left center
;
1440 background-repeat: no-repeat
;
1442 .oo-ui-outlineControlsWidget-items {
1445 .oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget {
1448 .oo-ui-outlineControlsWidget-movers {
1451 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
1454 .oo-ui-outlineControlsWidget-items
,
1455 .oo-ui-outlineControlsWidget-movers {
1460 .oo-ui-outlineControlsWidget > .oo-ui-iconElement-icon {
1463 margin: 0.5em 0.5em 0.5em 0;
1466 .oo-ui-outlineControlsWidget-items {
1469 .oo-ui-comboBoxWidget > .oo-ui-selectWidget {
1473 .oo-ui-comboBoxWidget > .oo-ui-selectWidget-handle {
1474 border: solid
1px rgba
(0, 0, 0, 0.1);
1475 border-radius: 0.25em;
1477 .oo-ui-comboBoxWidget > .oo-ui-selectWidget-handle:hover {
1478 border-color: rgba
(0, 0, 0, 0.2);
1480 .oo-ui-comboBoxWidget
> .oo-ui-selectWidget
.oo-ui-widget-disabled
.oo-ui-textInputWidget
.oo-ui-indicatorElement
.oo-ui-indicatorElement-indicator
,
1481 .oo-ui-comboBoxWidget > .oo-ui-selectWidget-empty .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
1485 .oo-ui-searchWidget-query {
1491 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1494 .oo-ui-searchWidget-results {
1502 .oo-ui-searchWidget-query {
1505 box-shadow: 0 0 0.5em rgba
(0, 0, 0, 0.2);
1507 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1510 .oo-ui-searchWidget-results {
1517 /* Content div takes focus when opened, so hide outline */
1519 .oo-ui-window-frame {
1520 -webkit-box-sizing: border-box
;
1521 -moz-box-sizing: border-box
;
1522 box-sizing: border-box
;
1524 .oo-ui-window-frame > iframe {
1530 .oo-ui-window-content:focus {
1534 .oo-ui-window-foot {
1535 -webkit-touch-callout: none
;
1536 -webkit-user-select: none
;
1537 -moz-user-select: none
;
1538 -ms-user-select: none
;
1541 .oo-ui-window-body {
1546 .oo-ui-window-overlay {
1551 .oo-ui-window-isolated {
1552 background-color: transparent
;
1553 background-image: none
;
1554 font-family: sans-serif
;
1557 .oo-ui-dialog-content
> .oo-ui-window-head
,
1558 .oo-ui-dialog-content
> .oo-ui-window-body
,
1559 .oo-ui-dialog-content > .oo-ui-window-foot {
1564 -webkit-box-sizing: border-box
;
1565 -moz-box-sizing: border-box
;
1566 box-sizing: border-box
;
1568 .oo-ui-dialog-content > .oo-ui-window-head {
1572 .oo-ui-dialog-content > .oo-ui-window-body {
1577 .oo-ui-dialog-content > .oo-ui-window-foot {
1581 .oo-ui-dialog-content > .oo-ui-window-overlay {
1584 .oo-ui-dialog-content > .oo-ui-window-body {
1585 box-shadow: 0 0 0.66em rgba
(0, 0, 0, 0.25);
1587 .oo-ui-messageDialog-actions-horizontal {
1589 table-layout: fixed
;
1592 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
1593 display: table-cell
;
1596 .oo-ui-messageDialog-actions-vertical {
1599 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
1602 text-overflow: ellipsis
;
1604 .oo-ui-messageDialog-actions .oo-ui-actionWidget {
1608 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-buttonElement-button {
1611 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labelElement-label {
1616 white-space: nowrap
;
1618 .oo-ui-messageDialog-content .oo-ui-window-body {
1619 box-shadow: 0 0 0.33em rgba
(0, 0, 0, 0.33);
1621 .oo-ui-messageDialog-title
,
1622 .oo-ui-messageDialog-message {
1627 .oo-ui-messageDialog-title {
1632 .oo-ui-messageDialog-message {
1634 line-height: 1.25em;
1637 .oo-ui-messageDialog-message-verbose {
1642 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
1643 border-left: solid
1px #e5e5e5;
1645 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child {
1646 border-left-width: 0;
1648 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
1649 border-bottom: solid
1px #e5e5e5;
1651 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child {
1652 border-bottom-width: 0;
1654 .oo-ui-messageDialog-actions .oo-ui-actionWidget .oo-ui-labelElement-label {
1659 .oo-ui-messageDialog-actions .oo-ui-actionWidget:hover {
1660 background-color: rgba
(0, 0, 0, 0.05);
1662 .oo-ui-messageDialog-actions .oo-ui-actionWidget:active {
1663 background-color: rgba
(0, 0, 0, 0.1);
1665 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-primary:hover {
1666 background-color: rgba
(8, 126, 204, 0.05);
1668 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-primary:active {
1669 background-color: rgba
(8, 126, 204, 0.1);
1671 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-primary .oo-ui-labelElement-label {
1674 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-constructive:hover {
1675 background-color: rgba
(118, 171, 54, 0.05);
1677 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-constructive:active {
1678 background-color: rgba
(118, 171, 54, 0.1);
1680 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-destructive:hover {
1681 background-color: rgba
(212, 83, 83, 0.05);
1683 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-flaggedElement-destructive:active {
1684 background-color: rgba
(212, 83, 83, 0.1);
1686 .oo-ui-processDialog-location {
1688 text-overflow: ellipsis
;
1689 white-space: nowrap
;
1691 .oo-ui-processDialog-title {
1695 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
,
1696 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
,
1697 .oo-ui-processDialog-actions-other .oo-ui-actionWidget {
1698 white-space: nowrap
;
1700 .oo-ui-processDialog-actions-safe
,
1701 .oo-ui-processDialog-actions-primary {
1706 .oo-ui-processDialog-actions-safe {
1709 .oo-ui-processDialog-actions-primary {
1712 .oo-ui-processDialog-errors {
1723 .oo-ui-processDialog-content .oo-ui-window-head {
1726 .oo-ui-processDialog-content .oo-ui-window-body {
1728 box-shadow: 0 0 0.33em rgba
(0, 0, 0, 0.33);
1730 .oo-ui-processDialog-navigation {
1735 .oo-ui-processDialog-location {
1741 .oo-ui-processDialog-title {
1745 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-button
,
1746 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-button
,
1747 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-buttonElement-button {
1748 padding-top: 0.75em;
1749 padding-bottom: 0.75em;
1753 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-labelElement-label
,
1754 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-labelElement-label
,
1755 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-labelElement-label {
1759 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-iconElement-icon
,
1760 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-iconElement-icon
,
1761 .oo-ui-processDialog-actions-other .oo-ui-actionWidget .oo-ui-iconElement-icon {
1763 margin-top: -0.125em;
1765 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
,
1766 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
,
1767 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-framed {
1768 margin: 0.75em 0.75em 0.75em 0;
1770 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
.oo-ui-buttonElement-button
,
1771 .oo-ui-processDialog-actions-primary
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
.oo-ui-buttonElement-button
,
1772 .oo-ui-processDialog-actions-other .oo-ui-actionWidget.oo-ui-buttonElement-framed .oo-ui-buttonElement-button {
1774 vertical-align: middle
;
1776 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget:hover
,
1777 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:hover {
1778 background-color: rgba
(0, 0, 0, 0.05);
1780 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget:active
,
1781 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget:active {
1782 background-color: rgba
(0, 0, 0, 0.1);
1784 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
,
1785 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-framed {
1788 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-buttonElement-framed
.oo-ui-buttonElement-button
,
1789 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-buttonElement-framed .oo-ui-buttonElement-button {
1790 /* Adjust for border so text aligns with title */
1793 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-primary:hover
,
1794 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-primary:hover {
1795 background-color: rgba
(8, 126, 204, 0.05);
1797 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-primary:active
,
1798 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-primary:active {
1799 background-color: rgba
(8, 126, 204, 0.1);
1801 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-primary
.oo-ui-labelElement-label
,
1802 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-primary .oo-ui-labelElement-label {
1805 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-constructive:hover
,
1806 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-constructive:hover {
1807 background-color: rgba
(118, 171, 54, 0.05);
1809 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-constructive:active
,
1810 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-constructive:active {
1811 background-color: rgba
(118, 171, 54, 0.1);
1813 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-destructive:hover
,
1814 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-destructive:hover {
1815 background-color: rgba
(212, 83, 83, 0.05);
1817 .oo-ui-processDialog-actions-safe
.oo-ui-actionWidget
.oo-ui-flaggedElement-destructive:active
,
1818 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-flaggedElement-destructive:active {
1819 background-color: rgba
(212, 83, 83, 0.1);
1821 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconElement .oo-ui-iconElement-icon {
1824 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget.oo-ui-iconElement .oo-ui-labelElement-label {
1825 padding-right: 2.25em;
1827 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconElement .oo-ui-iconElement-icon {
1830 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget.oo-ui-iconElement .oo-ui-labelElement-label {
1831 padding-left: 2.25em;
1833 .oo-ui-processDialog > .oo-ui-window-frame {
1836 .oo-ui-processDialog-errors {
1837 background-color: rgba
(255, 255, 255, 0.9);
1838 padding: 3em 3em 1.5em 3em;
1841 .oo-ui-processDialog-errors .oo-ui-buttonWidget {
1842 margin: 2em 1em 2em 1em;
1844 .oo-ui-processDialog-errors-title {
1849 .oo-ui-processDialog-error {
1853 border: solid
1px #ff9e9e;
1854 background-color: #fff7f7;
1855 border-radius: 0.25em;
1857 .oo-ui-windowManager-modal > .oo-ui-dialog {
1863 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup {
1872 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame {
1881 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup > .oo-ui-window-frame > iframe {
1885 .oo-ui-windowManager-fullscreen > .oo-ui-dialog > .oo-ui-window-frame {
1891 .oo-ui-windowManager-modal > .oo-ui-dialog {
1892 background-color: rgba
(255, 255, 255, 0.5);
1894 -webkit-transition: opacity
250ms ease-in-out
;
1895 -moz-transition: opacity
250ms ease-in-out
;
1896 -ms-transition: opacity
250ms ease-in-out
;
1897 -o-transition: opacity
250ms ease-in-out
;
1898 transition: opacity
250ms ease-in-out
;
1900 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
1903 background-color: #fff;
1904 -webkit-transform: scale
(0.5);
1905 -moz-transform: scale
(0.5);
1906 -ms-transform: scale
(0.5);
1907 -o-transform: scale
(0.5);
1908 transform: scale
(0.5);
1909 -webkit-transition: all
250ms ease-in-out
;
1910 -moz-transition: all
250ms ease-in-out
;
1911 -ms-transition: all
250ms ease-in-out
;
1912 -o-transition: all
250ms ease-in-out
;
1913 transition: all
250ms ease-in-out
;
1915 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready {
1918 .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-ready > .oo-ui-window-frame {
1919 -webkit-transform: scale
(1);
1920 -moz-transform: scale
(1);
1921 -ms-transform: scale
(1);
1922 -o-transform: scale
(1);
1923 transform: scale
(1);
1925 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
1926 border: solid
1px #ccc;
1927 border-radius: 0.5em;
1928 box-shadow: 0 0.2em 1em rgba
(0, 0, 0, 0.3);