optovia/webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update webapp - fix hero animation to use cover layout
All checks were successful
Build Docker Image / build (push) Successful in 3m58s
Details

Browse Source 
Use DotLottie's native layout prop with fit: 'cover' instead of
CSS object-cover which doesn't work on canvas elements.
This commit is contained in:
Ruslan Bakiev
2026-01-27 10:54:41 +07:00
parent 7bd4aa37bd
commit 859eef3761
1 changed files with 2 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/components/hero/HeroBackground.vue
View File

@@ -6,7 +6,8 @@
src="/animations/supply-chain.lottie" src="/animations/supply-chain.lottie"
autoplay autoplay
loop loop
class="absolute inset-0 w-full h-full object-cover" :layout="{ fit: 'cover', align: [0.5, 0.5] }"
class="absolute inset-0 w-full h-full"
:style="{ :style="{
opacity: 1 - collapseProgress * 0.7, opacity: 1 - collapseProgress * 0.7,
transform: `scale(${1 + collapseProgress * 0.1})` transform: `scale(${1 + collapseProgress * 0.1})`