Files
asimonson1125.github.io/src/static/scss/head.scss
2024-02-25 13:17:18 -06:00

61 lines
1.0 KiB
SCSS

.line {
&:not(:first-child) {
position: absolute;
top: 0;
left: 0;
}
@for $i from 1 through 10 {
&:nth-child(#{$i}) {
// animation:
// clip 6000ms $i * -600ms linear infinite,
// glitch#{$i} 2500ms random(1000) * -1ms linear infinite;
@keyframes glitch#{$i} {
0% {
transform: translateX(0);
}
96% {
transform: translateX(0);
color: #fff;
}
97% {
transform: translateX(random(10) - 5px);
color: #4E9A26;
}
98% {
transform: translateX(random(10) - 5px);
color: #AC1212;
}
99% {
transform: translateX(random(10) - 5px);
color: #fff;
}
100% {
transform: translateX(0);
}
}
}
}
}
@keyframes clip {
0% {
clip-path: polygon(
0 100%,
100% 100%,
100% 120%,
0 120%
);
}
100% {
clip-path: polygon(
0 -20%,
100% -20%,
100% 0%,
0 0
);
}
}