jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-27 03:06:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Delay skeleton loading to prevent flickering

Browse Source
This commit is contained in:
Wendelin 2025-02-18 15:18:53 +01:00
parent 18b2360e46
commit 25a14c87a5
No known key found for this signature in database
1 changed files with 28 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/ha-sidebar.ts
View File

@ -1211,7 +1211,35 @@ class HaSidebar extends SubscribeMixin(LitElement) {
transform: scaleX(var(--scale-direction)); transform: scaleX(var(--scale-direction));
} }
@keyframes skeletonAnimate {
0% {
opacity: 0;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes contentAnimate {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.loading { .loading {
opacity: 0;
animation-name: skeletonAnimate;
animation-duration: 2000ms;
animation-delay: 0;
animation-iteration-count: 1;
animation-fill-mode: forwards;
animation-timing-function: ease-out;
padding: 16px; padding: 16px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;