astolfo/astolfo.org
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add animations to be used for text

Browse source
This commit is contained in:
Nico 2025-09-03 23:05:03 +10:00
parent c6ac8f1836
commit 98386d6a0e
Signed by: nico
SSH key fingerprint: SHA256:XuacYOrGqRxC3jVFjfLROn1CSvLz85Dec6N7O9Gwu/0
1 changed files with 55 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

56
bundle.css
View file

@ -130,7 +130,7 @@ header {
@keyframes spinin { @keyframes spinin {
0% { 0% {
transform: translateX(-100%); transform: translateX(-100%) translateY(-100%);
} }
100% { 100% {
transform: translateX(0px); transform: translateX(0px);
@ -238,6 +238,60 @@ footer p,hr,div {
font-size: 3rem; font-size: 3rem;
} }
/*
* animations
*/
.spin {
animation: spin 2s infinite linear;
display: inline-block;
color: orange;
}
.hue-change {
animation: hue-change 2s infinite linear;
display: inline-block;
color: orange;
}
.size-big-small {
animation: size-big-small 2s infinite linear;
display: inline-block;
color: orange;
}
@keyframes hue-change {
from {
filter: hue-rotate(0deg);
}
to {
filter: hue-rotate(360deg);
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes size-big-small {
from {
transform: scale(1);
}
40% {
transform: scale(2);
}
80% {
transform: scale(0.75);
}
to {
transform: scale(1);
}
}
/* /*
* responsive webpage * responsive webpage
*/ */