eb-module-magic-shuffle
Version:
Isotope-like grouping, sorting and filtering interface
53 lines (46 loc) • 844 B
CSS
.grid-container {
width: 100%;
height: 10px;
position: relative;
overflow: hidden;
transition: height 200ms ease-in-out;
}
.grid-item {
width: 33.33%;
padding: 5px;
box-sizing: border-box;
will-change: transform;
transition: transform 800ms cubic-bezier(0.215, 0.61, 0.355, 1);
backface-visibility: hidden;
-webkit-font-smoothing: subpixel-antialiased;
z-index: 2;
}
.grid-item,
.grid-group {
position: absolute;
top: 0;
left: 0;
}
.grid-item.invisible {
opacity: 0;
}
@keyframes fade {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.grid-group {
position: absolute;
top: 0;
left: 0;
padding: 5px;
opacity: 0;
z-index: 1;
}
.fade-in {
animation: fade 400ms;
opacity: 1;
}