mirrors/dozzle
1
0
Fork 0
mirror of https://github.com/amir20/dozzle.git synced 2026-01-02 02:57:27 +01:00
Code Issues Projects Releases Wiki Activity

perf: improves animation css to use translate instead

Browse Source
This commit is contained in:
Amir Raminfar
2024-09-09 10:39:54 -07:00
parent 8183b9e70f
commit e841b6cba7
1 changed files with 4 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
assets/components/ScrollableView.vue
View File

@@ -25,7 +25,7 @@
</div>
</div>
<div
class="animate-background h-1 bg-gradient-radial from-primary to-transparent to-70%"
class="animate-background h-1 bg-gradient-radial from-primary to-transparent to-50%"
v-show="!scrollContext.paused && !scrollContext.loading"
></div>
<div ref="scrollObserver" class="h-px"></div>
@@ -95,17 +95,16 @@ function scrollToBottom(behavior: "auto" | "smooth" = "auto") {
}
.animate-background {
animation: gradient-animation 2s ease infinite;
background-position: center;
animation: gradient-animation 3s ease-out infinite;
}
@keyframes gradient-animation {
0%,
100% {
background-size: 100% 100%;
transform: translateX(-25%);
}
50% {
background-size: 140% 120%;
transform: translateX(25%);
}
}
</style>