MediaWiki:App/estilos.css

De WikiDex
Ir a la navegaciónIr a la búsqueda

Nota: Después de publicar, quizás necesite actualizar la caché de su navegador para ver los cambios.

  • Firefox/Safari: Mantenga presionada la tecla Shift mientras pulsa el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
  • Google Chrome: presione Ctrl+Shift+R (⌘+Shift+R en Mac)
  • Internet Explorer/Edge: mantenga presionada Ctrl mientras pulsa Actualizar, o presione Ctrl+F5
  • Opera: Presiona Ctrl+F5.
body {
    font-family: 'Helvetica Neue','Helvetica','Nimbus Sans L','Arial','Liberation Sans',sans-serif;
    word-wrap: break-word;
    line-height: 1.6;
}
/* Corregir efectos de quirks mode
https://opensource.apple.com/source/WebCore/WebCore-7601.1.46.10/css/quirks.css.auto.html */
table {
	color: inherit;
	text-align: inherit;
	font-size: inherit;
}
/* !important para sobrescribir display:flex */
.noapp, .nomobile, .plainlinks.logo_etiqueta, .mw-indicators, #navegador, #enlacenumeropokemon, .ADestacado, .imagen.imageswitch_section.imageswitch_image.imageswitch_scale table, #toc {
	display:none !important;
}
.vnav, .fobjeto, .movnivel, .movmtmo, .movtutor, .movhuevo, .movespecial, .max-width-app {
	width: 98% !important;
	margin: 0 auto !important;
	max-width: 400px;
	float: none !important;
}
.floatright {
    float: right;
    margin: 1.5em 0 0.5em 0.5em;
}
.small-clear {
	clear:both;
}
.sombra.enlacesblancos.enlacessinsubrayado {
    width: 100% !important;
}
/* no aplicar a tabmov para que las imágenes de tipos no desaparezcan */
table:not(.tabmov) img, .floatnone img {
    max-width: 100%;
    height: auto;
    min-width: 12px;
}
.gallerybox {
    margin-right: 1em;
}
p, li, dd {
    line-height: 1.6;
	word-wrap: break-word;
}
.thumbimage {
    max-width: 500px !important;
    height: auto;
    width: 100%;
}
.thumb .thumbinner {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 500px !important;
    overflow-x: auto;
    text-align: center;
    width: 100% !important;
}
.thumb.video {
	margin-bottom: 20px !important;
}
.thumbcaption, .gallerytext {
    margin: 0.5em 0 0.5em;
    font-size: 0.8em;
    line-height: 1.5;
    padding: 0 !important;
    color: #54595d;
    text-align: center;
}
ul.gallery {
    display: -webkit-box;
    overflow-x: auto;
    padding-left: 0;
}
.gallery li {
    list-style-type: none;
}
li {
    padding: 0.3em 0;
}
td {
    white-space: normal !important;
}
a {
    text-decoration: none;
}
dt {
    font-weight:bold;
}
.rbox .rboxint {padding:4px;}
.centrado-vertical {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.border-box * {
	box-sizing: border-box;
}
.hnav {
   border:1px solid #aaa;
   border-spacing:0;
   font-size:90%;
   clear:both;
   margin:0.5em auto;
   padding:0.5em;
   text-align:center;
}
table.hnav th, table.hnav td {
   padding-left:.3em;
   padding-right:.3em;
}
table.hnav th + td {
   padding-left:.5em;
}
.hnav .caption, .hnav .caption th, .hnav .encabezado, .hnav .encabezado th {
   text-align:center;
   padding:0.15em 1em;
   font-weight:bold;
   font-size:103%;
}
.vnav {
   text-align:center;
}
.vnav .titulo {
   font-size:200%;
   line-height:1.2em;
   font-weight:bold;
}
.vnav .vnav_datos {
   overflow:hidden;
}
.vnav table {
	width:100%;
	border-collapse:collapse;
}
.vnav table.datos tr {border-top:1px dotted #888;}
.vnav table.datos tr:first-child {border-top:none;}
.vnav .h {font-weight:bold;}
.infobox .h {
	font-weight:bold;
	text-align:center;
	padding: 1px;
}
.infobox table.datos {
	width: 100%;
}
.infobox table.datos th {
	text-align:right;
	padding-right:5px;
}
.infobox table.datos td {
	text-align:left;
}

div.cuadro_movimiento {width:16em;}
div.cuadro_movimiento table.datos th {text-align:right;}
div.cuadro_movimiento table.datos td {text-align:left; padding-left:12px;}
div.cuadro_movimiento .afectado table td {padding:0 1em;}
.otrosdatos {
    width: 95% !important;
}
/* tabber antiguo */
.tabbertab:before {
    content: attr(title);
    display: block;
    font-weight: bold;
    margin-top: 2em;
}
/* nuevo tabber */
.tabber > section > article:not([role="tabpanel"]):before {
	content: attr(title);
	display: block;
	font-weight: bold;
	font-size: 110%;
	margin-top: 2em;
}
.emu-fila {
   display:flex;
   justify-content: space-around;
   align-items:center;
   border-bottom: 1px solid #C0C0C0;
}
.emu-fila:last-child {
   margin-bottom:-1px;
}
.emu-fila > .emu-celda {
   display:inline-block;
}
.emu-fila > .emu-celda:first-child {
   border-right: 1px solid #C0C0C0;
}
.cntmrgn {
	padding: 1px;
}
.cntmrgn .cnt {
	margin: 1px;
}
.cntpad .cnt {
	padding: 2px;
}
.center-text {
	text-align: center;
}
.new {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}
.enlacesblancos a, .enlacesblancos a:visited {
    color: white;
}
.fobjeto td table {
    color: white !important;
}

/* no le gusta el height:100% */
table.pokedex, table.pokedex th, table.pokedex th > div { height:auto !important; }

table.wiki, table.lista, table.galeria, table.movnivel, table.movmtmo, table.movtutor,
table.movhuevo, table.movespecial, table.estadisticas, table.tabmov, table.tabpokemon,
table.tabvideojuegos, table.bandas, table.habpokemon, table.tablaobjeto {
    border-collapse: collapse;
    font-size:90%;
}
table.wiki td, table.wiki th, table.lista td, table.lista th, table.galeria td, table.galeria th,
table.movnivel th, table.movmtmo th, table.movtutor th, table.movhuevo th, table.movespecial th, 
table.estadisticas th, table.tabmov th, table.tabpokemon th, table.movnivel td, table.movmtmo td, 
table.movtutor td, table.movhuevo td, table.movespecial td, table.estadisticas td,
table.tabmov td, table.tabpokemon td, table.tabvideojuegos td, table.tabvideojuegos th, 
table.bandas td, table.bandas th, table.habpokemon td, table.habpokemon th,
table.tablaobjeto td, table.tablaobjeto th {
    padding: 2px;
    border: 1px solid #AFAFAF;
}
table.galeria, table.movnivel, table.movmtmo, table.movtutor, table.movhuevo, table.movespecial, table.estadisticas,
table.tabmov, table.tabpokemon, table.tabvideojuegos, table.habpokemon, table.tablaobjeto {
    text-align: center;
}

.plegable.plegable-plegada tr {
   display: inherit !important;
}
.category-container {
    margin-bottom: 70px;
}
.category-button {
    padding: 0.546875em 1em;
    border-radius: 25px;
    margin: 10px;
    white-space: nowrap;
    display: inline-block;
    min-width: 4em;
    font-weight: bold;
    text-align: center;
}
pre {
    overflow: auto;
    padding: 1em;
}
code, pre {
    font-family: monospace;
    border: solid 1px #c8ccd1;
    white-space: pre-wrap;
}
.cajaflexible {
	display: flex; 
	flex-flow: row wrap;
	justify-content:center;
	margin:auto; 
}
/* Tabla flexible */
.tfx, .tfx > tbody, .tfx > tbody > tr > th, .tfx > tbody > tr > td {
	display:block;  
}
.tfx .tfx-hid {
	display: none;
}
.tfx > tbody > tr {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}
.tfx > tbody > tr > th, .tfx > tbody > tr > td {
	flex: 1;
}
.tfx .tfx-fw {
	box-sizing: border-box;
	flex: 1 0 100%;
	max-width: 100%;
}

.floatright {
	float: none;
	margin: auto;
	text-align: center;
}

.imagenpopup .popup {display:none; speak:none;}

.imagenpopup > a {color:#008000;}

.popup.popup-display {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.popup.popup-display > .thumbinner {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0;
}

.popup.popup-display > .thumbinner > a {
	flex: 1;
	padding: 1em;
}

.popup.popup-display > .thumbinner > .thumbcaption {
	padding: 0 0 2em;
	text-align: center;
}

.popup.popup-display > .thumbinner .magnify {
	display: none;
}

.popup.popup-display > .thumbinner > a > img {
	flex: 1;
	max-width: 100%;
	width: auto;
	height: 100%;
	object-fit: contain;
}
/* Esto genera problemas en versiones recientes de Webview
.flex-col { 
	display: -webkit-box !important;
	-webkit-box-orient: vertical;
}*/
/*** Estilos de tablas ***/
table.col1der td:first-child { text-align:right; }
table.col1izq td:first-child { text-align:left; }
table.col1cen td:first-child { text-align:center; }

table.col2der td:first-child + td { text-align:right; }
table.col2izq td:first-child + td { text-align:left; }
table.col2cen td:first-child + td { text-align:center; }

table.col3der td:first-child + td + td { text-align:right; }
table.col3izq td:first-child + td + td { text-align:left; }
table.col3cen td:first-child + td + td { text-align:center; }

table.col4der td:first-child + td + td + td { text-align:right; }
table.col4izq td:first-child + td + td + td { text-align:left; }
table.col4cen td:first-child + td + td + td { text-align:center; }

table.col5der td:first-child + td + td + td + td { text-align:right; }
table.col5izq td:first-child + td + td + td + td { text-align:left; }
table.col5cen td:first-child + td + td + td + td { text-align:center; }

table.col6der td:first-child + td + td + td + td + td { text-align:right; }
table.col6izq td:first-child + td + td + td + td + td { text-align:left; }
table.col6cen td:first-child + td + td + td + td + td { text-align:center; }

table.col7der td:first-child + td + td + td + td + td + td { text-align:right; }
table.col7izq td:first-child + td + td + td + td + td + td { text-align:left; }
table.col7cen td:first-child + td + td + td + td + td + td { text-align:center; }

table.col8der td:first-child + td + td + td + td + td + td + td { text-align:right; }
table.col8izq td:first-child + td + td + td + td + td + td + td { text-align:left; }
table.col8cen td:first-child + td + td + td + td + td + td + td { text-align:center; }

table.col9der td:first-child + td + td + td + td + td + td + td + td { text-align:right; }
table.col9izq td:first-child + td + td + td + td + td + td + td + td { text-align:left; }
table.col9cen td:first-child + td + td + td + td + td + td + td + td { text-align:center; }

table.col10der td:first-child + td + td + td + td + td + td + td + td + td { text-align:right; }
table.col10izq td:first-child + td + td + td + td + td + td + td + td + td { text-align:left; }
table.col10cen td:first-child + td + td + td + td + td + td + td + td + td { text-align:center; }

/* Las fórmulas matemáticas son imágenes y no se pueden scrollear */
.mwe-math-element {
	display: inline-block;
	max-width: 100%;
	overflow-x: auto;
}

/* app:Referencias */

#app-ref-display {
	display:none;
	position:absolute;
	max-height:200px;
	bottom: 0;
	left: 0;
	right: 0;
	-webkit-box-sizing: border-box;
	position: fixed;
	padding: 20px;
	opacity: 0;
	-webkit-transition: -webkit-transform 0.25s, opacity 0.25s;
	transition: transform 0.25s, opacity 0.25s;
	overflow-y: auto;
}

#app-ref-display.app-ref-active {
	display:block;
	opacity: 1;
}

#app-ref-display-x {
	cursor: pointer;
	position: absolute;
	margin: -1em -1em -1em 0;
	padding: 20px;
	right: 10px;
	top: 10px;
}

#app-ref-display-x:before {
	content: '❌';
	padding: 5px;
}

#app-ref-display-h {
	text-transform: uppercase;
}

#app-ref-display-h:before {
	content: '🔖';
	padding: 5px;
}

#app-ref-display-b {
	margin-top: 1em;
	padding-right: 50px;
}

#app-ref-display-b sup {
	padding-right:5px;
}

/* tema wiki */
.theme-wiki .border-theme, .theme-wiki.border-theme {
  border: 1px solid #88a;
}

span[class^="mw-customtoggle-"] {
  display: none;
}
/* boton de edicion */
.mw-editsection-bracket, .mw-editsection-divider, .mw-editsection-visualeditor {
	display: none;
}
.mw-editsection {
	background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48ZyBmaWxsPSIjNTQ1OTVkIj48cGF0aCBkPSJNMTYuNzcgOGwxLjk0LTJhMSAxIDAgMCAwIDAtMS40MWwtMy4zNC0zLjNhMSAxIDAgMCAwLTEuNDEgMEwxMiAzLjIzek0xIDE0LjI1VjE5aDQuNzVsOS45Ni05Ljk2LTQuNzUtNC43NXoiLz48L2c+PC9zdmc+Cg==') no-repeat 0;
	margin-left: 10px;
	height: 20px;
	width: 20px;
	overflow: hidden;
	display: none; /* para que se mantenga oculto en versiones anteriores de la app */
}
.mw-editsection a {
	padding: 20px;
}
/* paginas relacionadas */
.related-card {
	position:relative; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); 
	margin-top: 20px
}
.related-title {
	font-weight: bold;
	padding: 2% 4%;
	position: absolute;
	bottom: 0;
	color: white;
	background-color: rgba(50,50,50,0.5);
	width:92%;
}
.related-image {
	background-position: center center;
	background-size: cover;
	height: 150px;
	width: 100%;
	background-color: #eaecf0;
}
.cajaflexible {
	overflow-y: hidden;
}
.infobox-objeto {
	background: none !important;
	border: none !important;
}
.fobjeto .datos1 {
	color: white;
}
.explain {
    text-decoration: dotted underline !important;
}

/* Clase CSS para imágenes, evitar que se agranden si se especifica un tamaño superior al tamaño original de la imagen. Usado en Plantilla:O */
img.noagrandar {
	object-fit: scale-down;
}

@media only screen and (min-width: 721px) {
	.float-largescreen {
		float:right;
		clear:right;
	}
}