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: add Features component and update Community section layout

Browse source
This commit is contained in:
mr. M 2025-03-08 16:41:56 +01:00
parent 5dc5df961a
commit 5bbf42140c
No known key found for this signature in database
GPG key ID: CBD57A2AEDBDA1FB
8 changed files with 206 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/components/Community.astro
View file

@ -4,18 +4,18 @@ import Button from '../components/Button.astro'
import { motion } from 'motion/react'
import { Github, Check } from 'lucide-astro'
import { getTitleAnimation } from '../animations'
import Video from './Video.astro'
import WorkspacesVideo from '../assets/Workspaces.mp4'
import ComImage from '../assets/ComImage.png'
import Image from 'astro/components/Image.astro'
---
<section
id="Community"
class="relative flex w-full flex-col items-center px-4 text-start md:px-0 md:text-center lg:py-36"
class="relative flex w-full flex-col items-center px-4 text-start md:px-0 md:text-center lg:pt-36"
>
<Description class="mb-2 px-4 text-6xl font-bold">
<motion.span client:load {...getTitleAnimation(0.2)}> What </motion.span>
<motion.span client:load {...getTitleAnimation(0.4)}> Defines </motion.span>
<motion.span client:load {...getTitleAnimation(0.6)}> Zen? </motion.span>
<motion.span client:load {...getTitleAnimation(0.2)}> Our </motion.span>
<motion.span client:load {...getTitleAnimation(0.4)}> Core </motion.span>
<motion.span client:load {...getTitleAnimation(0.6)}> Values </motion.span>
</Description>
<motion.p
client:load
@ -57,14 +57,10 @@ import WorkspacesVideo from '../assets/Workspaces.mp4'
client:load
{...getTitleAnimation(1.4)}
>
<Video
src={WorkspacesVideo}
autoplay
loop
muted
playsinline
preload="none"
class="mb-24 mt-12 rounded-3xl shadow-md lg:mx-auto lg:w-3/4 dark:opacity-80"
<Image
src={ComImage}
alt="Community"
class="my-24 rounded-3xl shadow-md lg:mx-auto lg:w-4/5 dark:opacity-80"
/>
</motion.span>
</section>