Difference between revisions of "MediaWiki:Common.css"

Revision as of 21:19, 28 May 2008

/** CSS placed here will be applied to all skins */

/* Content backgrounds for various categoried pages. */

/*
 * Can't set width to 100% and also specify padding in same div, due to browser bugs.  (Renders wider than it should, leading to horizontal scrollbars.)
 *
 * Bug/workaround documented at http://www.webreference.com/authoring/style/sheets/layout/advanced/
 */

div.pii_species_content_container,
div.pii_flower_content_container,
div.pii_waterflower_content_container,
div.pii_vegetable_content_container,
div.pii_weed_content_container,
div.pii_bush_content_container,
div.pii_tree_content_container,
div.pii_pa_minigame_content_container {
    width: 100%;
}

div.pii_species_content {
    margin: 0;
    padding: 1em;
    background-color:#D1F3FF;
}

div.pii_species_sour_content {
    margin: 0;
    padding: 1em;
    background-color:#f0e1ff;
}

div.pii_flower_content,
div.pii_waterflower_content,
div.pii_vegetable_content,
div.pii_weed_content,
div.pii_bush_content,
div.pii_tree_content {
    margin: 0;
    padding: 1em;
    background-color:#ccffcc;
}

div.pii_pa_minigame_content {
    margin: 0;
    padding: 1em;
}

/* Indent for Species page Requirements section data */

div.pii_species_requirements {
    margin: 1em 1em 1em 2em;
}

div#pii_minifaq_content_container {
    width: 80%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #0B198C;
    background: #E1E4F2 none;
}

/* Substitute vB-style image for external link */

div#pii_minifaq_content_container a.external {
    background: url(http://pinataisland.info/forum/images/buttons/lastpost.gif) center right no-repeat;
    padding-right: 16px;
}

div.pii_minifaq_content,
div.pii_minifaq_content_header,
div.pii_minifaq_content_footer {
    margin: 1px;
    padding: 10px 6px 10px 6px;
    background: #F5F5FF none;
    border: 0px none #F5F5FF;
    text-align: left;
    font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}

div.pii_minifaq_content b {
    background: #F5F5FF url(http://pinataisland.info/forum/images/icons/icon1.gif) no-repeat scroll top left;
    font: 9pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
    font-weight: bold;
    text-decoration: none;
    border-bottom: 1px solid #D1D1E1;
    padding-top: 0;
    padding-bottom: 0.3em;
    padding-left: 18px;
    margin-top: 0;
    margin-bottom: 0.2em;
    display: block;
}

div.pii_minifaq_content ul {
    list-style-type: disc;
    list-style-image: none;
}

/* Commonly asked questions header */

div.pii_minifaq_content_header {
    background: #5C7099 url(http://pinataisland.info/forum/images/gradients/gradient_thead.gif) repeat-x top left;
    color: white;
    font-weight: bold;
}

/* Optional See also footer */

div.pii_minifaq_content_footer {
    background: #5C7099 url(http://pinataisland.info/forum/images/gradients/gradient_thead.gif) repeat-x top left;
    color: #E0E0F6;
    text-align: right;
}

div.pii_minifaq_content_footer b {
    font-weight: bold;
}

/* Override link colors in footer */

div.pii_minifaq_content_footer a {
    color: #E0E0F6;
}

/* Speechbox */

div.pii_speechbox {
    background-image: url(/skins/common/images/Speech_Box.jpg);
    height: 190px;
    width: 366px;
    padding: 90px; 
}

/* FAQ keytable message box  (migrated to CSS - was Template:FAQkeytable) */

div.pii_faq_keytable {
    width: 80%;
    border: 4px solid #f6f2d1;
    background: #fdffeb;
    padding: 0.8em;
    margin: 1em auto 1em auto;
    text-align: center;
}

/* Gameplay Tip message box */

div.pii_gameplay_tip {
    width: 80%;
    border: 4px solid #cef2e0; ! blue=#cedff2;
    background: #f5fffa; ! blue=#f5faff;
    padding: 0.8em;
    margin: 1em auto 1em auto;
    text-align: center;
}

div.pii_gameplay_tip b {
    color: #8eb2a0; ! blue=#8e9fb2;
    font-weight: bold;
}

/* Accessories item box */

div.pii_accessories {
    width: 90%;
    border: 4px solid #cedff2;
    background: #f5faff;
    padding: 0.6em;
    margin: 1em auto 1em auto;
    text-align: center;
}

div.pii_accessories b {
    color: #8e9fb2;
    font-weight: bold;
    font-size: 120%;
    text-decoration: none;
    border-bottom: 2px solid #cedff2;
    padding-bottom: 0.2em;
    padding-top: 0;
    margin-top: 0;
    margin-bottom: 0.2em;
    display: block;
}

div.pii_accessories ul {
    text-align: center;
    list-style: none;
    list-style-image: none;
    list-style-type: none;
    display: block;
    cursor: default;
}

div.pii_accessories li {
    padding: 0;
    display: block;
    margin-left: -1.5em;
}

/* Species page Variants table */

table.pii_species_variants {
    padding: 5px;
    border-spacing: 0px;
    margin: 1em 1em 1em 1em;
    border: 1px #aaaaaa solid;
    border-collapse: collapse;
    vertical-align: top;
    text-align: center;
}

table.pii_species_variants td {
    background: #fdffeb;
    padding: 5px;
}

table.pii_species_variants th {
    background: #fdf2ce;
    padding: 5px;
}

/* General table, auto-width */

table.pii_wikitable {
    padding: 5px;
    border-spacing: 5px;
    margin: 1em;
    border: 1px #aaaaaa solid;
    border-collapse: collapse;
    vertical-align: top;
}

table.pii_wikitable th {
    padding: 5px;
}

table.pii_wikitable td {
    padding: 5px;
}

table.pii_pa_minigame_table {
    padding: 4px;
    border-spacing: 0px;
    margin: 0 0 1em 1em;
    border: 1px #aaaaaa solid;
    border-collapse: collapse;
    vertical-align: top;
    width: 200px;
    text-align: left;
    font-size: 95%;
}

table.pii_pa_minigame_table th {
    padding: 4px;
}

table.pii_pa_minigame_table td {
    padding: 4px;
}

table.pii_pa_controls_table {
    padding: 3px;
    border-spacing: 0px;
    margin: 0;
    border: 1px none;
    border-collapse: collapse;
    vertical-align: top;
    text-align: left;
}

table.pii_pa_controls_table th {
    padding: 3px;
}

table.pii_pa_controls_table td {
    padding: 3px;
}

/*
 * Color variations for table headings and rows
 *
 * Attract: Yellow (E.g. Attracting new species)
 * Tame: Red (E.g. Taming sour pinatas)
 * Game: Green (E.g. Site Map Game)
 * Merchandise: Blue (E.g. Site Map General info)
 * TV: Purple (E.g. Site Map TV show)
 *
 */

/* Yellow */

#pii_attract th {
    background: #fdf2ce;
    padding: 5px;
}

#pii_attract td {
    background: #fdffeb;
    padding: 5px;
}

/* Was Red - trying same purple shade as species Sour version section */

#pii_tame th {
    background: #d3baf2; ! ickyred = #f29494;
    padding: 5px;
    border-bottom-color: #cccccc;
}

#pii_tame td {
    background: #f0e1ff; ! ickyred = #ffb1b1;
    padding: 5px;
    border-color: #cccccc;
}

/* Green */

#pii_site_game th {
    background: #cef2e0;
    padding: 5px;
}

#pii_site_game td {
    background: #f5fffa;
    padding: 5px;
}

/* Blue */

#pii_site_merchandise th {
    background: #cedff2;
    padding: 5px;
}

#pii_site_merchandise td {
    background: #f5faff;
    padding: 5px;
}

/* Purple */

#pii_site_tv th {
    background: #ddcef2;
    padding: 5px;
}

#pii_site_tv td {
    background: #faf5ff;
    padding: 5px;
}

/* Fake (monobook) H2 to keep FAQ's TOC in order */

#pii_faq_h2 {
   font-size: 150%;
   color: black;
   background: none;
   font-weight: normal;
   margin: 0;
   padding-top: .5em;
   padding-bottom: .17em;
   border-bottom: 1px solid #aaa;
}


/* Colored watchlist numbers */
.mw-plusminus-pos {
  color:darkgreen;
}

.mw-plusminus-neg {
  color:darkred;
}

/* Food Chain */
td.pii_food_chain_box_top
{
    background-color: #FFBBAA;
    border: thin solid black;
    width: 100px;
    text-align: center;
}

td.pii_food_chain_box_middle
{
    background-color: #FFFFCC;
    border: thin solid black;
    width: 100px;
    text-align: center;
}

td.pii_food_chain_box_bottom
{
    background-color: #CEF2E0;
    border: thin solid black;
    width: 100px;
    text-align: center;
}

td.pii_food_chain_line_blank
{
    width: 30px;
}

td.pii_food_chain_line_left
{
    border-left: thin solid black;
    width: 30px;
}

td.pii_food_chain_line_bottom
{
    border-bottom: thin solid black;
    width: 30px;
}

td.pii_food_chain_line_leftbottom
{
    border-left: thin solid black;
    border-bottom: thin solid black;
    width: 30px;
}

.tagcloud {
        width: 98%;
        text-align: center;
        background-color: #FDFDFD;
        border: 1px solid #EEEEEE;
        padding: 15px 10px 15px 10px;
}
.tagcloud a {
        color: #0052CB;
        margin-left: 10px;
        margin-right: 10px;
        font-weight: bold;
}

/* default skin for navigation boxes */
table.navbox {            /* navbox container style */
  border:1px solid #aaa;
  width:100%; 
  margin:auto;
  clear:both;
  font-size:88%;
  text-align:center;
  padding:1px;
}
table.navbox + table.navbox {
  margin-top:-1px;        /* single pixel border between adjacent navboxes (doesn't work for IE6, but that's okay) */
}
.navbox-title, .navbox-abovebelow, table.navbox th {
  text-align:center;      /* title and above/below styles */
  padding-left:1em;
  padding-right:1em;
}
.navbox-group {           /* group style */
  white-space:nowrap;
  text-align:right;
  font-weight:bold;
  padding-left:1em;
  padding-right:1em;
}
.navbox, .navbox-subgroup {
  background:#fdfdfd;     /* Background color */
}
.navbox-list {
  border-color:#fdfdfd;   /* Must match background color */
}
.navbox-title, table.navbox th {
  background:#ccccff;     /* Level 1 color */
}
.navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title {
  background:#ddddff;     /* Level 2 color */
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
  background:#e6e6ff;     /* Level 3 color */
}
.navbox-even {
  background:#f7f7f7;     /* Even row striping */
}
.navbox-odd {
  background:transparent; /* Odd row striping */
}
 
@media print {
    .navbox {
        display: none;
    }
}

.plainlinksneverexpand {
    background: none ! important;
    padding: 0 ! important;
}

.plainlinksneverexpand .urlexpansion {
    display: none ! important;
}

/* Make sure that ext links displayed within "plainlinksneverexpand" don't get
   the arrow...
*/
.plainlinksneverexpand a {
    background: none !important;
    padding: 0 !important;
}

/* With MediaWiki 1.5, the mechanism has changed: instead of a SPAN of class "urlexpansion"
   following the anchor A, the anchor itself now has class "external autonumber" and the
   expansion is inserted when printing (see the common printing style sheet at
   http://en.wikipedia.org/skins-1.5/common/commonPrint.css) using the ":after" pseudo-
   element of CSS. We have to switch this off for links due to Template:Ref!
*/
.plainlinksneverexpand a.external.text:after {
    display: none !important;
}
.plainlinksneverexpand a.external.autonumber:after {
    display: none !important;
}

/* Messagebox templates */
.messagebox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    width: 80%;
    margin: 0 auto 1em auto;
    padding: .2em;
}