MediaWiki:Vector.css
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
/* ==========================================================
TENARIUS RO - SIDEBAR ELEGANTE
Compatible con Vector clásico / Legacy
========================================================== */
body.skin-vector #mw-panel,
#mw-panel {
background: linear-gradient(180deg, #fff7df 0%, #fffaf0 50%, #ffe7a8 100%) !important;
border-right: 1px solid #ead7ad !important;
box-shadow: 8px 0 24px rgba(100,70,20,.12) !important;
padding-top: 12px !important;
}
body.skin-vector #p-logo,
#p-logo {
background: #ffffff !important;
border: 1px solid #ead7ad !important;
border-radius: 18px !important;
margin: 8px 12px 18px 12px !important;
box-shadow: 0 8px 22px rgba(100,70,20,.12) !important;
overflow: hidden !important;
}
/* Cada bloque del sidebar */
body.skin-vector #mw-panel .portal,
#mw-panel .portal {
background: #ffffff !important;
border: 1px solid #ead7ad !important;
border-radius: 18px !important;
margin: 10px 10px 16px 10px !important;
padding: 10px !important;
box-shadow: 0 8px 22px rgba(100,70,20,.12) !important;
overflow: hidden !important;
}
/* Título de cada sección */
body.skin-vector #mw-panel .portal h3,
#mw-panel .portal h3 {
background: linear-gradient(135deg, #8b1e12 0%, #c43b22 65%, #f0a500 100%) !important;
color: #ffffff !important;
border-radius: 13px !important;
padding: 9px 11px !important;
margin: 0 0 10px 0 !important;
font-size: 13px !important;
font-weight: 900 !important;
letter-spacing: .3px !important;
text-transform: none !important;
border: 1px solid rgba(255,255,255,.35) !important;
box-shadow: 0 4px 10px rgba(89,59,5,.18) !important;
}
/* Quitar líneas viejas */
body.skin-vector #mw-panel .portal h3:after,
#mw-panel .portal h3:after {
display: none !important;
}
/* Cuerpo de cada sección */
body.skin-vector #mw-panel .portal .body,
#mw-panel .portal .body {
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
}
/* Listas */
body.skin-vector #mw-panel .portal .body ul,
#mw-panel .portal .body ul {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
/* Items */
body.skin-vector #mw-panel .portal .body li,
#mw-panel .portal .body li {
margin: 4px 0 !important;
padding: 0 !important;
}
/* Links */
body.skin-vector #mw-panel .portal .body li a,
#mw-panel .portal .body li a {
display: block !important;
color: #5b2500 !important;
background: #fffaf0 !important;
border: 1px solid transparent !important;
border-radius: 11px !important;
padding: 8px 10px !important;
font-size: 13px !important;
font-weight: 700 !important;
line-height: 1.35 !important;
text-decoration: none !important;
transition: all .18s ease !important;
}
/* Hover */
body.skin-vector #mw-panel .portal .body li a:hover,
#mw-panel .portal .body li a:hover {
color: #8b1e12 !important;
background: #fff1c4 !important;
border-color: #e0b94f !important;
box-shadow: 0 4px 12px rgba(100,70,20,.14) !important;
transform: translateX(4px) !important;
}
/* Link seleccionado */
body.skin-vector #mw-panel .portal .body li.selected a,
#mw-panel .portal .body li.selected a {
background: linear-gradient(135deg, #ffd454 0%, #ffe7a8 100%) !important;
color: #4b2500 !important;
border-color: #d99b00 !important;
font-weight: 900 !important;
}
/* Buscador */
body.skin-vector #p-search,
#p-search {
background: #ffffff !important;
border: 1px solid #ead7ad !important;
border-radius: 18px !important;
margin: 10px 10px 16px 10px !important;
padding: 10px !important;
box-shadow: 0 8px 22px rgba(100,70,20,.12) !important;
}
body.skin-vector #searchInput,
#searchInput {
background: #fffaf0 !important;
border: 1px solid #ead7ad !important;
border-radius: 10px !important;
color: #5b2500 !important;
font-weight: 700 !important;
}
body.skin-vector #searchButton,
body.skin-vector #mw-searchButton,
#searchButton,
#mw-searchButton {
background: linear-gradient(135deg, #8b1e12 0%, #c43b22 100%) !important;
color: #ffffff !important;
border: 1px solid #8b1e12 !important;
border-radius: 10px !important;
font-weight: 900 !important;
}
/* Scroll bonito */
body.skin-vector #mw-panel,
#mw-panel {
scrollbar-width: thin;
scrollbar-color: #c43b22 #fff1c4;
}
body.skin-vector #mw-panel::-webkit-scrollbar,
#mw-panel::-webkit-scrollbar {
width: 8px;
}
body.skin-vector #mw-panel::-webkit-scrollbar-track,
#mw-panel::-webkit-scrollbar-track {
background: #fff1c4;
}
body.skin-vector #mw-panel::-webkit-scrollbar-thumb,
#mw-panel::-webkit-scrollbar-thumb {
background: #c43b22;
border-radius: 999px;
}