MediaWiki:Common.css

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* Container - size to small thumb only */
.mw-parser-output .cover-preview {
    position: relative !important;
    display: inline-block !important;
    width: 80px !important;
    height: auto !important;
    line-height: 1 !important;
    margin: 0 !important;
}

/* Small thumb - always visible initially */
.mw-parser-output .cover-preview .cover-small,
.mw-parser-output .cover-preview img[style*="width: 80"] {  /* targets small thumb by size */
    display: block !important;
    margin: 0 auto !important;
    width: 80px !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Large preview - hidden by default, absolute positioned */
.mw-parser-output .cover-preview .cover-large,
.mw-parser-output .cover-preview .cover-large img {
    position: absolute !important;
    top: -30px !important;        /* nudge up more if needed */
    left: 90px !important;        /* adjust right nudge for your table */
    z-index: 999 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.25s ease !important;
    background: #fff !important;
    border: 1px solid #888 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.6) !important;
    padding: 4px !important;
    width: 250px !important;      /* enforce size if inline fights */
    height: auto !important;
}

/* On hover: show large, hide small */
.mw-parser-output .cover-preview:hover .cover-large,
.mw-parser-output .cover-preview:hover .cover-large img {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;  /* optional: allow clicking preview if linked */
}

.mw-parser-output .cover-preview:hover .cover-small,
.mw-parser-output .cover-preview:hover img[style*="width: 80"] {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Cell must allow overflow */
.mw-parser-output .wikitable td:first-child,
.mw-parser-output .wikitable th:first-child {
    overflow: visible !important;
    position: relative !important;   /* stacking context fix */
    text-align: center !important;
    padding: 6px 8px !important;     /* compact vertical space */
}

/* Optional: prevent reduced-motion from killing transitions */
@media (prefers-reduced-motion: reduce) {
    .mw-parser-output .cover-preview * {
        transition-duration: 0.01ms !important;  /* tiny duration instead of 0 */
    }
}