ZenBrowserMirrors/www
1
0
Fork 0
mirror of https://github.com/zen-browser/www.git synced 2025-07-07 17:05:32 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat(sticky-features): make features videos sticky

Browse source
This commit is contained in:
taroj1205 2025-05-19 19:28:23 +12:00
parent cbe48b89ce
commit c8dae6b376
No known key found for this signature in database
GPG key ID: 0FCB6CFFE0981AB7
1 changed files with 41 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

82
src/components/Features.astro
View file

@ -126,45 +126,47 @@ const descriptions = Object.values(features.featureTabs).map((tab) => tab.descri
</div>
</div>
<div class="relative w-full lg:w-3/5">
<div class="video-stack relative h-full w-full">
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={WorkspacesVideo}
data-active="true"
/>
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={CompactModeVideo}
/>
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={GlanceVideo}
/>
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={SplitViewsVideo}
/>
<div class="sticky top-6 w-full lg:w-3/5 h-fit">
<div class="relative w-full">
<div class="video-stack relative h-full w-full">
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={WorkspacesVideo}
data-active="true"
/>
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={CompactModeVideo}
/>
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={GlanceVideo}
/>
<Video
autoplay
loop
muted
playsinline
preload="none"
class="feature-video"
src={SplitViewsVideo}
/>
</div>
</div>
</div>
</div>
@ -271,8 +273,6 @@ const descriptions = Object.values(features.featureTabs).map((tab) => tab.descri
@apply aspect-video;
perspective: 2000px;
transform-style: preserve-3d;
position: sticky;
top: 0;
}
.feature-video {