fix(ui): slow script loading hides TOC fade-up effect in desktop (#2120)

This commit is contained in:
Cotes Chung 2024-12-15 14:51:51 +08:00 committed by GitHub
parent 1b4e318dc1
commit e0c3fafa47
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -220,14 +220,11 @@ header {
@-webkit-keyframes fade-up { @-webkit-keyframes fade-up {
from { from {
opacity: 0; opacity: 0;
position: relative; margin-top: 4rem;
top: 2rem;
} }
to { to {
opacity: 1; opacity: 1;
position: relative;
top: 0;
} }
} }
@ -247,6 +244,7 @@ header {
%top-cover { %top-cover {
content: ''; content: '';
display: block; display: block;
position: -webkit-sticky;
position: sticky; position: sticky;
top: 0; top: 0;
width: 100%; width: 100%;
@ -257,13 +255,16 @@ header {
#toc-wrapper { #toc-wrapper {
top: 0; top: 0;
transition: top 0.2s ease-in-out; transition: top 0.2s ease-in-out;
-webkit-animation: fade-up 0.8s;
animation: fade-up 0.8s;
overflow-y: auto; overflow-y: auto;
max-height: 100vh; max-height: 100vh;
scrollbar-width: none; scrollbar-width: none;
margin-top: 2rem; margin-top: 2rem;
&:not(.invisible) {
-webkit-animation: fade-up 0.8s;
animation: fade-up 0.8s;
}
ul { ul {
list-style: none; list-style: none;
font-size: 0.85rem; font-size: 0.85rem;