MediaWiki:Common.css

From Bulbapedia, the community-driven Pokémon encyclopedia.
Revision as of 02:26, 15 October 2011 by Jioruji Derako (talk | contribs) (giving us many ways to hack up hoverexpand to really do what we want.)
Jump to navigationJump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

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.
/* <pre> */

/* Miscellaneous formatting features */

.sc { font-variant: small-caps }

.l { text-align: left; }
.c { text-align: center; }
.r { text-align: right; }

.bluetable .bg1, .blueinfobox .bg1, .lightbluebg { background: #f8f8ff; }
.graytable .bg1, .grayinfobox .bg1, .lightgraybg { background: #f8f8f8; }
.blueborder { border: 1px solid #88a; }
.grayborder { border: 1px solid #999; }

.bluetable .bg2, .blueinfobox .bg2 { background: #eef; }
.bluetable .bg3, .blueinfobox .bg3 { background: #ddf; }
.bluetable .bg4, .blueinfobox .bg4 { background: #ccf; }

.graytable .bg2, .grayinfobox .bg2 { background: #f0f0f0; }
.graytable .bg3, .grayinfobox .bg3 { background: #e1e1e1; }
.graytable .bg4, .grayinfobox .bg4 { background: #d2d2d2; }

.bluetable, .graytable, .blueinfobox, .grayinfobox {
  border-collapse: collapse;
}

.blueinfobox, .grayinfobox {
  float: right;
  clear: right;
  margin: 0 0 0.5em 0.5em;
}

.blueinfobox { background: #f8f8ff; }
.grayinfobox { background: #f8f8f8; }

.bluetable, .blueinfobox { border: 1px solid #88a; }
.graytable, .grayinfobox { border: 1px solid #999; }

.bluetable td, .bluetable th, .blueinfobox td, .blueinfobox th { border: 1px solid #88a; }
.graytable td, .graytable th, .graytable td, .graytable th { border: 1px solid #999; }

.bluetable td, .bluetable th, .graytable td, .graytable th, 
.blueinfobox td, .blueinfobox th, .graytable td, .graytable th {
  padding: 2px;
}

.bluetable td, .bluetable th, .blueinfobox td, .blueinfobox th { border: 1px solid #88a; }
.graytable td, .graytable th, .grayinfobox td, .grayinfobox th { border: 1px solid #999; }

.bluetable th { background: #ccf; }
.graytable th { background: #d2d2d2; }

.bluetable th:first-child, .graytable th:first-child, .blueinfobox th, .grayinfobox th {
  text-align: right;
}

.bluetable .divider, .blueinfobox .divider, .bluetable .header, .blueinfobox .header,
.graytable .divider, .grayinfobox .divider, .graytable .header, .grayinfobox .header {
  text-align: center !important;
}

.bluetable .header, .bluetable .divider, .blueinfobox .header { background: #ccf; }
.graytable .header, .graytable .divider, .grayinfobox .header { background: #d2d2d2; }
.blueinfobox .divider { background: #eef; }
.grayinfobox .divider { background: #f0f0f0; }

.normalbg { background: rgb(183,173,150); color: white; }
.fightingbg { background: rgb(192,48,40); color: white; }
.flyingbg { background: rgb(168,144,240); color: white; }
.poisonbg { background: rgb(160,64,160); color: white; }
.groundbg { background: rgb(214,182,94); color: white; }
.rockbg { background: rgb(112,88,72); color: white; }
.bugbg { background: rgb(160,184,32); color: white; }
.ghostbg { background: rgb(112,88,152); color: white; }
.steelbg { background: rgb(184,184,208); color: white; }
.grassbg { background: rgb(120,200,80); color: white; }
.firebg { background: rgb(240,124,40); color: white; }
.waterbg { background: rgb(104,144,240); color: white; }
.electricbg { background: rgb(238,194,38); color: white; }
.psychicbg { background: rgb(248,88,136); color: white; }
.icebg { background: rgb(142,206,206); color: white; }
.dragonbg { background: rgb(112,56,248); color: white; }
.darkbg { background: rgb(94,80,76); color: white; }

.whitelinks a { color: white !important; }

div.listcol
{
  padding: 0.5em 1.0em 0.5em 0;
  margin: 0.25em;
  min-width: 21.5%;
  border: 1px solid #aaf;
  float: left;
  clear: right;
  line-height: 130%;
}

div.listcolend
{
  clear: both;
}

/* Babelboxes and userboxes */

div.babelbox, div.userbox
{
  border: 1px solid #999;
  background: #f8f8f8;
  float: right;
  width: 25%;
  padding: 0.25em 0.5em;
  margin-left: 1em;
  margin-bottom: 0.5em;
}

table.babelitem, table.userboxitem
{
  margin: 0.25em 0;
  width: 100%;
}

body[class~=ns-3] div.babelbox, body[class~=ns-3] table.babelitem , body[class~=ns-3] div.userbox, body[class~=ns-3] table.userboxitem
{
  display: none;
}

table.babelitem th, table.userboxitem th
{
  width: 45pt;
  height: 45pt;
  font-size: 14pt;
  text-align: center;
  vertical-align: middle;
}

table.babelitem td, table.userboxitem td
{
  font-size: 8pt;
  line-height: 1.25em;
  padding: 4pt;
  text-align: left;
}

/* Credits table, as seen on [[staff of the Pokémon anime]] and similar pages */

table.credits-table tr { vertical-align: top; }
table.credits-table th { text-align: right; }
table.credits-table td { text-align: left; }

table.credits-table ul
{
  padding-top: 0;
  margin-top: 0;
}

table.learnset
{
  background: #f8f8ff;
  border: 1px solid #88a;
  border-collapse: collapse;
  background: white;
}

table.learnset td, table.learnset th { border: 1px solid #88a; padding: 2px; }

table.learnset td { text-align: center; }
table.learnset td:first-child { text-align: right; }
table.learnset tr.learnset-header th { text-align: center; background: #ccf; }

.noticebar {
  background: #efe url('http://archives.bulbagarden.net/media/upload/6/6f/Notice_bar_background.png') no-repeat left center;
  border: 1px solid #8a8;
  margin-top: 0.2em;
  padding: 0.2em;
  text-align: center;
}

.seriesbox {
  background: #f8f8ff;
  border: 1px solid #88a;
  padding: 0.5em;
  margin: 0 0 0.5em 0.5em;
  float: right;
  clear: right;
  font-size: 90%;
}

.seriesbox .title {
  background: #ccf;
  padding: 0.1em;
  text-align: center;
  font-size: 111%
}

.seriesbox ul {
  margin-left: 0;
  list-style: none;
}

.seriesbox ul ul {
  margin-left: 1.0em;
}

.seriesbox hr {
  border: none;
  border-bottom: 1px solid #88a;  
}

/* Bulbagarden Archives copyright tags */

table.copytag
{
  border: 1px solid #88a;
  background: #f8f8ff;
  margin: 0.25em 0;
  padding: 0;
  width: 100%;
}

table.copytag-red { border: 1px solid #a88; background: #fdd; }
table.copytag-yellow { border: 1px solid #aa8; background: #fffff8; }
table.copytag td.copytag-text { padding: 0.5em; text-align: center; width: 99%; }
table.copytag td.copytag-sym { padding: 0; }

.allpagesredirect a, .redirect-in-category a { font-style: italic; color: #888; }

/* coding to highlight staff members in the RecentChanges, designed by User:Jioruji Derako. (requires manual updating!) */
/* makes all admins italic in the RecentChanges. */

.page-Special_RecentChanges [title="User:Archaic"], 
.page-Special_RecentChanges [title="User:Argy"], 
.page-Special_RecentChanges [title="User:Arty2"], 
.page-Special_RecentChanges [title="User:Bikini Miltank"], 
.page-Special_RecentChanges [title="User:BulbaBot"], 
.page-Special_RecentChanges [title="User:Clarky13"], 
.page-Special_RecentChanges [title="User:CoolPikachu!"], 
.page-Special_RecentChanges [title="User:Darkeiya"], 
.page-Special_RecentChanges [title="User:ElectAbuzzzz"], 
.page-Special_RecentChanges [title="User:Evkl"], 
.page-Special_RecentChanges [title="User:Fabu-Vinny"], 
.page-Special_RecentChanges [title="User:Jello"],
.page-Special_RecentChanges [title="User:Jioruji Derako"], 
.page-Special_RecentChanges [title="User:Kenji-girl"], 
.page-Special_RecentChanges [title="User:Kogoro"], 
.page-Special_RecentChanges [title="User:Ht14"], 
.page-Special_RecentChanges [title="User:MAGNEDETH"], 
.page-Special_RecentChanges [title="User:Mamady"],  
.page-Special_RecentChanges [title="User:Maverick Nate"], 
.page-Special_RecentChanges [title="User:Nyoo"], 
.page-Special_RecentChanges [title="User:PAK Man"], 
.page-Special_RecentChanges [title="User:Pie"], 
.page-Special_RecentChanges [title="User:Politoed666"], 
.page-Special_RecentChanges [title="User:PsychicRider"], 
.page-Special_RecentChanges [title="User:Quagbert"], 
.page-Special_RecentChanges [title="User:RexRacer"], 
.page-Special_RecentChanges [title="User:Rockersk08"], 
.page-Special_RecentChanges [title="User:Sketch"], 
.page-Special_RecentChanges [title="User:Soramimi"], 
.page-Special_RecentChanges [title="User:SnorlaxMonster"], 
.page-Special_RecentChanges [title="User:TTEchidna"], 
.page-Special_RecentChanges [title="User:The dark lord trombonator"],
.page-Special_RecentChanges [title="User:Umeko"],
.page-Special_RecentChanges [title="User:Unown Lord"], 
.page-Special_RecentChanges [title="User:Uratapu"], 
.page-Special_RecentChanges [title="User:Vegard"], 
.page-Special_RecentChanges [title="User:Virtual-Z"],
.page-Special_RecentChanges [title="User:Werdnae"],
.page-Special_RecentChanges [title="User:Zesty Cactus"], 
.page-Special_RecentChanges [title="User:Zeta"], 
.page-Special_RecentChanges [title="User:Zhen Lin"]
{
font-style: italic;
}

/* gives all editorial board members green text. */
 
.page-Special_RecentChanges [title="User:MAGNEDETH"], 
.page-Special_RecentChanges [title="User:The dark lord trombonator"], 
.page-Special_RecentChanges [title="User:Kogoro"], 
.page-Special_RecentChanges [title="User:Jioruji Derako"],  
.page-Special_RecentChanges [title="User:Sketch"], 
.page-Special_RecentChanges [title="User:ElectAbuzzzz"], 
.page-Special_RecentChanges [title="User:CoolPikachu!"],
.page-Special_RecentChanges [title="User:RexRacer"],
.page-Special_RecentChanges [title="User:Jello"]
{
color: #537838;
}

/* gives all non-EB bureaucrats bold text. */

.page-Special_RecentChanges [title="User:Archaic"], 
.page-Special_RecentChanges [title="User:Argy"], 
.page-Special_RecentChanges [title="User:Darkeiya"], 
.page-Special_RecentChanges [title="User:Evkl"], 
.page-Special_RecentChanges [title="User:Fabu-Vinny"], 
.page-Special_RecentChanges [title="User:Kenji-girl"], 
.page-Special_RecentChanges [title="User:Maverick Nate"], 
.page-Special_RecentChanges [title="User:PAK Man"], 
.page-Special_RecentChanges [title="User:Pie"], 
.page-Special_RecentChanges [title="User:Politoed666"], 
.page-Special_RecentChanges [title="User:Quagbert"], 
.page-Special_RecentChanges [title="User:TTEchidna"],
.page-Special_RecentChanges [title="User:Unown Lord"],
.page-Special_RecentChanges [title="User:Zhen Lin"]
{
font-weight: bold;
}

/* creates a div class that can be used to add mouse-over functionality. */
/* hoverexpand will expand to fit the content vertically when hovered-over. Best used within tables or other divs. */
.hoverexpand {
height: 18px;
padding: 2px;
overflow: hidden;
*overflow: visible;
_overflow: visible;
}

.hoverexpand:hover {
height: 100% !important;
overflow: visible;
}

/* trom abuses his admin powers to test stuff in his userspace */
body.page-User_The_dark_lord_trombonator_Main_Page_2 #t-cite,
body.page-User_The_dark_lord_trombonator_Main_Page_2 #footer-info-lastmod,
body.page-User_The_dark_lord_trombonator_Main_Page_2 #siteSub,
body.page-User_The_dark_lord_trombonator_Main_Page_2 #contentSub,
body.page-User_The_dark_lord_trombonator_Main_Page_2 h1.firstHeading,
body.page-User_The_dark_lord_trombonator_Main_Page #t-cite,
body.page-User_The_dark_lord_trombonator_Main_Page #footer-info-lastmod,
body.page-User_The_dark_lord_trombonator_Main_Page #siteSub,
body.page-User_The_dark_lord_trombonator_Main_Page #contentSub,
body.page-User_The_dark_lord_trombonator_Main_Page h1.firstHeading {
display: none !important;
}

body.page-User_The_dark_lord_trombonator_Main_Page_2 .noticebar {
display: none !important
}

body.page-User_The_dark_lord_trombonator_Main_Page_2 #content { background-color: #E0F2B6;
}

/* cutting down on the usage of Template:Roundy with div and table classes for use in larger pages. */
.roundy { border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -icab-border-radius: 10px; -o-border-radius: 10px; }

.roundytl { border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; -webkit-border-top-left-radius: 10px; -khtml-border-top-left-radius: 10px; -icab-border-top-left-radius: 10px; -o-border-top-left-radius: 10px; }

.roundytr { border-top-right-radius: 10px; -moz-border-radius-topright: 10px; -webkit-border-top-right-radius: 10px; -khtml-border-top-right-radius: 10px; -icab-border-top-right-radius: 10px; -o-border-top-right-radius: 10px; }

.roundybl { border-bottom-left-radius: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-bottom-left-radius: 10px; -khtml-border-bottom-left-radius: 10px; -icab-border-bottom-left-radius: 10px; -o-border-bottom-left-radius: 10px; }

.roundybr { border-bottom-right-radius: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-bottom-right-radius: 10px; -khtml-border-bottom-right-radius: 10px; -icab-border-bottom-right-radius: 10px; -o-border-bottom-right-radius: 10px; }

.roundybottom { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -khtml-border-bottom-left-radius: 10px; -khtml-border-bottom-right-radius: 10px; -icab-border-bottom-left-radius: 10px; -icab-border-bottom-right-radius: 10px; -o-border-bottom-left-radius: 10px; -o-border-bottom-right-radius: 10px; }

.roundytop { border-top-left-radius: 10px; border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -khtml-border-top-left-radius: 10px; -khtml-border-top-right-radius: 10px; -icab-border-top-left-radius: 10px; -icab-border-top-right-radius: 10px; -o-border-top-left-radius: 10px; -o-border-top-right-radius: 10px; }

.roundyleft { border-top-left-radius: 10px; border-bottom-left-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-bottom-left-radius: 10px; -khtml-border-top-left-radius: 10px; -khtml-border-bottom-left-radius: 10px; -icab-border-top-left-radius: 10px; -icab-border-bottom-left-radius: 10px; -o-border-top-left-radius: 10px; -o-border-bottom-left-radius: 10px; }

.roundyright { border-bottom-right-radius: 10px; border-top-right-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-topright: 10px; -webkit-border-bottom-right-radius: 10px; -webkit-border-top-right-radius: 10px; -khtml-border-bottom-right-radius: 10px; -khtml-border-top-right-radius: 10px; -icab-border-bottom-right-radius: 10px; -icab-border-top-right-radius: 10px; -o-border-bottom-right-radius: 10px; -o-border-top-right-radius: 10px; }

/* </pre> */