mediawiki-skins-MinervaNeue/resources/skins.minerva.newusers/PointerOverlay.less

94 lines
1.8 KiB
Plaintext
Raw Normal View History

@import 'minerva.variables';
@colorTutorial: #2e76ff;
@media all and ( min-width: @width-breakpoint-tablet ) {
// 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: @width-breakpoint-desktop;
}
}
.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;
}
}
}