MediaWiki:Gadget-headanchor.css
From BIONICLEsector01
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/*!
* Vector HeadAnchors gadget, from <https://mediawiki.org/wiki/MediaWiki:Gadget-vector-headanchor.js>
*
* Copyright 2013 Timo Tijhof
* @license MIT <https://opensource.org/licenses/MIT>
*/
/* Revision as of 2021-10-11 */
/* Edited for BS01 by Morris the Mata Nui Cow */
.tpl-headanchor::before {
content: '§';
}
/*
Allow the section links to appear to the left of the headers even though they fall outside
the headers' box
*/
#content,
.tpl-headanchor-heading {
overflow: visible;
}
.tpl-headanchor {
display: inline-block;
text-align: center;
/* use opacity: 0; instead of display: none; so .tpl-headanchor is included in the width
of .tpl-headanchor-heading, meaning hovering over the (invisible) .tpl-headanchor will
trigger the :hover rule below and cause the .tpl-headanchor to appear */
opacity: 0;
/*
In Refreshed,
#content-wrapper has the same font size as the root and a padding-left of 1em,
so a margin-left of -1rem will undo that padding and place the section link flush against the
left side of #content-wrapper.
In Vector, the analogous padding-left is not quite the same as 1em, but this effect still looks
good, so there's no need to change it.
*/
margin-left: -1rem;
width: 1rem;
}
.tpl-headanchor-heading:hover .tpl-headanchor {
opacity: initial;
}
.tpl-headanchor:hover {
text-decoration: none;
}
/*
Don't show the link on a header with the .no-headanchor class
(or on a header that's inside some wrapper element with the class)
*/
.no-headanchor .tpl-headanchor {
display: none;
}