@use '@lucca-front/scss/src/commons/utils/namespace';

@mixin component($atRoot: namespace.$defaultAtRoot) {
	@at-root ($atRoot) {
		.skeleton-item {
			animation: skeletonFade var(--commons-animations-durations-fast) ease-in 1 forwards;
		}
	}

	// fades content in on load
	@keyframes skeletonFade {
		0% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}
}