/**
* Stylesheet for Table Of Contents in Banners displayed by WikidataPageBanner extension. * All style rules have been applied with a prefix of wrapping .banner-toc, so cloning the original * toc and styling the clone will have no side-effects */
//@import "mediawiki.mixins"; // hide topbanner-toc by default .wpb-topbanner-toc {
display: none;
}
// style rules to apply only if screen wide enough for a horizontal toc @media screen and ( min-width: 768px ) {
.wpb-topbanner-toc { display: block; position: absolute; background: rgba(0, 0, 0, .5) none repeat scroll 0% 0%; bottom: 0; left: 0; z-index: 3; width: 100%; } .wpb-banner-toc { display: table; color: white; background: none; border: medium none; line-height: 1.6em; padding: .2em 2em; margin: 0; width: auto; // Suppress numbering of items in TOC .tocnumber { display: none; } >div>ul { list-style: none; margin: 0; background: rgba(0, 0, 0, .6) none repeat scroll 0% 0%; z-index: 4; } a, a:visited, a:active { display: block; color: white; font-size: .8em; font-weight: bold; } a:hover { color: #BDDDFD; } // these are actual toc items li { position: relative; padding: 0 .4em; margin: 0; >ul { list-style: none; margin: 0; background: rgba(0, 0, 0, .6) none repeat scroll 0% 0%; z-index: 4; } } // On hovering over a list item, show the list items which are immediate child of this item li:hover { &>ul>li { display: block; } // make hovered element prominent background: rgba(0, 0, 0, .8) none repeat scroll 0% 0%; } // Prevent display of subheadings in horizontal ToC .toclevel-2, .toclevel-3, .toclevel-4, .toclevel-5, .toclevel-6 { display: none; white-space: nowrap; .transition( all .5s ); } .toclevel-1 { float: left; // position immediate child list of level-1 items as vertical drop-downs &>ul { position: absolute; top: 100%; left: 0; } } .toclevel-2 { // make immediate children of lists of items beyond level-2 open as side lists ul { position: absolute; left: 100%; top: 0; } } // Hide TOC title #toctitle { display: none; } } // hide original toc by default .toc, #toc { display: none; }
}