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

Subtle peekaboo header for the scroll-driven

Browse source
This commit is contained in:
Lim Chee Aun 2023-11-01 23:41:30 +08:00
parent d9dab6b5ee
commit 706f3f0cc8
1 changed files with 17 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/app.css
View file

@ -1954,9 +1954,26 @@ meter.donut[hidden] {
/* ACCOUNT STATUSES */ /* ACCOUNT STATUSES */
@keyframes peekaboo-header {
from {
opacity: 0;
transform: translateY(10%);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.header-account { .header-account {
font-size: 90% !important; font-size: 90% !important;
cursor: pointer; cursor: pointer;
@supports (animation-timeline: scroll()) {
animation: peekaboo-header 1s linear both;
animation-timeline: scroll();
animation-range: 0 150px;
}
} }
.header-account div { .header-account div {
font-weight: normal; font-weight: normal;