MediaWiki:Gadget-Tab.css

/*Copied from http://www.barelyfitz.com/projects/tabber/example.css used under mit license see http://www.barelyfitz.com/projects/tabber/ /* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*-- REQUIRED to hide the non-active tab content. But do not hide them in the print stylesheet! --*/ .tabberlive .tabbertabhide { display:none; }

/*-- .tabber = before the tabber interface is set up .tabberlive = after the tabber interface is set up --*/

.tabberlive { margin-top:10px; margin-left:15px; margin-bottom:15px; }

/*-- ul.tabbernav = the tab navigation list li.tabberactive = the active tab --*/ ul.tabbernav { margin:0; padding: 13px 0; font: bold 12px Roboto, sans-serif; display:flex; flex-direction:row; justify-content:center; }

ul.tabbernav .tabberactive{ z-index:99; }

ul.tabbernav li { list-style: none; display: inline-block !important; z-index:1; }

ul.tabbernav li:hover{ z-index:100; }

ul.tabbernav li a { padding:7px; text-decoration:none; transition:0.1s ease-in-out; color:#000000; }

ul.tabbernav li a:hover, ul.tabbernav li.tabberactive a:hover { color:#0066FF; border-bottom: 2px inset #0066FF; }

ul.tabbernav li.tabberactive a { border-bottom: 2px inset #06305B; color:#06305B; }

/*-- .tabbertab = the tab content Add style only after the tabber interface is set up (.tabberlive) --*/ .tabbertab { display:flex; justify-content:center; animation: fadeEffect 1s; -webkit-animation: fadeEffect 1s; } .tabberlive .tabbertab { padding:5px; border:1px solid #ccc; border-top:0; border-left:none; border-right:none; border-bottom:none; box-shadow:0 0 4px 0 rgba(0,0,0,0.25);

/* If you don't want the tab size changing whenever a tab is changed you can set a fixed height */ /* height:200px; */

/* If you set a fix height set overflow to auto and you will get a scrollbar when necessary */ /* overflow:auto; */ }

/* If desired, hide the heading since a heading is provided by the tab */ .tabberlive .tabbertab h2 { display:none; } .tabberlive .tabbertab h3 { display:none; }