add fading effect for inactive images

This commit is contained in:
Spedon
2023-03-10 17:01:27 +08:00
parent ceabfeaac8
commit 0dfe6178b9

View File

@@ -1,14 +1,20 @@
.image { .image {
max-height: 45vmin; height: 55vmin;
width: auto;
position: absolute; position: absolute;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
img {
height: 55vmin;
width: auto;
}
} }
.image[data-status="inactive"] { .inactive {
display: none; opacity: 0;
transition: opacity 300ms ease-in-out;
} }
.image[data-status="active"] { .active {
display: block; opacity: 1;
transition: opacity 0ms ease-in-out;
} }