MediaWiki:Gadget-Tabber.css: Difference between revisions

From the Kingdom Hearts Wiki, the Kingdom Hearts encyclopedia
Jump to navigationJump to search
No edit summary
mNo edit summary
 
(32 intermediate revisions by the same user not shown)
Line 3: Line 3:


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


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


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


Line 73: 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 95% 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 119: Line 105:
  --------------------------------------------------*/
  --------------------------------------------------*/
.tabberlive .tabbertab {
.tabberlive .tabbertab {
padding: 5px;
background: #fff;
background: #fff;
border: 1px solid #ccc;
border: 1px solid #ccc;
border-top: 0;
border-top: 0;
padding: 5px;
}
}

Latest revision as of 17:02, 26 March 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;
}