Cómo solucionar problemas de temas CSS en la UI web de Proxmox y otras interfaces ExtJS
Problema En entornos de homelab y virtualización es frecuente personalizar la interfaz web de herramientas como Proxmox, OpenNebula o cualquier aplicación construida sobre ExtJS. El objetivo es mejorar la estética o adaptar colores a un esquema propio. Sin embargo, al aplicar un tema CSS se pueden presentar dos síntomas recurrentes: Confusión entre fila seleccionada y fila bajo el cursor – los estilos :hover y .x-grid-item-selected comparten la misma regla de color, de modo que el usuario no distingue qué elemento está realmente activo. Rotura del layout después de una actualización del paquete – el instalador del tema guarda una copia del archivo CSS original y la restaura en cada upgrade. Si la actualización incluye un nuevo stylesheet, el script sobrescribe el nuevo archivo con la copia antigua, dejando la UI “pegada” a una versión obsoleta del tema base. Estos problemas no son exclusivos de Proxmox; cualquier aplicación que dependa de ExtJS para medir geometría en tiempo de renderizado sufre cuando el tema altera propiedades que afectan al cálculo de tamaños (peso de fuente, letter-spacing, padding, bordes). El resultado son botones con texto recortado, columnas de tabla desalineadas o sombras que aparecen fuera de lugar. ...