feat: remove unused assets and update release notes with new features and improvements

src/components/Community.astro

@@ -1,30 +1,30 @@
 ---
-import Title from '../components/Title.astro'
 import Description from '../components/Description.astro'
 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'
 ---
 
 <section
   id="Community"
-  class="relative flex w-full flex-col items-center px-4 text-start md:px-0 md:text-center lg:py-24"
+  class="relative flex w-full flex-col items-center px-4 text-start md:px-0 md:text-center lg:py-36"
 >
-  <Title class="px-4 font-bold">
-    <motion.span client:load {...getTitleAnimation(0.2)}>
-      Community
-    </motion.span>
-    <motion.span client:load {...getTitleAnimation(0.4)}> Driven </motion.span>
-  </Title>
+  <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>
+  </Description>
   <motion.p
     client:load
     {...getTitleAnimation(0.6)}
     className="px-4 md:px-24 lg:w-1/2 lg:px-0"
   >
-    We are a community-driven project. We listen to our users and build the
-    features they want. Zen focuses on privacy and customization, not on data
-    collection.
+    We make it not only a priority but a necessity to ensure that Zen provides
+    always the best experience for you. We are committed to making Zen the most
+    beautiful, productive, and privacy-focused browser out there.
   </motion.p>
   <div
     class="mt-6 flex w-full flex-wrap gap-3 px-4 sm:gap-10 sm:px-0 md:justify-center"
@@ -32,7 +32,7 @@ import { getTitleAnimation } from '../animations'
     <motion.span client:load {...getTitleAnimation(0.8)}>
       <Button class:list={['px-4']} href="https://github.com/zen-browser">
         <Github class="size-4" />
-        <span>View on GitHub</span>
+        <span>Free and open-source</span>
       </Button>
     </motion.span>
     <motion.div
@@ -41,7 +41,7 @@ import { getTitleAnimation } from '../animations'
       className="flex items-center gap-4"
     >
       <Check class="size-4" />
-      <span>Always on the latest version of Firefox</span>
+      <span>Simple yet powerful</span>
     </motion.div>
     <motion.div
       client:load
@@ -49,7 +49,22 @@ import { getTitleAnimation } from '../animations'
       className="flex items-center gap-4"
     >
       <Check class="size-4" />
-      <span>Privacy-focused</span>
+      <span>True privacy and always up-to-date</span>
     </motion.div>
   </div>
+  <motion.span
+    className="flex max-w-full px-8 lg:max-w-none lg:flex-none lg:px-0"
+    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"
+    />
+  </motion.span>
 </section>