resources/mobile.init.styles/main.less
@import 'mediawiki.skin.variables.less';
@import 'mobile.less';
@import 'icons.less';
@selector-parsoid-top-heading: ~'.mw-parser-output[data-mw-parsoid-version] > section > .mw-heading';
.client-js {
/* For Parsoid HTML hide the div until the hidden attribute has been added. */
/* .mw-parser-output > section limits this to top level headings */
&.mf-expand-sections-clientpref-0 @{selector-parsoid-top-heading} + div:not( .mf-collapsible-content ),
.collapsible-block:not( .collapsible-block-js ) {
@media all and ( max-width: @max-width-breakpoint-tablet ) {
display: none;
}
}
@{selector-parsoid-top-heading}:not( .mf-collapsible-heading ) {
padding-left: 22px;
}
@{selector-parsoid-top-heading} {
cursor: pointer;
border-bottom: @border-width-base @border-style-base @border-color-muted;
h1,
h2,
h3,
h4,
h5,
h6 {
display: flex;
align-items: center;
}
.mf-collapsible-icon {
margin-right: 6px;
}
}
}
.mf-icon--small {
.cdx-mixin-css-icon-background( @size-icon-small );
.cdx-mixin-css-icon-size( @size-icon-small );
// Temporary fix for https://phabricator.wikimedia.org/T356540
background-size: ~'calc( max( @{size-icon-small}, @{min-size-icon-small} ) )';
}
// FIXME: For legacy parser, can be removed when Parsoid is everywhere.
/* stylelint-disable no-duplicate-selectors */
.client-js {
.collapsible-block:not( .collapsible-block-js ) {
display: none;
// But show it for tablets.
@media all and ( min-width: @min-width-breakpoint-tablet ) {
display: block;
}
}
// For expand all sections client preference:
&.mf-expand-sections-clientpref-1 {
.collapsible-block:not( .collapsible-block-js ) {
display: block;
}
}
.section-heading {
align-items: center;
}
}
// FIXME: For legacy parser, can be removed when Parsoid is everywhere.
.section-heading .indicator {
margin-right: 6px;
}
// FIXME: For legacy parser, can be removed when Parsoid is everywhere.
.client-nojs {
// Toggling indicators are unusable without JavaScript
.section-heading .indicator {
display: none;
}
}
// START FOOTER RULES
// Historically, MobileFrontend has modified the mobile footer
// to limit the amount of items in it.
// This was previously done in the now deprecated SkinTemplateOutputPageBeforeExec
// We can remove these rules as soon as we've talked this through with a
// designer and product manager.
// Rule is overly specific to counter .hlist style
ul.footer-info li,
ul.footer-places li {
display: none;
}
/* stylelint-disable-next-line selector-max-id */
#footer-places-terms-use {
float: left;
}
// Historically we've limited places on mobile
// to terms-use, desktop toggle and privacy links
/* stylelint-disable-next-line selector-max-id */
#footer-places-terms-use,
#footer-places-desktop-toggle,
#footer-places-privacy {
display: inline-block;
}
/* stylelint-disable-next-line selector-max-id */
#footer-places-desktop-toggle::after {
content: '' !important;
}
// END FOOTER RULES