Moves main content to the top, so the header with dropdown menus lands above footer.
/* ==UserStyle==
@name MDN: Content first (Header to Footer)
@description Moves main content to the top, so the header with dropdown menus lands above footer.
@namespace myfonj
@version 1.0.1
@license CC0 - Public Domain
==/UserStyle== */
@-moz-document domain("developer.mozilla.org") {
/*
https://greasyfork.org/en/scripts/409087/versions/new
body
div#react-container[data-component-name="SPA"]
..
ul#nav-access
header
main[role="main"]
footer
*/
body > #react-container {
display: flex;
flex-direction: column;
}
body > #react-container > main {
order: -1;
}
body > #react-container > header {
border-top: 2px solid #3d7e9a
}
/*
compact Edit button
<div class="titlebar">
<h1 class="title">..</h1>
<a class="button neutral" href="https://wiki.developer.mozilla.org/.." rel="nofollow">
<svg class="icon icon-pencil" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 26" aria-hidden="true">
<path d="..">
</path>
</svg>
Edit in wiki
</a>
</div>
*/
h1.title + .button {
min-height: auto;
padding: 0.5rem
}
h1.title + .button > svg {
float: right;
margin-left: 0.5rem;
}
h1.title + .button:not(:hover):not(:focus) {
color: transparent;
background-color: transparent;
border-color: transparent;
}
h1.title + .button:not(:hover):not(:focus) > svg {
color: black;
margin-left: 0.0rem;
}
}