Template:Stonecutting/styles.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 19: | Line 19: | ||
@keyframes sc-cycle { | @keyframes sc-cycle { | ||
0% { opacity: 1; } /* visible for the first step-interval */ | 0% { opacity: 1; } /* visible for the first step-interval */ | ||
99% { opacity: 1; } /* stays visible until its time slot ends */ | |||
100% { opacity: 0; } /* then snaps off */ | |||
} | } | ||
Revision as of 02:47, 14 June 2025
.stonecutting-carousel {
position: relative;
}
/* every frame sits on top of each other */
.sc-frame {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0; /* hidden by default */
animation: sc-cycle 12s steps(1) infinite;
/* 12 s = 3 frames × 4 s each; adjust if you add more frames + delays */
}
/* instant on/off – no cross-fade */
@keyframes sc-cycle {
0% { opacity: 1; } /* visible for the first step-interval */
99% { opacity: 1; } /* stays visible until its time slot ends */
100% { opacity: 0; } /* then snaps off */
}
/* slots are placed absolutely by the Lua module */
.sc-slot {
position: absolute;
width: 32px;
height: 32px;
}