mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor
synced 2024-12-11 22:16:15 +00:00
647b5aa8e9
This line was added as part of I0229b63. While what the comment says is still true to some degree, the line stopped being helpful when we introduced sticky headers. When scrolling the sidebar for a multi-part template with many parameters the sticky header jumps up and down by this 1 pixel. TL;DR: This is one of these hacks where it's better to remove it and look for a better solution when we notice the original issue again. Bug: T312768 Change-Id: I2fedea4e1d4d6c95c74a63c522821a6ebc2ee2b2
178 lines
3.8 KiB
Plaintext
178 lines
3.8 KiB
Plaintext
@import 'mediawiki.mixins.less';
|
|
|
|
// Copied from wikimedia-ui-base.less
|
|
@wmui-color-accent50: #36c;
|
|
@wmui-color-accent90: #eaf3ff;
|
|
@color-base--subtle: #72777d;
|
|
|
|
@selected-text-color: @wmui-color-accent50;
|
|
@selected-background: @wmui-color-accent90;
|
|
|
|
// This shade on a white background results in #eaecf0 a.k.a. @background-color-base--hover a.k.a.
|
|
// @wmui-color-base80
|
|
@hover-shading: rgba( 0, 24, 73, 0.082 );
|
|
|
|
@on-click-text-color: @wmui-color-accent50;
|
|
// Same as .oo-ui-optionWidget-pressed, a.k.a. @background-color-primary--hover
|
|
@on-click-shading: rgba( 41, 98, 204, 0.1 );
|
|
|
|
.ve-ui-mwTransclusionOutlineWidget {
|
|
.ve-ui-mwTransclusionOutline-ariaHidden {
|
|
display: none;
|
|
}
|
|
|
|
.ve-ui-mwTransclusionOutlinePartWidget {
|
|
margin-top: 24px;
|
|
margin-bottom: 24px;
|
|
|
|
&:first-child .ve-ui-mwTransclusionOutlineButtonWidget {
|
|
margin-top: -24px;
|
|
}
|
|
|
|
/* no margin for labels and wikitext */
|
|
&:last-child {
|
|
margin-bottom: -24px;
|
|
|
|
/* margin for last text */
|
|
.ve-ui-mwTransclusionOutlineTemplateWidget-no-template-parameters {
|
|
margin-bottom: 48px;
|
|
}
|
|
|
|
/* margin for last checkbox in the sidebar */
|
|
.ve-ui-mwTransclusionOutlineParameterWidget:last-child {
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
|
|
.ve-ui-mwTransclusionOutlineButtonWidget {
|
|
display: block;
|
|
margin-top: -10px;
|
|
|
|
&:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
> .oo-ui-buttonElement-button {
|
|
display: block;
|
|
overflow: hidden;
|
|
padding: 8px 0 8px 36px;
|
|
text-overflow: ellipsis;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
background-color: @hover-shading;
|
|
}
|
|
|
|
/* click */
|
|
&:active {
|
|
background-color: @on-click-shading;
|
|
color: @on-click-text-color;
|
|
}
|
|
|
|
> .oo-ui-iconElement-icon {
|
|
left: 10px;
|
|
}
|
|
}
|
|
|
|
/* selected */
|
|
&.oo-ui-optionWidget-selected > .oo-ui-buttonElement-button {
|
|
background-color: @selected-background;
|
|
|
|
&:hover {
|
|
background-color: @selected-background;
|
|
color: @selected-text-color;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.ve-ui-mwTransclusionOutlineTemplateWidget {
|
|
&-sticky {
|
|
background-color: #fff;
|
|
.position-sticky();
|
|
top: 0;
|
|
z-index: 1;
|
|
}
|
|
|
|
&-no-template-parameters {
|
|
font-style: italic;
|
|
color: @color-base--subtle;
|
|
margin: 8px 24px 24px 24px;
|
|
}
|
|
|
|
&-searchWidget {
|
|
margin: 8px 24px;
|
|
width: auto;
|
|
|
|
&:last-child {
|
|
/* Workaround to override oo-ui-inputWidget:last-child rule */
|
|
margin-right: 24px;
|
|
}
|
|
}
|
|
|
|
&-no-match {
|
|
font-style: italic;
|
|
color: @color-base--subtle;
|
|
margin: 8px 24px;
|
|
}
|
|
|
|
.ve-ui-mwTransclusionOutlineToggleUnusedWidget {
|
|
margin: -4px 24px 0 24px;
|
|
|
|
.oo-ui-labelElement-label {
|
|
word-break: break-word;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
white-space: normal;
|
|
}
|
|
}
|
|
|
|
.ve-ui-mwTransclusionOutlineParameterSelectWidget:focus {
|
|
border-radius: 2px;
|
|
box-shadow: inset 0 0 0 1px @wmui-color-accent50;
|
|
outline: 0;
|
|
}
|
|
|
|
.ve-ui-mwTransclusionOutlineParameterWidget {
|
|
overflow: hidden;
|
|
padding-bottom: 8px;
|
|
padding-left: 30px;
|
|
padding-top: 8px;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
|
|
/* click */
|
|
&:active {
|
|
background-color: @on-click-shading;
|
|
color: @on-click-text-color;
|
|
}
|
|
|
|
&.ve-ui-mwTransclusionOutlineParameterWidget-isSet,
|
|
&.ve-ui-mwTransclusionOutlineParameterWidget-isSet:hover,
|
|
&.ve-ui-mwTransclusionOutlineParameterWidget-isSet.oo-ui-optionWidget-highlighted {
|
|
background-color: @selected-background;
|
|
color: @selected-text-color;
|
|
}
|
|
|
|
&.oo-ui-optionWidget-highlighted {
|
|
background-color: @hover-shading;
|
|
color: #000;
|
|
}
|
|
|
|
&-hasValue {
|
|
font-weight: bold;
|
|
}
|
|
|
|
> .oo-ui-labelElement-label {
|
|
cursor: pointer;
|
|
display: inline;
|
|
}
|
|
|
|
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:hover + span {
|
|
/* Stronger :hover effect to make the different checkbox/label click regions more obvious */
|
|
border-width: 2px;
|
|
}
|
|
}
|
|
}
|