MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* Hover cover preview */ | /* Hover cover preview (zoom the existing thumb) */ | ||
.coverThumb { | .coverThumb{ | ||
position: relative; | position: relative; | ||
display: inline-block; | display: inline-block; | ||
z-index: 1; | |||
} | } | ||
.coverSmall{ | |||
width: 60px; | width: 60px; | ||
height: 80px; | height: 80px; | ||
| Line 29: | Line 13: | ||
align-items: center; | align-items: center; | ||
justify-content: center; | justify-content: center; | ||
} | |||
/* smooth zoom */ | |||
.coverSmall img{ | |||
transition: transform 120ms ease; | |||
transform-origin: top left; | |||
} | |||
/* allow zoom to escape the box */ | |||
.coverThumb:hover .coverSmall{ | |||
overflow: visible; | |||
z-index: 99999; | |||
} | |||
/* zoom + move to the right like a popup */ | |||
.coverThumb:hover .coverSmall img{ | |||
transform: translate(70px,-10px) scale(3); | |||
background: #fff; | |||
border: 1px solid #aaa; | |||
box-shadow: 0 2px 10px rgba(0,0,0,0.25); | |||
} | } | ||
Revision as of 09:28, 29 January 2026
/* Hover cover preview (zoom the existing thumb) */
.coverThumb{
position: relative;
display: inline-block;
z-index: 1;
}
.coverSmall{
width: 60px;
height: 80px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
/* smooth zoom */
.coverSmall img{
transition: transform 120ms ease;
transform-origin: top left;
}
/* allow zoom to escape the box */
.coverThumb:hover .coverSmall{
overflow: visible;
z-index: 99999;
}
/* zoom + move to the right like a popup */
.coverThumb:hover .coverSmall img{
transform: translate(70px,-10px) scale(3);
background: #fff;
border: 1px solid #aaa;
box-shadow: 0 2px 10px rgba(0,0,0,0.25);
}