1d395d4966
For interlanguage toggle, interlanguage position is no longer assumed to be a left sidebar, and is determined on the fly in order to appear correctly regardless of where it is, and not go off the side of the page. This works across most skins, and regardless of language directionality. Does not necessarily resolve issues with interlanguage links appearing in the middle of the page (header/footer), or the callout just plain not fitting for other reasons (mobile devices). bug: T161586 Change-Id: Icd55498a945e12c0ff79ba891c094d60ce791115
111 lines
2.3 KiB
Plaintext
111 lines
2.3 KiB
Plaintext
/* Overrides to follow MediaWiki style */
|
|
.uls-menu {
|
|
border-radius: 4px;
|
|
/* Ensure base font size is same in different skins */
|
|
font-size: medium;
|
|
}
|
|
|
|
.uls-search,
|
|
.uls-language-settings-close-block {
|
|
border-top-right-radius: 4px;
|
|
border-top-left-radius: 4px;
|
|
}
|
|
|
|
.uls-language-list {
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
}
|
|
|
|
/* Caret */
|
|
.uls-menu.callout .caret-before,
|
|
.uls-menu.callout .caret-after {
|
|
border-top: 10px solid transparent;
|
|
border-bottom: 10px solid transparent;
|
|
display: inline-block;
|
|
/* 17px aligns nicely with the size of the search row in language selection */
|
|
top: 17px;
|
|
position: absolute;
|
|
}
|
|
.uls-menu.callout .caret-after {
|
|
display: inline-block;
|
|
}
|
|
|
|
// How do you do switch for flipping in less? These are very redundant.
|
|
.uls-menu.callout .caret-right {
|
|
.caret-before,
|
|
.caret-after {
|
|
/* @noflip */
|
|
border-left: 10px solid #c9c9c9;
|
|
/* @noflip */
|
|
right: -11px;
|
|
}
|
|
|
|
.caret-after {
|
|
/* @noflip */
|
|
border-left: 10px solid #fcfcfc;
|
|
/* @noflip */
|
|
right: -10px;
|
|
}
|
|
|
|
}
|
|
.uls-menu.callout--languageselection .caret-right .caret-after {
|
|
/* @noflip */
|
|
border-left: 10px solid #fff;
|
|
}
|
|
|
|
.uls-menu.callout .caret-left {
|
|
.caret-before,
|
|
.caret-after {
|
|
/* @noflip */
|
|
border-right: 10px solid #c9c9c9;
|
|
/* @noflip */
|
|
left: -11px;
|
|
}
|
|
|
|
.caret-after {
|
|
/* @noflip */
|
|
border-right: 10px solid #fcfcfc;
|
|
/* @noflip */
|
|
left: -10px;
|
|
}
|
|
|
|
}
|
|
.uls-menu.callout--languageselection .caret-left .caret-after {
|
|
/* @noflip */
|
|
border-right: 10px solid #fff;
|
|
}
|
|
|
|
.uls-ui-languages button {
|
|
margin: 5px 15px 5px 0;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.uls-search-wrapper-wrapper {
|
|
position: relative;
|
|
padding-left: 40px;
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.uls-icon-back {
|
|
background: transparent url( ../images/back-grey-ltr.png ) no-repeat scroll center center;
|
|
background-image: -webkit-linear-gradient( transparent, transparent ), url( ../images/back-grey-ltr.svg );
|
|
/* @embed */
|
|
background-image: linear-gradient( transparent, transparent ), url( ../images/back-grey-ltr.svg );
|
|
background-size: 28px;
|
|
background-position: center center;
|
|
height: 32px;
|
|
width: 40px;
|
|
display: block;
|
|
position: absolute;
|
|
left: 0;
|
|
border-right: 1px solid #c9c9c9;
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.uls-icon-back:hover {
|
|
opacity: 1;
|
|
cursor: pointer;
|
|
}
|