quickshell/quickshell-web
3
1
Fork 0
Code Issues Projects Activity

fix: layout jump on video loading

Browse source
This commit is contained in:
Oleksandr 2026-02-17 19:02:00 +02:00 • committed by outfoxxed
parent dff66ef779
commit bb43a9ca6c
Signed by: outfoxxed
GPG key ID: 4C88A185FB89301E
2 changed files with 28 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

27
src/components/marquee/MarqueeContent.astro
View file

@ -44,18 +44,21 @@ const videos = [
{videos.map(({ author, source, installable, path }, index) => {
return (
<div class=`marquee-item`>
<video
data-media-index={index}
data-media-author={author}
id="showcase-video"
class="marquee-item-spacing marquee-item-content"
muted
controls
playsinline
preload="metadata"
>
<source src={path} type="video/mp4"/>
</video>
<div class="marquee-item-spacing marquee-item-content video-wrapper">
<video
data-media-index={index}
data-media-author={author}
id="showcase-video"
muted
controls
playsinline
preload="metadata"
style="opacity: 0; transition: opacity 0.5s"
onloadeddata="this.style.opacity='1'"
>
<source src={path} type="video/mp4"/>
</video>
</div>
<p>
Configuration by <Fragment set:html={author}/>
{source && !installable && <>(<a href={source}>source code</a>)</>}