mediawiki-skins-Vector/resources/skins.vector.styles/components/LanguageButton.less
Santhosh Thottingal 40f6c5e29d Show ULS button when article exist only in single language
When the article exist only in one language, currently we do not show
language selector. This prevents showing the entry points to create article
in other languages by various means.

Show the language selector so that options like translate, interlanguage
links, language settings can be shown.

Bug: T275147
Bug: T290436
Depends-On: I42c5d44ec15e291d71723c9738ddb8f0d1cf0b09
Change-Id: I7fb68457c1203d824fe7433c9f272f300a483c44
2022-07-21 16:28:22 -07:00

100 lines
2.7 KiB
Plaintext

// The use of mixins.buttons requires @font-size-base to be defined for this to work in Storybook
@import '../../common/variables.less';
@import 'mediawiki.mixins.less';
// Note vector-language-in-header-enabled class is not used here as that class
// only applies to main page.
// This must be limited to mw-body-header as the mw-portlet-lang class is shared with
// the language portlet that can display in the sidebar.
.mw-body-header .mw-portlet-lang {
// FIXME [review whether margin-top is needed] center vertically in heading.
margin-top: 2px;
box-sizing: border-box;
height: @height-lang-button;
.mw-ui-icon:before {
// Put icon on correct standard normal state color.
opacity: 0.87;
}
// If there are no languages and JavaScript is not enabled there is no fallback so we hide
// the button altogether.
.mw-portlet-lang-heading-0 {
.client-nojs & {
display: none;
}
}
.vector-menu-heading {
// Prevent select of span text "X languages"
user-select: none;
// Remove opacity on language button (it applies to more menu because of label color).
opacity: 1;
.vector-menu-heading-label {
// Special treatment for language button, based on Vector font-size
font-size: @font-size-base;
}
// T291286: Temporarily use progressive ULS style
&.mw-ui-progressive.mw-ui-quiet {
.mw-ui-icon:before {
// Ensure inverted language icon is white
opacity: 1;
}
&:after {
// Invert arrow color
background-image: url( ../common/images/arrow-down-progressive.svg );
opacity: 1;
}
}
}
input:active + .vector-menu-heading {
&.mw-ui-progressive.mw-ui-quiet {
.mw-ui-icon {
// stylelint-disable-next-line plugin/no-unsupported-browser-features
filter: brightness( 0 ) invert( 1 );
}
&:after {
background-image: url( ../common/images/arrow-down-invert.svg );
}
}
}
.vector-menu-content {
top: auto;
left: -@border-width-base;
right: -@border-width-base;
// align borders of open menu align with button
box-sizing: border-box;
max-height: 65vh;
overflow: auto;
// Adds to the show/hide technique in MenuDropdown.less with
// display to prevent rendering and long scrolling on Main page
display: none;
li a {
font-size: inherit;
}
}
.vector-menu-checkbox:checked ~ .vector-menu-content {
display: block;
}
.after-portlet {
// ensure there is a visual separation between the language links and additional links.
margin-top: 10px;
}
}
// Hides language button with CSS, ensures language button is in DOM for temporary JS hack for interwiki links
// Temporary solution to T287206, can be removed when ULS dialog includes interwiki links
#p-lang-btn.mw-portlet-empty {
display: none;
}