MediaWiki:Common.css
De FSF
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)
- Edge: mantenga presionada Ctrl mientras pulsa Actualizar, o presione Ctrl+F5
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */
/* ============================
TOC flotado a la derecha
============================ */
#toc,
.mw-parser-output > .toc {
float: right;
width: 400px;
margin-left: 1em;
background-color: #f9f9f9;
border: 1px solid #ccc;
padding: 10px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.06);
transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
#toc:hover,
.mw-parser-output > .toc:hover {
border-color: #d7bfa2;
box-shadow: 0 0 14px rgba(215, 191, 162, 0.4);
}
/* ============================
Evitar solapamiento de contenido
============================ */
#mw-content-text { overflow: hidden; }
/* ============================
Ocultar logo
============================ */
#p-logo, .mw-wiki-logo { display: none; }
/* ============================
HR — Estilo colorido FSF
============================ */
hr {
border: 0;
height: 2px;
margin: 0.3em 0 !important;
border-radius: 2px;
background: linear-gradient(
90deg,
#00527A 0%,
#0093C9 25%,
#00BFD6 50%,
#0093C9 75%,
#00527A 100%
);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
hr:hover {
transform: scale(1.015);
box-shadow: 0 0 10px rgba(0, 147, 201, 0.35);
}
/* ============================
ENCABEZADOS — Estilo elegante
============================ */
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3 {
position: relative;
padding-bottom: 0.45em;
scroll-margin-top: 90px;
color: #00527a;
transition: color 0.3s ease, text-shadow 0.3s ease;
}
/* Compactación real (soluciona espaciado) */
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output h4,
.mw-parser-output h5,
.mw-parser-output h6 {
margin-top: 0.10em !important;
margin-bottom: 0.02em !important;
}
/* Línea inferior */
.mw-parser-output h1::after,
.mw-parser-output h2::after,
.mw-parser-output h3::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 55%;
height: 2px;
background: linear-gradient(
to right,
rgba(255, 244, 230, 0.0) 0%,
rgba(255, 244, 230, 0.55) 50%,
rgba(255, 244, 230, 0.0) 100%
);
border-radius: 4px;
filter: blur(1.8px);
opacity: 0.85;
transition: width 0.45s ease, opacity 0.3s ease, filter 0.45s ease;
}
.mw-parser-output h1:hover::after,
.mw-parser-output h2:hover::after,
.mw-parser-output h3:hover::after {
width: 80%;
opacity: 1;
filter: blur(1.3px);
}
.mw-parser-output h1:hover,
.mw-parser-output h2:hover,
.mw-parser-output h3:hover {
text-shadow: 0px 0px 6px rgba(255, 255, 230, 0.4);
}
/* ============================
MÓVILES
============================ */
@media (max-width: 720px) {
.mw-parser-output h1::after,
.mw-parser-output h2::after,
.mw-parser-output h3::after {
width: 75%;
opacity: 0.9;
}
#toc,
.mw-parser-output > .toc {
font-size: 0.95em;
padding: 0.8em 1em;
}
}
