wikimedia/mediawiki-skins-MinervaNeue
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue synced 2024-12-01 01:06:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

page actions is no longer position absolute

Browse source 
This was causing lots of problems with the AMC design and seems
unnecessary. It dates back to tablet support added in
I14c8182473c9508ffc38a8d5baf114bcb016a35f in 2014. This no longer
appears to be needed for tablet.

Changing the HTML means we need to be careful about Varnish cached
HTML with new styles. To avoid UI regressions we use a new temporary
class heading-holding--new which will be removed as soon as possible.
The no-page-actions modifier is no longer needed given the new heading
holder doesn't care what's inside it.

Bug: T212216
Change-Id: I7e989a3d4553eb3357598a5cad3ccebf51dc9fae
This commit is contained in:
jdlrobson 2019-02-07 12:02:18 -08:00
parent 63e52a302a
commit 95b139d756
2 changed files with 24 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
includes/skins/minerva.mustache
View file

@ -28,12 +28,12 @@
<main id="content" class="mw-body"> <main id="content" class="mw-body">
{{#hasheadingholder}} {{#hasheadingholder}}
{{{prebodyhtml}}} {{{prebodyhtml}}}
<div class="pre-content heading-holder {{^haspageactions}}heading-holder--no-page-actions{{/haspageactions}}"> <div class="pre-content heading-holder heading-holder--new">
{{{pageactionshtml}}}
{{{headinghtml}}} {{{headinghtml}}}
{{{taglinehtml}}} {{{taglinehtml}}}
{{{postheadinghtml}}} {{{postheadinghtml}}}
{{{subtitle}}} {{{subtitle}}}
{{{pageactionshtml}}}
{{{internalBanner}}} {{{internalBanner}}}
</div> </div>
{{/hasheadingholder}} {{/hasheadingholder}}

25
resources/skins.minerva.base.styles/pageactions.less
View file

@ -4,17 +4,30 @@
.heading-holder { .heading-holder {
@pageActionsGutter: 0.5em; @pageActionsGutter: 0.5em;
@pageActionsHeight: @pageActionFontSize + (2 * @iconGutterWidth); @pageActionsHeight: @pageActionFontSize + (2 * @iconGutterWidth);
// FIXME: padding-bottom can be removed when work on T212216
// has been deployed and varnish cache cleared.
padding: @titleSectionSpacingTop 0 (@pageActionsHeight + @pageActionsGutter); padding: @titleSectionSpacingTop 0 (@pageActionsHeight + @pageActionsGutter);
position: relative; position: relative;
// FIXME: Can be made default when work on T212216
// has been deployed and varnish cache cleared.
&--new {
padding-bottom: 0;
}
// FIXME: Can be removed when work on T212216
// has been deployed and varnish cache cleared.
&--no-page-actions { &--no-page-actions {
padding-bottom: @pageActionsGutter; padding-bottom: @pageActionsGutter;
&--new {
padding-bottom: 0;
}
} }
.tagline { .tagline {
color: @colorGray5; color: @colorGray5;
font-size: 0.85em; font-size: 0.85em;
margin: 2px 0 0; margin: 2px 0 12px;
} }
} }
@ -29,9 +42,8 @@
float: none; float: none;
border: 0; border: 0;
overflow: hidden; overflow: hidden;
position: absolute;
bottom: 0;
width: 100%; width: 100%;
margin-top: -2px;
border-top: 1px solid @colorGray14; border-top: 1px solid @colorGray14;
border-bottom: 1px solid @colorGray12; border-bottom: 1px solid @colorGray12;
padding: 0.5em 0; padding: 0.5em 0;
@ -78,6 +90,13 @@
} }
} }
// FIXME: cached HTML. Can be removed when work on T212216
// has been deployed and varnish cache cleared.
.heading-holder #page-actions:first-child {
position: absolute;
bottom: 0;
}
// Watchstar is hidden for anonymous no-js users // Watchstar is hidden for anonymous no-js users
// While we could link the icon to the login/signup form, this is not // While we could link the icon to the login/signup form, this is not
// a perfect experience and could be confusing. // a perfect experience and could be confusing.