Updated rainbow animation
This commit is contained in:
parent
3482c02fc5
commit
fee70fac7c
|
@ -51,21 +51,19 @@
|
||||||
.tag {background:var(--primary);color:var(--contrast);font-size:0.8em;font-weight:600;padding:0.1em 0.3em;border-radius:3px;}
|
.tag {background:var(--primary);color:var(--contrast);font-size:0.8em;font-weight:600;padding:0.1em 0.3em;border-radius:3px;}
|
||||||
|
|
||||||
.rainbow-text {
|
.rainbow-text {
|
||||||
background-image: repeating-linear-gradient(90deg, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
|
background-image: repeating-linear-gradient(90deg, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background-size: 800% 800%;
|
background-size: 2000% 2000%;
|
||||||
color: transparent;
|
color: transparent;
|
||||||
background-clip: text;
|
background-clip: text;
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
font-size: 24px;
|
|
||||||
animation: rainbow 4s linear infinite;
|
animation: rainbow 4s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes rainbow {
|
@keyframes rainbow {
|
||||||
0%{background-position:0% 0%}
|
0%{background-position:0% 0%}
|
||||||
50%{background-position:50% 0%}
|
100%{background-position:57.75% 0%}
|
||||||
100%{background-position:100% 0%}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue