Merge "Refactor ContributionsSpecialPage->contributionsSub to support markup overrides"
[mediawiki.git] / resources / src / mediawiki.special.apisandbox / apisandbox.less
blobc951893ee5660be69990fddc111aa1daaf902911
1 @import 'mediawiki.skin.variables.less';
2 @import 'mediawiki.mixins.less';
4 .mw-apisandbox-toolbar {
5         background: @background-color-base;
6         .position-sticky();
7         top: 0;
8         padding: 0.5em 0;
9         box-shadow: @box-shadow-drop-small;
10         text-align: right;
11         z-index: 1;
14 #mw-apisandbox-ui .mw-apisandbox-link {
15         display: none;
18 .mw-apisandbox-popup {
19         .oo-ui-popupWidget-body > .oo-ui-widget {
20                 vertical-align: middle;
21         }
23         /* So DateTimeInputWidget's calendar popup works... */
24         .oo-ui-popupWidget-popup,
25         .oo-ui-popupWidget-body {
26                 overflow: visible;
27         }
29         /* Display contents of the popup on a single line */
30         & > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body {
31                 display: table;
32         }
34         & > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > * {
35                 display: table-cell;
36         }
38         & > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > .oo-ui-buttonWidget {
39                 padding-left: 0.5em;
40                 width: 1%;
41         }
43         &-help {
44                 min-width: 25em;
46                 .oo-ui-popupWidget-body-padded {
47                         // TODO: Upstream this fix (T266223)
48                         margin-top: 5px;
49                 }
50         }
53 .mw-apisandbox-help-field {
54         border-bottom: @border-subtle;
55         padding-bottom: 12px;
57         &:last-child {
58                 border-bottom: 0;
59         }
62 .mw-apisandbox-optionalWidget {
63         width: 100%;
65         &.oo-ui-widget-disabled {
66                 position: relative;
67                 z-index: 0; /* New stacking context to prevent the cover from leaking out */
68         }
70         &-cover {
71                 position: absolute;
72                 left: 0;
73                 right: 0;
74                 top: 0;
75                 bottom: 0;
76                 z-index: 2;
77                 cursor: pointer;
78         }
80         &-fields {
81                 display: table;
82                 width: 100%;
83         }
85         &-widget,
86         &-checkbox {
87                 display: table-cell;
88                 vertical-align: middle;
89         }
91         &-checkbox {
92                 width: 1%; /* Will be expanded by content */
93                 white-space: nowrap;
94                 padding-left: 0.5em;
95         }
98 .mw-apisandbox-textInputCode .oo-ui-inputWidget-input {
99         font-family: monospace, monospace;
100         font-size: 0.8125em;
101         -moz-tab-size: 4;
102         tab-size: 4;
105 .mw-apisandbox-help-field,
106 .mw-apisandbox-widget-field {
107         max-width: 70em;
110 .mw-apisandbox-widget-field {
111         .oo-ui-textInputWidget {
112                 /* Leave at least enough space for icon, indicator, and a sliver of text */
113                 min-width: 6em;
114         }
116         &.oo-ui-labelElement.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body {
117                 & > .oo-ui-fieldLayout-header {
118                         width: 30%;
119                 }
121                 & > .oo-ui-fieldLayout-field {
122                         width: 70%;
123                 }
124         }
127 /* stylelint-disable selector-class-pattern */
128 .apihelp-deprecated,
129 .apihelp-internal {
130         font-weight: bold;
131         color: @color-error;
133 /* stylelint-enable selector-class-pattern */
135 .mw-apisandbox-deprecated-value .oo-ui-labelElement-label {
136         text-decoration: line-through;
139 .oo-ui-menuOptionWidget .mw-apisandbox-flag {
140         line-height: 1.42857143em;
141         color: @color-subtle;
142         float: right;