MediaWiki:Gadget-Tabber.css: Difference between revisions

From SmashWiki, the Super Smash Bros. wiki
Jump to navigationJump to search
No edit summary
mNo edit summary
 
(57 intermediate revisions by the same user not shown)
Line 2: Line 2:
   See: http://www.barelyfitz.com/projects/tabber/ */
   See: http://www.barelyfitz.com/projects/tabber/ */


.infobox .tabber {
.tabber {
width: 100%;
max-width: 100%;
vertical-align: top;
margin: 0;
}
}
.tabberlive .tabbertab .infobox,
.tabber.goleft {
.tabberlive .tabbertab table,
display: block;
.tabbertab .tabber {
margin: 0 1em 0.5em 0;
width: 100% !important;
float: none !important;
margin: 0 !important;
}
.tabbertab img {
max-width: 100% !important;
height: auto !important;
}
}
.tabber.goright {
.tabber.goright {
float: right;
display: block;
margin: 0 0 0.5em 1em;
margin: 0 0 0.5em 1em;
}
}
.tabber.goleft {
.infobox .tabber {
float: left;
min-width: 100%;
margin: 0 1em 0.5em 0;
}
}
.tabbertab {
.tabbertab {
float: none !important;
overflow: auto;
width: auto !important;
float: none !important;
width: auto !important;
}
.tabbertab > .tabber,
.mediawiki .tabbertab .infobox {
float: none !important;
width: auto !important;
max-width: none !important;
display: block !important;
margin: 0 !important;
}
.tabbertab .infobox tbody {
width: 100% !important;
display: table !important;
}
}
.tabbernav + p {
.tabbernav + p {
display: none;
display: none;
}
}
.tabber {
.tabber + br {
display: inline-block;
display: block;
}
}
/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */


/*--------------------------------------------------
/*--------------------------------------------------
Line 42: Line 47:
  --------------------------------------------------*/
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
.tabberlive .tabbertabhide {
display: none;
display: none;
}
}


Line 50: Line 55:
  --------------------------------------------------*/
  --------------------------------------------------*/
.tabbertab table {
.tabbertab table {
margin-top: 0;
float: none !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
}


Line 58: Line 65:
  --------------------------------------------------*/
  --------------------------------------------------*/
ul.tabbernav {
ul.tabbernav {
margin: 0;
display: flow-root;
padding: 3px 0;
font: bold 95% Verdana, sans-serif;
border-bottom: 1px solid #CCC;
border-bottom: 1px solid #ccc;
font: bold 12px Verdana, sans-serif;
padding: 3px 0;
margin: 0;
}
}


ul.tabbernav li {
ul.tabbernav li {
list-style: none;
list-style: none;
margin: 5px 0 0;
display: inline-block !important;
display: inline-block !important;
margin: 5px 0 0;
}
}


ul.tabbernav li a {
ul.tabbernav li a {
padding: 3px 0.5em;
color: #448;
margin-left: 3px;
background: #f2f7ff;
border: 1px solid #ccc;
border: 1px solid #ccc;
border-bottom: none;
text-decoration: none;
background: #f2f7ff;
padding: 3px 0.5em;
text-decoration: none;
margin-left: 3px;
}
ul.tabbernav li a:visited {
color: #667;
}
}
ul.tabbernav li a:link { color: #448; }
ul.tabbernav li a:visited { color: #667; }
ul.tabbernav li a:hover {
ul.tabbernav li a:hover {
color: #000;
background: #fff9f2;
background: #fff9f2;
border-color: #ccc;
}
}


ul.tabbernav li.tabberactive a {
ul.tabbernav li.tabberactive a {
background-color: #fff;
color: #000;
border-bottom: 1px solid #fff;
background: #fff;
}
border-bottom: 1px solid #fff;
 
cursor: default;
ul.tabbernav li.tabberactive a:hover {
color: #000;
background: #fff;
border-bottom: 1px solid #fff;
}
}


Line 104: Line 105:
  --------------------------------------------------*/
  --------------------------------------------------*/
.tabberlive .tabbertab {
.tabberlive .tabbertab {
padding: 5px;
background: #fff;
border: 1px solid #ccc;
border: 1px solid #ccc;
border-top: 0;
border-top: 0;
padding: 5px;
}
}

Latest revision as of 13:04, March 26, 2024

/* Copied from http://www.barelyfitz.com/projects/tabber/example.css and used under MIT license
   See: http://www.barelyfitz.com/projects/tabber/ */

.tabber {
	max-width: 100%;
	vertical-align: top;
	margin: 0;
}
.tabber.goleft {
	display: block;
	margin: 0 1em 0.5em 0;
}
.tabber.goright {
	display: block;
	margin: 0 0 0.5em 1em;
}
.infobox .tabber {
	min-width: 100%;
}
.tabbertab {
	overflow: auto;
	float: none !important;
	width: auto !important;
}
.tabbertab > .tabber,
.mediawiki .tabbertab .infobox {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	display: block !important;
	margin: 0 !important;
}
.tabbertab .infobox tbody {
	width: 100% !important;
	display: table !important;
}
.tabbernav + p {
	display: none;
}
.tabber + br {
	display: block;
}

/*--------------------------------------------------
 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
 --------------------------------------------------*/
.tabbertab table {
	float: none !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/*--------------------------------------------------
 ul.tabbernav = the tab navigation list
 li.tabberactive = the active tab
 --------------------------------------------------*/
ul.tabbernav {
	display: flow-root;
	font: bold 95% Verdana, sans-serif;
	border-bottom: 1px solid #ccc;
	padding: 3px 0;
	margin: 0;
}

ul.tabbernav li {
	list-style: none;
	display: inline-block !important;
	margin: 5px 0 0;
}

ul.tabbernav li a {
	color: #448;
	background: #f2f7ff;
	border: 1px solid #ccc;
	text-decoration: none;
	padding: 3px 0.5em;
	margin-left: 3px;
}
ul.tabbernav li a:visited {
	color: #667;
}
ul.tabbernav li a:hover {
	background: #fff9f2;
}

ul.tabbernav li.tabberactive a {
	color: #000;
	background: #fff;
	border-bottom: 1px solid #fff;
	cursor: default;
}

/*--------------------------------------------------
 .tabbertab = the tab content
 Add style only after the tabber interface is set up (.tabberlive)
 --------------------------------------------------*/
.tabberlive .tabbertab {
	background: #fff;
	border: 1px solid #ccc;
	border-top: 0;
	padding: 5px;
}