Package name showing up on css background image url helium mixin

I am trying to put css in a mixin
when I put the path to my image in the theme folder I get the app package prefix in the url and it doesent find the image


tried without the quotes… and its still putting that package path there…

Also, I am trying to have an mp4 video or webm video as background… i tried accessing it and the browser http://localhost:8080/app/VAADIN/themes/helium/images/fondo.mp4
it works

I tried background-image: url(images/fondo.mp4);
I edited the css on the developer tools and it doesent work.

Thank you for your support


Without a file structure, it’s hard to provide a solution. I can only assume that the images directory is placed within the theme root folder and the style definition in the helium-ext.scss file that is located in the com.dynamoware.ambient directory. In this case, the correct image url is "../images/logoColor.png", e.g.:

background-image: url("../images/logoColor.png");


Balshoi spasibo for answering on a weekend Mr. Gorelov
YES !!! that worked for the images… I was very confused to see a package name in the css.
Thank you for the help…

Finally is there any clue on how to put an mp4 as a background for a vbox?

A video can’t be used as a background for a layout because the background-image attribute doesn’t support video files.

Thanks for your response… Is there any way to put a background video in a vbox in Cuba?

Convert video to gif and use as background-image.

mp4 = 415kb
gif =8mb…
There is no compression on gif files… I was able to manage with a .webp file it works in the background-image

thanks for all your help !!!