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.

/* Ensure the table cell doesn't clip anything */
.wikitable td {
    overflow: visible !important;
}

/* The outer container */
.coverThumb {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

/* The wrapper that forces the 60x80 size */
.coverSmall {
    display: block;
    width: 60px;
    height: 80px;
    overflow: visible; 
}

/* Target the image directly using the class from the template */
.mw-parser-output .coverSmall img.zoom-img {
    transition: transform 0.2s ease-in-out !important;
    transform-origin: center center;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

/* The Hover Effect */
.coverThumb:hover {
    z-index: 9999 !important;
}

.coverThumb:hover .coverSmall img.zoom-img {
    transform: scale(4) !important; /* Zooms from center */
    z-index: 10000 !important;
    border: 1px solid #aaa !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important;
    background-color: #fff !important;
    
    /* Override MediaWiki's hardcoded attributes */
    max-width: none !important;
    height: auto !important;
}

/* Ensure the link doesn't interfere */
.coverSmall a {
    display: block;
    overflow: visible;
}