MediaWiki:ColorTheme.css

.pi-theme-life { border: 2px solid #A8A878; }

.pi-theme-life .pi-header, .pi-theme-Life .pi-title { background-color: #A8A878; }

.pi-theme-fire, .pi-theme-Fire { border: 2px solid #F08030; }

.pi-theme-fire .pi-header, .pi-theme-fire .pi-title, .pi-theme-Fire .pi-header, .pi-theme-Fire .pi-title{ background-color: #F08030; }

.pi-theme-water, .pi-theme-Water { border: 2px solid #6890F0; }

.pi-theme-water .pi-header, .pi-theme-water .pi-title, .pi-theme-Water .pi-header, .pi-theme-Water .pi-title { background-color: #6890F0; }

.pi-theme-energy, .pi-theme-Energy { border: 2px solid #78C850; }

.pi-theme-energy .pi-header, .pi-theme-energy .pi-title, .pi-theme-Energy .pi-header, .pi-theme-Energy .pi-title { background-color: #78C850; }

.pi-theme-electric, .pi-theme-electric { border: 2px solid #F8D030; }

.pi-theme-electric .pi-header, .pi-theme-electric .pi-title, .pi-theme-Electric .pi-header, .pi-theme-Electric .pi-title { background-color: #F8D030; }

.pi-theme-ice, .pi-theme-Ice { border: 2px solid #C03028; }

.pi-theme-ice .pi-header, .pi-theme-ice .pi-title, .pi-theme-Ice .pi-header, .pi-theme-Ice .pi-title { background-color: #C03028; }

.pi-theme-affliction, .pi-theme-Affliction { border: 2px solid #A040A0; }

.pi-theme-affliction .pi-header, .pi-theme-affliction .pi-title, .pi-theme-Affliction .pi-header, .pi-theme-Affliction .pi-title { background-color: #A040A0; }

.pi-theme-metal, .pi-theme-Metal { border: 2px solid #E0C068; }

.pi-theme-metal .pi-header, .pi-theme-metal .pi-title, .pi-theme-Metal .pi-header, .pi-theme-Metal .pi-title { background-color: #E0C068; }

.pi-theme-dark, .pi-theme-Dark { border: 2px solid #A890F0; }

.pi-theme-dark .pi-header, .pi-theme-dark .pi-title, .pi-theme-Dark .pi-header, .pi-theme-Dark .pi-title { background-color: #98D8D8; }

.pi-theme-psychic, .pi-theme-Psychic { border: 2px solid #F85888; }

.pi-theme-psychic .pi-header, .pi-theme-psychic .pi-title, .pi-theme-Psychic .pi-header, .pi-theme-Psychic .pi-title { background-color: #F85888; }

.pi-theme-light, .pi-theme-Light { border: 2px solid #A8B820; }

.pi-theme-light .pi-header, .pi-theme-light .pi-title, .pi-theme-Light .pi-header, .pi-theme-Light .pi-title { background-color: #A8B820; }

.pi-theme-earth , .pi-theme-Earth { border: 2px solid #B8A038; }

.pi-theme-earth .pi-header, .pi-theme-earth .pi-title, .pi-theme-Earth .pi-header, .pi-theme-Earth .pi-title { background-color: #B8A038; }

.pi-theme-death, .pi-theme-Death { border: 2px solid #705898; }

.pi-theme-death .pi-header, .pi-theme-death .pi-title, .pi-theme-Death .pi-header, .pi-theme-Death .pi-title { background-color: #705898; }

.pi-theme-entropy, .pi-theme-Entropy { border: 2px solid #7038F8; }

.pi-theme-entropy .pi-header, .pi-theme-entropy .pi-title, .pi-theme-Entropy .pi-header, .pi-theme-Entropy .pi-title { background-color: #7038F8; }

.pi-theme-dark, .pi-theme-Dark { border: 2px solid #A890F0; }

.pi-theme-dark .pi-header, .pi-theme-dark .pi-title, .pi-theme-Dark .pi-header, .pi-theme-Dark .pi-title { background-color: #A890F0; }

.pi-theme-chemica, .pi-theme-Chemica { border: 2px solid #F0B6BC; }

.pi-theme-chemica .pi-header, .pi-theme-chemica .pi-title, .pi-theme-Chemica .pi-header, .pi-theme-Chemica .pi-title { background-color: #F0B6BC; }

.pi-theme-psionic, .pi-theme-Psionic { border: 2px solid #B8B8D0; }

.pi-theme-psionic .pi-header, .pi-theme-psionic .pi-title, .pi-theme-Psionic .pi-header, .pi-theme-Psionic .pi-title { background-color: #B8B8D0; }

.pi-theme-time, .pi-theme-Time { border: 2px solid #705848; }

.pi-theme-time .pi-header, .pi-theme-time .pi-title, .pi-theme-Time .pi-header, .pi-theme-Time .pi-title { background-color: #705848; }

.type-char { --infobox-background-color: #C3E3DA; --infobox-border-color: #609C8B; --infobox-text-color: #000; background-color: var(--infobox-background-color, #C3E3DA); border-color: var(--infobox-border-color, #609C8B); border-radius: 5px; border-width: 2px; border-style: solid; color: var(--infobox-text-color, #000); -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px; } .type-char .pi-border-color { border-color: var(--infobox-border-color, transparent); }

.type-char .pi-title, .type-char .pi-header { background-color: unset; border: unset !important; border-radius: unset; text-align: center; } .type-char .pi-title { padding: unset; } .type-char .pi-image { background: unset; border-left: unset !important; border-right: unset !important; background-color: white; border-radius: 15px; margin: 3px; } .type-char .pi-data { border: unset !important; padding-right: unset; } .type-char .pi-data-value { background-color: white; border-radius: 15px; border: 1px solid; border-color: var(--infobox-border-color); margin: 2px; text-align: center; } .type-char .pi-data-value:empty { background-color: var(--infobox-background-color, transparent); border: unset !important; } .type-char .pi-data-label a:link, .type-char .pi-data-label a:visited { color: black; } .type-char .pi-smart-data-value:not(:first-child), .type-char .pi-smart-data-label:not(:first-child) { border-color: var(--infobox-border-color, transparent); } .type-char .pi-group, .type-char .pi-smart-group { border: unset; } .type-char .pi-group[data-item-name=title] { display: grid; grid-template-columns: 4fr 1fr; grid-template-rows: 1fr 1fr; grid-template-areas: "maintitle icon" "alttitle icon"; grid-gap: 3px 3px; justify-items: center; align-items: center; justify-content: stretch; } .type-char .pi-item[data-source=name] { grid-area: maintitle; } .type-char .pi-item[data-item-name="jname"], .type-char .pi-item[data-source=jname] { font-size: smaller; grid-area: alttitle; font-weight: normal; font-style: italic; } .type-char .pi-item[data-item-name=icon] { font-size: x-small; width: 50px; grid-area: icon; } .type-char .pi-data-label[data-source$="-gen"], .type-char .pi-data-label[data-source=gen] { display: none; } .type-char .pi-data-label[data-source=ndexprev], .type-char .pi-data-label[data-source=ndex], .type-char .pi-data-label[data-source=ndexnext] { /* display: none; */ } .type-char .pi-data-label[data-source$="-ndexprev"]::before, .type-char .pi-data-label[data-source=ndexprev]::before { content:"◀"; padding-right: 2px; float: left; } .type-char .pi-data-label[data-source$="-ndexnext"]::after, .type-char .pi-data-label[data-source=ndexnext]::after { content:"▶"; padding-left: 2px; float: right; } .type-char .pi-data-value[data-source$="-gen"], .type-char .pi-data-value[data-source=gen] { background-color: var(--infobox-background-color, transparent); }

.type-char.pi-theme-normal, .type-char.pi-theme-Normal { --infobox-background-color: #F2F2E9; --infobox-border-color: #C7C7AB; } .type-char.pi-theme-fire, .type-char.pi-theme-Fire { --infobox-background-color: #F7BC92; --infobox-border-color: #D45D08; } .type-char.pi-theme-water, .type-char.pi-theme-Water { --infobox-background-color: #DCE3F5; --infobox-border-color: #5C87ED; } .type-char.pi-theme-grass, .type-char.pi-theme-Grass { --infobox-background-color: #D5F7C3; --infobox-border-color: #74BF4D; } .type-char.pi-theme-electric, .type-char.pi-theme-Electric { --infobox-background-color: #FCEEB6; --infobox-border-color: #E0C969; } .type-char.pi-theme-ice, .type-char.pi-theme-Ice { --infobox-background-color: #DCF7F7; --infobox-border-color: #69D1D1; } .type-char.pi-theme-fighting, .type-char.pi-theme-Fighting { --infobox-background-color: #F0A09C; --infobox-border-color: #C7322A; } .type-char.pi-theme-affliction, .type-char.pi-theme-Affliction { --infobox-background-color: #F2B6F2; --infobox-border-color: #BF49BF; } .type-char.pi-theme-ground, .type-char.pi-theme-Ground { --infobox-background-color: #F5E9C9; --infobox-border-color: #D9B655; } .type-char.pi-theme-psychic, .type-char.pi-theme-Psychic { --infobox-background-color: #F5BFCF; --infobox-border-color: #EB658D; } .type-char.pi-theme-bug, .type-char.pi-theme-Bug { --infobox-background-color: #EBF59D; --infobox-border-color: #B1C229; } .type-char.pi-theme-rock, .type-char.pi-theme-Rock { --infobox-background-color: #EDE8D3; --infobox-border-color: #C4B474; } .type-char.pi-theme-ghost, .type-char.pi-theme-Ghost { --infobox-background-color: #C9BDDE; --infobox-border-color: #8164B5; } .type-char.pi-theme-dragon, .type-char.pi-theme-Dragon { --infobox-background-color: #C1AAFA; --infobox-border-color: #754BDB; } .type-char.pi-theme-dark, .type-char.pi-theme-Dark { --infobox-background-color: #C9C1BB; --infobox-border-color: #786960; } .type-char.pi-theme-steel, .type-char.pi-theme-Steel { --infobox-background-color: #F5F5FC; --infobox-border-color: #C2C2D1; } .type-char.pi-theme-fairy, .type-char.pi-theme-Fairy { --infobox-background-color: #FFD9F6; --infobox-border-color: #ED66CC; } .type-char.pi-theme-flying, .type-char.pi-theme-Flying { --infobox-background-color: #DFD7F7; --infobox-border-color: #B59EF7; } .type-char.pi-theme-secondary-normal, .type-char.pi-theme-secondary-Normal { margin-right: 5px; box-shadow: -5px -5px #F2F2E9, 5px 5px #C7C7AB; } .type-char.pi-theme-secondary-fire, .type-char.pi-theme-secondary-Fire { margin-right: 5px; box-shadow: -5px -5px #F7BC92, 5px 5px #D45D08; } .type-char.pi-theme-secondary-water, .type-char.pi-theme-secondary-Water { margin-right: 5px; box-shadow: -5px -5px #DCE3F5, 5px 5px #5C87ED; } .type-char.pi-theme-secondary-grass, .type-char.pi-theme-secondary-Grass { margin-right: 5px; box-shadow: -5px -5px #D5F7C3, 5px 5px #74BF4D; } .type-char.pi-theme-secondary-electric, .type-char.pi-theme-secondary-Electric { margin-right: 5px; box-shadow: -5px -5px #FCEEB6, 5px 5px #E0C969; } .type-char.pi-theme-secondary-ice, .type-char.pi-theme-secondary-Ice { margin-right: 5px; box-shadow: -5px -5px #DCF7F7, 5px 5px #69D1D1; } .type-char.pi-theme-secondary-fighting, .type-char.pi-theme-secondary-Fighting { margin-right: 5px; box-shadow: -5px -5px #F0A09C, 5px 5px #C7322A; } .type-char.pi-theme-secondary-affliction, .type-char.pi-theme-secondary-Affliction { margin-right: 5px; box-shadow: -5px -5px #F2B6F2, 5px 5px #BF49BF; } .type-char.pi-theme-secondary-ground, .type-char.pi-theme-secondary-Ground { margin-right: 5px; box-shadow: -5px -5px #F5E9C9, 5px 5px #D9B655; } .type-char.pi-theme-secondary-psychic, .type-char.pi-theme-secondary-Psychic { margin-right: 5px; box-shadow: -5px -5px #F5BFCF, 5px 5px #EB658D; } .type-char.pi-theme-secondary-bug, .type-char.pi-theme-secondary-Bug { margin-right: 5px; box-shadow: -5px -5px #EBF59D, 5px 5px #B1C229; } .type-char.pi-theme-secondary-rock, .type-char.pi-theme-secondary-Rock { margin-right: 5px; box-shadow: -5px -5px #EDE8D3, 5px 5px #C4B474; } .type-char.pi-theme-secondary-ghost, .type-char.pi-theme-secondary-Ghost { margin-right: 5px; box-shadow: -5px -5px #C9BDDE, 5px 5px #8164B5; } .type-char.pi-theme-secondary-dragon, .type-char.pi-theme-secondary-Dragon { margin-right: 5px; box-shadow: -5px -5px #C1AAFA, 5px 5px #754BDB; } .type-char.pi-theme-secondary-dark, .type-char.pi-theme-secondary-Dark { margin-right: 5px; box-shadow: -5px -5px #C9C1BB, 5px 5px #786960; } .type-char.pi-theme-secondary-steel, .type-char.pi-theme-secondary-Steel { margin-right: 5px; box-shadow: -5px -5px #F5F5FC, 5px 5px #C2C2D1; } .type-char.pi-theme-secondary-fairy, .type-char.pi-theme-secondary-Fairy { margin-right: 5px; box-shadow: -5px -5px #FFD9F6, 5px 5px #ED66CC; } .type-char.pi-theme-secondary-flying, .type-char.pi-theme-secondary-Flying { margin-right: 5px; box-shadow: -5px -5px #DFD7F7, 5px 5px #B59EF7; } /* Ogg player optimizations */ .portable-infobox .pi-data-value .ogg_player { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; }

.portable-infobox .pi-data-value .ogg_player button { box-sizing: border-box; }

.portable-infobox .pi-data-value .ogg_player audio { max-width: 100%; border-radius: 30px; }

.portable-infobox .pi-data-value .ogg_player .ogg-player-options { margin-top: 5px; }

.portable-infobox .pi-data-value .ogg_player .ogg-player-options ul { margin-left: 10px; }

/* Other */ .portable-infobox .pi-section-tab { cursor: pointer; }

.portable-infobox.type-char .pi-navigation { background-color: transparent; }

.portable-infobox .pi-navigation[data-item-name="disambig"] { text-align: center; padding-top: 0; }

.portable-infobox .pi-navigation[data-item-name="disambig"] ol, .portable-infobox .pi-navigation[data-item-name="disambig"] ul { margin: 0; list-style: none; }