It’s almost Halloween, so one of our moderators made this little easter egg (or halloween pumpkin) for our community. Just find a fitting image file and copy this to your Customization/CSS area.
Ours is live for a few days at Tappara.co
.spinner {
-webkit-animation: pulse 700ms infinite linear;
-moz-animation: pulse 700ms infinite linear;
-ms-animation: pulse 700ms infinite linear;
animation: pulse 700ms infinite linear;
width: 120px;
height: 120px;
background-image: url("https://your-pumpkin-goes-here.png");
border: none;
margin: 50px auto;
}
@-webkit-keyframes pulse {
from {
-webkit-transform: scale3d(0.6, 0.6, 0.6);
}
50% {
-webkit-transform: scale3d(1.0, 1.0, 1.0);
}
to {
-webkit-transform: scale3d(0.6, 0.6, 0.6);
}
}
@-moz-keyframes pulse {
from {
-moz-transform: scale3d(0.6, 0.6, 0.6);
}
50% {
-moz-transform: scale3d(1.0, 1.0, 1.0);
}
to {
-moz-transform: scale3d(0.6, 0.6, 0.6);
}
}
@-o-keyframes pulse {
from {
-o-transform: scale3d(0.6, 0.6, 0.6);
}
50% {
-o-transform: scale3d(1.0, 1.0, 1.0);
}
to {
-o-transform: scale3d(0.6, 0.6, 0.6);
}
}
@-ms-keyframes pulse {
from {
-ms-transform: scale3d(0.6, 0.6, 0.6);
}
50% {
-ms-transform: scale3d(1.0, 1.0, 1.0);
}
to {
-ms-transform: scale3d(0.6, 0.6, 0.6);
}
}
@keyframes pulse {
from {
transform: scale3d(0.6, 0.6, 0.6);
}
50% {
transform: scale3d(1.0, 1.0, 1.0);
}
to {
transform: scale3d(0.6, 0.6, 0.6);
}
}