MediaWiki:Mobile.css: Difference between revisions

Latest revision as of 04:14, 1 March 2024

/* CSS placed here will affect users of the mobile site */

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;
}

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; }

div.docutag
{
  background: #f8f8ff;
  border: 1px solid #88a;
  padding: 0.25em;
}

div.docutag ul
{
  list-style: none;
  text-indent: 0;
  padding: 0;
  margin: 0;
}

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

/* Miscellaneous formatting features */

.sc { font-variant: small-caps }

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

/* 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; }

/* Restore category box to pre-MediaWiki 1.18.0 margins */
#catlinks li {
    margin: 0 0;
    padding: 0 0.4em;
}

#catlinks li:first-child {
    padding-left: 0;
}

.mw-plusminus-pos {
    border-bottom: 1px dotted;
    cursor: help;
}

.mw-plusminus-neg {
    border-bottom: 1px dotted;
    cursor: help;
}

.mw-plusminus-null {
    border-bottom: 1px dotted;
    cursor: help;
}

/* Override default font used for gender symbols for legibility */
@font-face {
    font-family: 'bp_gender';
    src:
        local('Segoe UI Symbol'),    /* Windows, overriding Arial */
        local('Helvetica'),          /* Mac/iOS */
        local('Noto Emoji Regular'); /* Android */
    unicode-range: U+2640, U+2642;
}

body {
    font-family: -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'bp_gender', 'Helvetica', 'Arial', sans-serif;
}

/* Fonts for Pokémon-specific characters */
@font-face {
    font-family: PGLDings;
    src:
        url("/w/fonts/PGLDings.woff2") format("woff2"),
        url("/w/fonts/PGLDings.woff") format("woff"),
        url("/w/fonts/PGLDings.ttf") format("ttf");
}

@font-face {
    font-family: ori_font;
    src:
        url("/w/fonts/ori_font.woff2") format("woff2"),
        url("/w/fonts/ori_font.woff") format("woff"),
        url("/w/fonts/ori_font.ttf") format("ttf");
}

@font-face {
    font-family: PDollar;
    src:
        url("/w/fonts/ori_font.woff2") format("woff2"),
        url("/w/fonts/ori_font.woff") format("woff"),
        url("/w/fonts/ori_font.ttf") format("ttf");
    unicode-range: U+0024, U+E300; /* Pokémon Dollar sign only */
}

.font-dings {
    font-family: PGLDings, bp_gender, sans-serif;
}

.font-ori {
    font-family: ori_font, bp_gender, sans-serif;
}

.pdollar {
    font-family: PDollar, bp_gender, sans-serif;
}