MediaWiki:Common.css

/*<pre><nowiki>
El CSS añadido aquí afectará a todas las pieles

Los cambios en este archivo pueden tardar unos 10 minutos en hacer efecto.
Es recomendable que primero pruebes el cambio en tu navegador usando las herramientas de desarrollo (tecla F12)

---------------
FORMATO DE FORO
---------------
Forum formatting -Algorithm & -Splaka
*/

.forumheader { border: 1px solid #aaa; background-color: #f9f9f9; margin-top: 1em; padding: 12px; }
.forumlist td span { display: block; padding-left: 10px; font-size: smaller }
.forumlist td span a { text-decoration: none; }
.forumlist td span.forum_author { padding-left: 30px; }
.forumlist td.forum_edited a { text-decoration: none }
.forumlist td.forum_title a { padding-left: 20px; }
.forumlist td.forum_title span a { padding-left: 0px }
.forumlist td.forum_title a.forum_new { font-weight: bold; background: url(/images/1/11/Newmsg.png) center left no-repeat; padding-left: 20px; }
.forumlist td.forum_title a.forum_new:visited { font-weight: normal; background: none; padding-left: 20px; }
.forumlist th.forum_title { padding-left: 20px; }
.forumborder { border-collapse: collapse }
.forumborder td { border-top: solid #aaa 1px }


/*
---------------------
LOGOS DE LOS ESPACIOS
---------------------
Cambiamos el logo de los distintos espacios.
Chuleta (Sus respectivas discusiones son sumando 1):
0 -> Principal     6 -> Imagen      12? -> Ayuda
2 -> Usuario       8 -> Mediawiki   112 -> Incinoticias
4 -> Inciclopedia  10 -> Plantilla  114 -> Incitables

Uso:
  body.ns-<número> #p-logo a { background-image:url( <imagen> ) !important; }
*/

body.ns-112 #p-logo a,
body.ns-113 #p-logo a { background-image: url('https://images.uncyclomedia.co/inciclopedia/es/c/c9/ChixpyLogoIncinoticias.png') !important; }
body.ns-116 #p-logo a,
body.ns-117 #p-logo a { background-image: url('https://images.uncyclomedia.co/inciclopedia/es/7/78/Logo_patataboy.png') !important; }

/*
-----
CITAS
-----
*/
.textocita{
  background: transparent;
  font-family: "Palatino Linotype", Garamond, "Times New Roman", serif;
  padding: 0 1ex 1ex 1ex;
  margin: 0;
  font-style: italic;
  font-size: 120%;
}
.autorcita{
  background: transparent;
  font-family: Arial, Helvetica, sans-serif;
  padding: 0 1ex 0ex 1ex;
  margin: 0;
  font-style: normal;
  font-size: 70%;
}

/*
------------------------------------
ESTILO PARA LAS LETRAS DE LOS ATUNES
------------------------------------
*/
.LetraaTunes {
  text-align: center;
  font-style: italic;
}

/*
-----------------
CREDITOS DE WIKIA
-----------------
Los créditos de wikia son puestos automáticamente por los bots porque wikia
los ha añadido a las páginas de exportación.

De esta forma al menos no se verán...
*/
#wikia-credits {display: none;}

/*
-------
Flechas
-------
Usadas para la tabla de evolución de los pokemones.
Traido de https://www.wikidex.net/wiki/MediaWiki:Common.css.
*/
table.evolucion td.flecha {
	background:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNTAiIGhlaWdodD0iMjgiPjxwYXRoIHN0eWxlPSJmaWxsOiNkZGQiIGQ9Im0gMCw2LjUgMzMyLDAgMCwtNi41IDE4LDE0IC0xOCwxNCAwLC02LjUgLTMzMiwwIHoiIC8+PC9zdmc+') no-repeat right center;
	color:#000;
	height:30px;
	padding: 0 1.5em;
	font-size:larger;
	vertical-align:middle;
}

/*
--------------------------------------------------------------------------------
                    FORMATO DE ELEMENTOS COMUNES (ORIGINAL)
--------------------------------------------------------------------------------

--------------------
TEXTO CON FORMATEADO
--------------------
Hacemos que salga la barrita para el texto preformateado en caso de que no entre.
*/
pre { overflow:auto; }

/*
---------------------------
CÓDIGO DENTRO DE UN PÁRRAFO
---------------------------
Añadimos un suave borde con aires contemporáneos y estilo goyesco
que rememora el arte de Picasso en su punto más álgido */
code {
  border: 1px solid #ddd;
  padding: 0 3px;
}

/*
------------------------------
LISTAS DENTRO DE LOS ARTÍCULOS
------------------------------
Cuando se pone algo a la izquierda (thumb, imagen, div, etc), las listas se ven mal
*/
#content ol, #content ul {
  list-style-position: inside;
}

/*
---------------------
AVISO DE SOLO LECTURA
---------------------
 
Para hacer más visible el mensaje de la wiki está modo de
solo letura, cuando se a Wikia se le cae la base de datos
o trastean con las wikis
*/
 
#mw-read-only-warning {
  font-size: large;
  border: 5px solid #888;
  background: #faa;
}

/*
--------------
IMÁGENES THUMB
--------------
Quitamos el borde, y por tanto el color blanco que aparecía alrededor de los
thumb
*/
div.thumb {
  border:none; 
  background: transparent;
}

.tright { margin-left: 1em;}
.tleft { margin-right: 1em;}

/*
------------------------------------------
JUSTIFICACIÓN DE LOS PÁRRAFOS DEL ARTÍCULO
------------------------------------------
*/
#article, #bodyContent { text-align: justify; }

/*
--------------------------
ENLACES A ARTÍCULOS CORTOS
--------------------------
Esto sirve para definir otro color a los enlaces a artículos cuyo tamaño es inferior al definido en preferencias.

Para hacer uso de ello deber ir a [[special:preferences]],
menú "miscelánea"
y en "Umbral para mostrar esbozos" escribir el tamaño (en bytes).
*/
a.stub{ color:magenta; }

/*
-----------
REFERENCIAS
-----------
Esto cambia el estilo de las notas al pie.
*/
ol.references {
  font-size: smaller;
}

/*
-------------------
TABLA DE CONTENIDOS
-------------------
La centramos y que tenga barras de desplazamiento si es
muy grande.
*/
#toc {
  margin: 0 auto;
}

#toc > tbody > tr > td > ul {
  overflow: auto;
  max-height: 200px;
  padding-right: 1ex;
}

/*
-----------
TABLABONITA
-----------
Bueno en verdad es medio chapado de WP,
ya que lo que hago aquí es traerlo al CSS
en vez de ponerlo a la plantilla.
*/

.tablabonita {
  margin: 0.5em auto;
  padding: 0.5em;
  background: #f9f9f9;
  color: black;
  border: 1px #aaa solid;
  border-collapse: collapse;
  font-size: 95%;
}

.tablabonita th {
  background: #efefef;
  color: black;
  text-align: center;
}


.sortheader {
  display: block;
  position: relative;
  float: right;
  margin-left: 0.25em ;
  width: 16px;
  text-align: center;
  height: 100%;
  vertical-align: middle;
  border-left: 1px dotted #888;
  border-bottom: 1px dotted #888;
}

/*
-------------
Imagen pop-up
-------------
Usado en [[Plantilla:Imagen pop-up]]
Traido de https://www.wikidex.net/wiki/MediaWiki:Common.css
*/
.imagenpopup .popup {display: none; speak: none;}

.imagenpopup .enlace a {color:#008000;}

.imagenpopup:hover .popup {
	background: transparent;
	padding: 2em 1em 1em 2em;
	display: inline;
	position: absolute;
	margin-left:-200px;
	margin-top:-50px;
	z-index: 10;
}

.imagenpopup span.thumb {
	border: none;
	background: transparent;
	width: auto;
}

.imagenpopup span.thumbinner {
	border: 1px solid #c8ccd1;
	padding: 3px;
	background-color: #f8f9fa;
	font-size: 94%;
	text-align: center;
	overflow: hidden;
}

/* Enlace especial en [[Plantilla:Imagen pop-up]] */
.enlacelista a:hover {
	border: 1px solid #0D244A;
	-moz-border-radius: 0 0 15px 15px;
	background: #2158B8;
	text-decoration: none;
	color: white;
}

/*
-------------
BOTÓN DESHACER
--------------
Eliminamos el botón deshacer, con uso de javascript los usuarios registrados
lo volverán a ver.
*/
.mw-history-undo { display: none; }
#mw-diff-ntitle1 a + a + a { display: none; }

/*
---------------------------
BOTÓN QUITAR DEL SITENOTICE
---------------------------
Eliminamos el botón quitar que aparece en la parte superior ([[Mediawiki:SiteNotice]]).
Las noticias son nuestras y nos las follamos cuando queremos.
Por otra parte así no hay que actualizar [[Mediawiki:SiteNotice id]]
*/
#mw-dismissable-notice {padding: 0; margin: 0; border: none;}
#mw-dismissable-notice > tbody > tr > td {padding: 0; margin: 0; border: none;}
#mw-dismissable-notice > tbody > tr > td + td { display: none !important; }



/*
----------------------
ESTILOS PARA LA PORTADA
----------------------
Quitamos el encabezado y las categorías
*/

body.page-Inciclopedia_Portada .firstHeading {display:none !important; ; }
body.page-Inciclopedia_Portada #catlinks {display:none !important; ;}

.CajaPortada {
  padding: 1ex;
  border: 1px #add8e6 solid;
  text-align: center;
  vertical-align: top;
}

.TituloPortada {
  background-color: #add8e6;
  color: black;
  padding: 1ex;
  font-size: 12pt;
  font-weight: bold;
}
/*
-------
TABBER
-------
*/

.tabberlive .tabbernav li a {
  margin-top: 5px;
  line-height: 2em !important;
}

/*
--------------------------------------------------------------------------------
                               CHAPADO DE WIKIPEDIA
--------------------------------------------------------------------------------
Estas modificaciones son copiadas de Wikipedia

-------------------------------
ESTILOS DE COLUMNAS PARA TABLAS
-------------------------------
Define estilos para la alineación del texto según las columnas en las tablas.
Traido de [[wikipedia:es:mediawiki:common.css]].
 
La idea es, que si se quiere que:
  * la primera columna de la tabla esté alineada a la derecha,
  * la segunda centrada
  * y la tercera a la izquierda,
usar:
  {| class="col1der col2cen col3izq"
o
  {| {{tablabonita|alineación = col1der col2cen col3izq}}
 
Así no hay que repetir en cada celda:
 style='text-align:right'", etc,
 
Modificado por Chixpy:
  * Aumentado el número de columnas a 7
  * Cambiada la alineación izquierda por una justificada
  * EXPERIMENTAL: La primera columna dela fila puede ser una celda de encabezado,
     mientras las demás son celdas normales
 
Nota
  Para que funcione bien todas las celdas de una fila deben ser del mismo tipo
    (celdas de título o celdas normales) o solo la primera columna de la fila
    ser una celda de encabezado y las demás normales
 
*/
 
table.col1der tr > *:first-child { text-align:right; }
table.col1izq tr > *:first-child { text-align:justify; }
table.col1cen tr > *:first-child { text-align:center; }
 
table.col2der tr > *:first-child + TD { text-align:right; }
table.col2izq tr > *:first-child + TD { text-align:justify; }
table.col2cen tr > *:first-child + TD { text-align:center; }
 
table.col3der tr > *:first-child + TD + TD { text-align:right; }
table.col3izq tr > *:first-child + TD + TD { text-align:justify; }
table.col3cen tr > *:first-child + TD + TD { text-align:center; }
 
table.col4der tr > *:first-child + TD + TD + TD { text-align:right; }
table.col4izq tr > *:first-child + TD + TD + TD { text-align:justify; }
table.col4cen tr > *:first-child + TD + TD + TD { text-align:center; }
 
table.col5der tr > *:first-child + TD + TD + TD + TD { text-align:right; }
table.col5izq tr > *:first-child + TD + TD + TD + TD { text-align:justify; }
table.col5cen tr > *:first-child + TD + TD + TD + TD { text-align:center; }
 
table.col6der tr > *:first-child + TD + TD + TD + TD + TD { text-align:right; }
table.col6izq tr > *:first-child + TD + TD + TD + TD + TD { text-align:justify; }
table.col6cen tr > *:first-child + TD + TD + TD + TD + TD { text-align:center; }
 
table.col7der tr > *:first-child + TD + TD + TD + TD + TD + TD { text-align:right; }
table.col7izq tr > *:first-child + TD + TD + TD + TD + TD + TD { text-align:justify; }
table.col7cen tr > *:first-child + TD + TD + TD + TD + TD + TD { text-align:center; }

/*
------------------------
REDIRECCIONES EN CURSIVA
------------------------
WP muestra las redirecciones en cursiva en páginas como [[especial:allpages]]
*/
.allpagesredirect {font-style: italic;}


/*
----------------
FONDO AJEDREZADO
----------------
Fondo ajedrezado para las imágenes transparentes en su descripción
Habría que traer la imagen...

Put a checker background at the image description page only visible
   if the image has transparent background
*/

#file img {
  background:url('data:image/gif;base64,R0lGODdhEAAQAIABAO/v7////ywAAAAAEAAQAAACH4RvoauIzNyBSyYaLMDZcv15HAaSIlWiJ5Sya/RWVgEAOw==') repeat;
}

/*
--------------------
BLOQUES DESPLEGABLES
--------------------
Usado para la plantilla [[Plantilla:desplegable]]
y demás bloques desplegables.
*/
div.Boxmerge,
div.NavFrame {
        margin: 0px;
        padding: 2px;
        border: 1px solid #aaaaaa;
        text-align: center;
        border-collapse: collapse;
        font-size: 95%;
}
div.Boxmerge div.NavFrame {
        border-style: none;
        border-style: hidden;
}
div.NavFrame + div.NavFrame {
        border-top-style: none;
        border-top-style: hidden;
}
div.NavPic {
        margin: 0px;
        padding: 2px;
        float: left;
}
div.NavFrame div.NavHead {
        height: 1.6em;
        font-weight: bold;
        font-size: 100%;
        background-color: #f0f0ff; 
}
div.NavFrame p {
        font-size: 100%;
}
div.NavFrame div.NavContent {
        font-size: 100%;
}
div.NavFrame div.NavContent p {
        font-size: 100%;
}
div.NavEnd {
        margin: 0px;
        padding: 0px;
        line-height: 1px;
        clear: both;
}
a.NavToggle {
        margin: 0px;
        padding: 2px;
        float: right;
        z-index:100;
        font-weight:normal;
        font-size:smaller;
}


/*
--------------------------------------------------------------------------------
                               CHAPADO DE UNCYCLOPEDIA
--------------------------------------------------------------------------------

----------------
TEXTO EXPANSIBLE
----------------
Estas dos clases hacen que un texto oculto sea visible
y se expanda al poner el ratón sobre otro texto.

NOTA:
  Solo sirve para elementos de un mismo bloque de texto,
  es decir por ejemplo <span>

Un ejemplo de uso:
  <span class="textovisible">Esto lo ves
  <span class="textooculto">Esto no lo veías</span></span>

Para mayor comodidad se ha creado [[plantilla:expansible]]
*/

/* allows for expanding hidden sig sections (experimental) -Dawg */
.textooculto { display: none; }
.textovisible:hover .textooculto { display: inline !important; position:absolute; z-index: 100 !important; background:white; color:black; border: 1px solid #aaa; padding: 5px;}

/*
Variación hecha por [[user:Chixpy]] para poder hacer menús.
Para mayor comodidad se ha creado [[plantilla:Menú]].
*/
.menuoculto { display: none }
.menuvisible:hover .menuoculto { display: block !important; border: 1px solid #aaa; padding: 5px; z-index: 100 !important;}

/*
----------------
PLANTILLA:TÍTULO
----------------
Traido de Uncyclopedia.

Sirve para Poder poner un título personalizado en las páginas

Comentario Original:
This is to force title-left, title-right, and Title-center to display only
in the default skin -Spl
*/

#titlehack { display:inline !important; }


/* Temporal para los banner */
.plantilla_Banner1 {
  /* background-image: url(https://images.wikia.nocookie.net/inciclopedia/images/b/b7/Banner_gradient.gif); */
  background-position: center bottom;
  background-repeat: repeat-x;
}
.plantilla_Banner1 a { text-decoration:none; }

/* Ocultar interwikis que colocamos por plantilla hasta que se cargue el JS */
#mw-content-text span.fakeinterwiki > a {display:none;}

/* Cambio de tamaño de fuente en las sugerencias de búsqueda -en:Lyrithya */ 
#searchInputSuggest {
  font-size: 13px;
}

/* Fix de los thumbs */

.article-thumb {
  background-color: #f9f9f9;
  border: 1px solid #b4bbc8;
  font-size: 9pt;
  text-align: left;
  padding: 2px;
  padding-right: 4px;
  padding-bottom: 0px;
  margin-left: 2px;
  margin-right: 5px;
}

/* Fix de los thumbs, segundo asalto */

.center {
    width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

/* Cosas que solo queremos ver en mobile */
.nodesktop {
	display: none;
}