Diferencia entre revisiones de «MediaWiki:Common.css»

De Wiki de Aldor
Ir a la navegación Ir a la búsqueda
(Página creada con «→‎Los estilos CSS colocados aquí se aplicarán a todas las apariencias: →‎Estilo para el enlace de Discord en el Sidebar: →‎CONTENEDOR PRINCIPAL: #p-Discord .body, #p-Discord .portal-body, #p-Discord .vector-menu-content { margin-left: 0 !important; padding: 8px 0 !important; display: flex !important; justify-content: center !important; } #p-Discord ul { list-style: none !important; margin: 0 !important; padding: 0 !important;…»)
 
m
Línea 2: Línea 2:




/* Estilo para el enlace de Discord en el Sidebar */
/* Botón Discord en sidebar — Common.css — Vector legacy */
/* CONTENEDOR PRINCIPAL */
 
#p-Discord .body, #p-Discord .portal-body, #p-Discord .vector-menu-content {
#p-Discord .vector-menu-content {
    margin-left: 0 !important;
     padding: 8px 10px !important; /* margen lateral real del contenedor */
     padding: 8px 0 !important;
     display: block !important;
     display: flex !important;
    justify-content: center !important;
}
}


#p-Discord ul {
#p-Discord ul.vector-menu-content-list {
     list-style: none !important;
     list-style: none !important;
     margin: 0 !important;
     margin: 0 !important;
     padding: 0 !important;
     padding: 0 !important;
     width: 100% !important;
     width: 100% !important;
    display: flex !important;
    justify-content: center !important;
}
}


#p-Discord li {
#p-Discord li.mw-list-item {
     margin: 0 !important;
     margin: 0 !important;
     padding: 0 !important;
     padding: 0 !important;
     width: 85% !important; /* Ancho del botón dentro de la sidebar */
     width: 100% !important; /* ocupa todo el ancho disponible, el margen ya lo da el padding del contenedor */
}
}


/* BOTÓN + LOGO - no funciona bien, repasar */
#p-Discord a {
#p-Discord a,
#p-Discord a.external,
#p-Discord a[href^="https://"],
#p-Discord a[href^="http://"] {
     display: flex !important;
     display: flex !important;
     align-items: center !important;
     align-items: center !important;
     justify-content: center !important;
     justify-content: center !important;
   
 
    /* Fondo azul + Logo */
     background-color: #5865F2 !important;
     background-color: #5865F2 !important;  
     background-image: url("https://wiki.aldor.es/images/f/fb/Discord-Symbol-White.png") !important;
      
     background-repeat: no-repeat !important;
     background-repeat: no-repeat !important;
     background-position: 15px center !important; /* Coloca el logo a la izquierda dentro del botón */
     background-position: 12px center !important;
     background-size: 18px 18px !important;       /* Tamaño del icono */
     background-size: 18px auto !important; /* corregido: mantiene proporción real del PNG */
   
 
     color: white !important;
     color: #FFFFFF !important;
     text-align: center !important;
     text-align: center !important;
     padding: 10px 12px 10px 38px !important;   /* Deja 38px a la izquierda para que el texto no pise al logo */
     padding: 10px 12px 10px 38px !important;
     border-radius: 5px !important;
     border-radius: 5px !important;
     font-weight: bold !important;
     font-weight: bold !important;
     text-decoration: none !important;
     text-decoration: none !important;
     transition: background-color 0.2s ease !important;
     transition: background-color 0.15s ease !important;
     font-size: 0.9em !important;
     font-size: 0.9em !important;
     box-shadow: 0 1px 3px rgba(0,0,0,0.15) !important;
     box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important;
    box-sizing: border-box !important;
     width: 100% !important;
     width: 100% !important;
    box-sizing: border-box !important;
}
}


/* Efecto al pasar el ratón */
#p-Discord a:hover {
#p-Discord a:hover,
#p-Discord a.external:hover {
     background-color: #4752C4 !important;
     background-color: #4752C4 !important;
     text-decoration: none !important;
     color: #FFFFFF !important;
}
}

Revisión del 07:59 25 ago 2026

/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */


/* Botón Discord en sidebar — Common.css — Vector legacy */

#p-Discord .vector-menu-content {
    padding: 8px 10px !important; /* margen lateral real del contenedor */
    display: block !important;
}

#p-Discord ul.vector-menu-content-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

#p-Discord li.mw-list-item {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important; /* ocupa todo el ancho disponible, el margen ya lo da el padding del contenedor */
}

#p-Discord a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background-color: #5865F2 !important;
    background-image: url("https://wiki.aldor.es/images/f/fb/Discord-Symbol-White.png") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px auto !important; /* corregido: mantiene proporción real del PNG */

    color: #FFFFFF !important;
    text-align: center !important;
    padding: 10px 12px 10px 38px !important;
    border-radius: 5px !important;
    font-weight: bold !important;
    text-decoration: none !important;
    transition: background-color 0.15s ease !important;
    font-size: 0.9em !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#p-Discord a:hover {
    background-color: #4752C4 !important;
    color: #FFFFFF !important;
}