simono41/phanpy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

First production-stage scroll-driven animation

Browse source
This commit is contained in:
Lim Chee Aun 2023-10-31 15:43:56 +08:00
parent afb80d3dc6
commit b17977a5c7
1 changed files with 15 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/components/account-info.css
View file

@ -424,6 +424,16 @@
display: none; display: none;
} }
@keyframes bye-banner {
20% {
transform: translateY(0);
filter: blur(0) opacity(1);
}
100% {
transform: translateY(8px);
filter: blur(16px) opacity(0.75);
}
}
.sheet .account-container { .sheet .account-container {
border-radius: 16px 16px 0 0; border-radius: 16px 16px 0 0;
overflow-x: hidden; overflow-x: hidden;
@ -455,6 +465,11 @@
margin-top: calc(-1 * var(--banner-overlap)); margin-top: calc(-1 * var(--banner-overlap));
} }
.header-banner:not(.header-is-avatar):not(:hover):not(:active) {
animation: bye-banner 1s linear both;
animation-timeline: scroll();
}
main { main {
margin-top: -8px; margin-top: -8px;
padding-top: 1px; padding-top: 1px;