80 lines
1.2 KiB
CSS
80 lines
1.2 KiB
CSS
@keyframes colorAnimation {
|
|
100%,
|
|
0% {
|
|
color: rgb(255, 0, 0);
|
|
}
|
|
8% {
|
|
color: rgb(255, 127, 0);
|
|
}
|
|
16% {
|
|
color: rgb(255, 255, 0);
|
|
}
|
|
25% {
|
|
color: rgb(127, 255, 0);
|
|
}
|
|
33% {
|
|
color: rgb(0, 255, 0);
|
|
}
|
|
41% {
|
|
color: rgb(0, 255, 127);
|
|
}
|
|
50% {
|
|
color: rgb(0, 255, 255);
|
|
}
|
|
58% {
|
|
color: rgb(0, 127, 255);
|
|
}
|
|
66% {
|
|
color: rgb(0, 0, 255);
|
|
}
|
|
75% {
|
|
color: rgb(127, 0, 255);
|
|
}
|
|
83% {
|
|
color: rgb(255, 0, 255);
|
|
}
|
|
91% {
|
|
color: rgb(255, 0, 127);
|
|
}
|
|
}
|
|
|
|
@keyframes borderAnimation {
|
|
100%,
|
|
0% {
|
|
border-bottom-color: rgb(255, 0, 0);
|
|
}
|
|
8% {
|
|
border-bottom-color: rgb(255, 127, 0);
|
|
}
|
|
16% {
|
|
border-bottom-color: rgb(255, 255, 0);
|
|
}
|
|
25% {
|
|
border-bottom-color: rgb(127, 255, 0);
|
|
}
|
|
33% {
|
|
border-bottom-color: rgb(0, 255, 0);
|
|
}
|
|
41% {
|
|
border-bottom-color: rgb(0, 255, 127);
|
|
}
|
|
50% {
|
|
border-bottom-color: rgb(0, 255, 255);
|
|
}
|
|
58% {
|
|
border-bottom-color: rgb(0, 127, 255);
|
|
}
|
|
66% {
|
|
border-bottom-color: rgb(0, 0, 255);
|
|
}
|
|
75% {
|
|
border-bottom-color: rgb(127, 0, 255);
|
|
}
|
|
83% {
|
|
border-bottom-color: rgb(255, 0, 255);
|
|
}
|
|
91% {
|
|
border-bottom-color: rgb(255, 0, 127);
|
|
}
|
|
}
|