Initial idea for eastereggs
This commit is contained in:
parent
c576a06e96
commit
36389f75df
4 changed files with 108 additions and 4 deletions
|
|
@ -296,16 +296,40 @@ div.ficha div.description
|
|||
@keyframes image-change
|
||||
{
|
||||
0% { opacity: 0; }
|
||||
|
||||
10% { opacity: 1; }
|
||||
|
||||
50% { opacity: 1; }
|
||||
|
||||
60% { opacity: 0; }
|
||||
|
||||
100% { opacity: 0; }
|
||||
}
|
||||
|
||||
@keyframes shake {
|
||||
0%, 100% { transform: translateX(0); }
|
||||
20%, 60% { transform: translateX(-8px) rotate(-1deg); }
|
||||
40%, 80% { transform: translateX(8px) rotate(1deg); }
|
||||
}
|
||||
|
||||
.animate-shake {
|
||||
animation: shake 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.easteregg-transition {
|
||||
transition: max-height 0.5s ease-in-out, opacity 0.3s ease-in;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.easteregg-hidden {
|
||||
max-height: 0;
|
||||
opacity: 0;
|
||||
padding: 0 1.5rem; /* Maintain horizontal padding space */
|
||||
}
|
||||
|
||||
.easteregg-visible {
|
||||
max-height: 300px; /* Arbitrary large height for expansion */
|
||||
opacity: 1;
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
div.ficha figure img:nth-of-type(1)
|
||||
{ animation-delay: 0s;}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue