mediawiki-skins-MinervaNeue/skinStyles/mobile.special.styles/minerva.less
Volker E dd154b4ea7 styles: Replace deprecated breakpoints
The values have slightly changed:
- Tablet breakpoint is decreased by 80px,
  pushing lesser devices into a mobile only experience but
  should make barely a difference to vast majority of our users.
- Biggest difference is in `min-width-breakpoint-desktop`,
  which is increased by 120px in comparison to
  `@width-breakpoint-desktop: 1000px`

Also removing one out-dated feature phone clause.

TECHNICAL CHANGES:
* The previous breakpoint was tied to the maximum content width.
The previous maximum content width is preserved, and several media
queries are adjusted to make use of it.
* The header (logo) is not optimized for  640px-720px. For now
a temporary fix is but in place which will be investigated as part
of T366859

VISUAL CHANGES:
* 6 visual changes which improve alignment in language and
visual editor overlay and diffs (where wikidiff2 is not
installed)

Bug: T349793
Depends-On: I3afba8c51f60de9271054499bfa3ffbcc1a9d779
Change-Id: I9552d8ad7509aae90e15edda26e786465773d3ac
2024-06-07 12:52:39 -07:00

162 lines
2.7 KiB
Plaintext

// stylelint-disable selector-max-id
@import '../../minerva.less/minerva.variables.less';
@import '../../minerva.less/minerva.mixins.less';
@import 'mediawiki.mixins.less';
.ns-special {
.mw-body .mw-first-heading {
font-size: 1.5em;
font-weight: bold;
}
.heading-holder {
padding-top: 26px;
// prevents margin collapsing. i.e. makes .heading-holder height match
// the bottom margin on .page-header, a child element.
overflow: auto;
}
h1,
h2 {
// Important given we have no idea which rules special pages are enforcing
font-family: @font-family-base !important;
}
.content-header {
h1,
h2 {
text-align: center;
}
.mw-mf-user::before {
opacity: @opacity-icon-subtle;
}
}
}
// Used by MobileSpecialPageFeed.php in MobileFrontend
.truncated-text {
.text-overflow( @visible: false );
// FIXME: this works only in WebKit
&.multi-line {
white-space: normal;
display: -webkit-box;
-webkit-box-orient: vertical;
}
&.two-line {
-webkit-line-clamp: 2;
// fallback for non-WebKit
max-height: 2.6em;
}
}
/* Watchlist with AMC disabled */
html.mw-mf-amc-clientpref-0 body.mw-special-Watchlist {
#mw-content-subtitle {
margin: 0;
}
.watchlistDetails,
.mw-rcfilters-head,
.mw-fr-reviewlink,
.mw-rcfilters-spinner,
.mw-rcfilters-container {
display: none;
}
.mw-rcfilters-ui-changesListWrapperWidget {
border-top: 1px solid @border-color-subtle;
margin: 20px 0 0;
width: 100%;
max-width: none;
}
}
/* Hide edit raw watchlist and clear watchlist options for non-advanced logged in users */
html.mw-mf-amc-clientpref-0 {
body.mw-special-Watchlist,
body.mw-special-EditWatchlist {
/* Hide third and forth tabs */
#p-associated-pages .minerva__tab:nth-child( 3 ),
#p-associated-pages .minerva__tab:nth-child( 4 ) {
display: none;
}
}
}
body.mw-special-Newpages {
.mw-contributions-list {
padding: 0;
margin: 0;
li {
.changeslist-row();
}
}
.mw-index-pager-list-header {
.changeslist-header();
box-sizing: border-box;
}
.mw-newpages-pagename {
font-weight: bold;
}
.mw-newpages-time,
.mw-userlink,
.mw-newpages-pagename {
display: block;
}
.comment,
.mw-userlink,
.mw-usertoollinks {
float: left;
padding: 0;
}
.comment {
clear: both;
}
.mw-usertoollinks {
margin-left: 8px;
}
.mw-changeslist-date {
display: none;
}
.mw-changeslist-time {
display: inline-block;
}
}
.mw-mf-special-page {
#bodyContent.content {
max-width: none;
margin: 0;
width: auto;
ul {
list-style: none;
padding: 0;
}
// override core .content li rule
.page-header-bar li {
margin-bottom: 0;
}
.mw-mf-history-wrap-link {
@media all and ( min-width: @min-width-breakpoint-desktop ) {
margin: 0;
max-width: none;
}
}
}
}