Diferencia entre revisiones de «MediaWiki Common css 20251205»
De FSF
Sin resumen de edición |
Sin resumen de edición |
||
| Línea 161: | Línea 161: | ||
</pre> | </pre> | ||
---- | |||
[[CATEGORY:WIKICOMMON]] | |||
Revisión actual - 09:03 5 dic 2025
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */
/* Colocar la Tabla de Contenidos en el lado derecho */
#toc {
float: right; /* Mueve la ToC a la derecha */
margin-left: 1em; /* Agrega espacio a la izquierda de la ToC */
width: 400px; /* Ajusta el ancho de la ToC según lo que necesites */
background-color: #f9f9f9; /* Color de fondo opcional para destacarla */
border: 1px solid #ccc; /* Borde opcional para darle un contorno */
padding: 10px; /* Espacio interno para que el contenido no esté pegado a los bordes */
}
/* Evitar que el contenido principal se solape con la ToC */
#mw-content-text {
overflow: hidden;
}
/* Quitar el logo; de todas maneras no funcionaba 20250926 */
#p-logo, .mw-wiki-logo {
display: none;
}
/************************************************************
ESTILO FSF — Encabezados, ToC y mejoras de lectura
Autor: ChatGPT & Ziv — 2025-12-05
*************************************************************/
/* --------------------------
COLORES ↑ estilo A1/A2
--------------------------- */
h1, h2, h3, h4, h5, h6 {
color: #00527A !important;
font-weight: 600;
line-height: 1.25;
margin-top: 0.55em !important;
margin-bottom: 0.28em !important;
scroll-margin-top: 80px; /* mejor navegación interna */
transition: color 0.25s ease, letter-spacing 0.25s ease;
}
/* pequeña animación al pasar el cursor */
h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {
color: #007FB3 !important;
letter-spacing: 0.5px;
}
/* --------------------------
TOC (Tabla de Contenidos)
--------------------------- */
#toc, .toc, .mw-table-of-contents {
border: 1px solid #B8D7E6;
background: #F7FCFE;
padding: 1em 1.2em;
border-radius: 0.6em;
box-shadow: 0 0 4px rgba(0,0,0,0.08);
font-size: 0.95em;
color: #003A52;
width: fit-content;
max-width: 30%;
transition: box-shadow 0.25s ease, transform 0.25s ease;
}
/* efecto suave al pasar cursor */
#toc:hover {
box-shadow: 0 0 12px rgba(0,0,0,0.12);
transform: scale(1.015);
}
/* enlaces del ToC */
#toc a {
color: #00527A;
text-decoration: none;
transition: color 0.2s ease;
}
#toc a:hover {
color: #0084B8;
text-decoration: underline;
}
/* numeración más compacta */
#toc ul, #toc ol {
margin-left: 1em;
}
/* título del ToC */
#toc .toctitle {
font-weight: 700;
color: #003A52;
padding-bottom: 0.3em;
}
/* --------------------------
MEJORAS EN TEXTO GENERAL
--------------------------- */
body, #content {
line-height: 1.55;
}
/* enlaces internos más suaves */
a {
transition: color 0.25s ease;
}
a:hover {
color: #007FB3;
}
/* --------------------------
MÓVILES (responsive)
--------------------------- */
@media (max-width: 900px) {
/* encabezados un poco más compactos */
h1, h2, h3, h4, h5, h6 {
margin-top: 0.45em !important;
margin-bottom: 0.22em !important;
}
/* ToC ocupa todo a lo ancho y más legible */
#toc {
width: 100%;
font-size: 1em;
padding: 1em;
}
/* espaciado más cómodo */
#toc ul, #toc ol {
margin-left: 0.8em;
}
}
/* --------------------------
ULTRA-MÓVIL < 480px
--------------------------- */
@media (max-width: 480px) {
h1 { font-size: 1.55em; }
h2 { font-size: 1.35em; }
h3 { font-size: 1.18em; }
h4, h5, h6 { font-size: 1.05em; }
#toc {
font-size: 1.05em;
padding: 1em;
}
}
----
/* Ajusto los espacios en blanco al usar los encabezados y divisiones que se crean para el ToC con la intensión de que sean mas compactos, agradables de leer en textos largo o tratar de que se se parezca mas el contenido a el formato que presentan herramientas como CHATGPT que es una herramientas que estoy utilizando mucho para crear esta wiki FSF. */
/* Nota: En el skin Timeless, los encabezados utilizan márgenes amplios por defecto, lo que genera espacios grandes entre secciones. Los valores típicos son: h1 (1.4em arriba / 0.6em abajo), h2 (1.2em / 0.5em), h3 (1em / 0.4em) y h4–h6 (0.8–0.6em / 0.3–0.2em). Si se desea un estilo más compacto, estos márgenes pueden ajustarse mediante CSS en '''MediaWiki:Common.css'''.*/</small>
h2 { margin-top: 0.25em !important; margin-bottom: 0.10em !important;}
h3 { margin-top: 0.20em !important; margin-bottom: 0.05em !important;}
h4 { margin-top: 0.15em !important; margin-bottom: 0.03em !important;}
h5 { margin-top: 0.10em !important; margin-bottom: 0.02em !important;}
h6 { margin-top: 0.10em !important; margin-bottom: 0.02em !important;}