mediawiki-skins-MinervaNeue/skinStyles/mobile.pointerOverlay/minerva.less
jdlrobson 2cc9516cde Minerva is its own skin
This is programmatic output from python3 scripts/migrate.py

This will result in a Minerva skin dependent on MobileFrontend.

Post merge we will rename message keys to have minerva- prefix

Bug: T166748
Change-Id: Iff1f7e63e796cc5d4a6d2ab0370e0c33248d2fce
2017-07-12 08:12:40 -07:00

92 lines
1.8 KiB
Plaintext

@import 'minerva.variables';
@media all and ( min-width: @deviceWidthTablet ) {
// Take into account padding in width of pointer overlay so that it
// can point to anything in the containing content area and avoid
// padding issues such as https://phabricator.wikimedia.org/F287611
#mw-mf-page-center .pointer-overlay {
max-width: @wgMFDeviceWidthDesktop;
}
}
.pointer-overlay {
width: auto;
position: absolute;
top: 0;
left: 0;
right: 0;
line-height: 1.4;
font-size: 0.9em;
text-align: center;
border-radius: @borderRadius;
margin-top: 10px;
color: #fff;
padding: 1em 16px;
p {
line-height: 1.4;
margin: 0 0 1em;
text-align: left;
}
.button {
// FIXME: without this the cloaked input seems to interfere making cancel button start upload
position: relative;
padding: 12px;
font-weight: bold;
width: auto;
}
// Generic pointer definition
.tutorial-pointer {
position: absolute;
border-right: 6px solid transparent;
border-left: 6px solid transparent;
border-bottom: 6px solid transparent;
}
&.pointer-overlay-tutorial {
background: @colorTutorial;
box-shadow: none;
// Pointer color nested so it may be changed in other tutorials
.tutorial-pointer {
border-bottom-color: @colorTutorial;
}
.button {
// use background to override gradient in other buttons
background: #fff;
border-radius: @borderRadius;
color: @colorTutorial;
padding: 6px;
}
.cancel.inline {
background: none;
color: #fff;
}
.button-bar {
text-align: right;
}
}
&.pointer-overlay-compact {
background: @colorGray2;
width: auto;
/* @noflip */
right: auto;
padding: 0.6em;
// Pointer color nested so it may be changed in other tutorials
.tutorial-pointer {
border-bottom-color: @colorGray2;
}
p {
margin: 0;
}
}
}