diff --git a/src/assets/browsers-light.png b/src/assets/browsers-light.png new file mode 100644 index 0000000..24bc82b Binary files /dev/null and b/src/assets/browsers-light.png differ diff --git a/src/assets/browsers.png b/src/assets/browsers.png index 88ec75e..897b048 100644 Binary files a/src/assets/browsers.png and b/src/assets/browsers.png differ diff --git a/src/components/Community.astro b/src/components/Community.astro index babbdfc..8413fb0 100644 --- a/src/components/Community.astro +++ b/src/components/Community.astro @@ -9,9 +9,9 @@ import { getTitleAnimation } from '../animations'
- + <Title class="px-4 font-bold"> <motion.span client:load {...getTitleAnimation(0.2)}> Community </motion.span> @@ -20,14 +20,14 @@ import { getTitleAnimation } from '../animations' <motion.p client:load {...getTitleAnimation(0.6)} - className="px-4 lg:w-1/2 lg:px-0" + 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. </motion.p> <div - class="mt-6 flex w-full flex-wrap justify-center gap-3 px-4 sm:gap-10 sm:px-0" + class="mt-6 flex w-full flex-wrap md:justify-center gap-3 px-4 sm:gap-10 sm:px-0" > <motion.span client:load {...getTitleAnimation(0.8)}> <Button class:list={['px-4']} href="https://github.com/zen-browser"> diff --git a/src/components/Features.astro b/src/components/Features.astro index 621e7cd..c84db1b 100644 --- a/src/components/Features.astro +++ b/src/components/Features.astro @@ -20,13 +20,13 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations' <div class="flex w-full flex-col items-center gap-24 xl:gap-48"> <div class="w-full flex flex-col px-2 md:px-12 lg:px-24 xl:text-center"> <motion.span client:load {...getTitleAnimation(0.2)}> - <Title class="font-bold" + <Description class="text-6xl font-bold" >How does zen <br class="lg:hidden" />keep <u class="font-extrabold">you</u><br class="hidden lg:block" /> always <span class="font-extrabold text-coral">organized</span - >?? @@ -38,7 +38,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'
- + Workspaces

@@ -58,7 +58,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'

- + Compact Mode

@@ -78,7 +78,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'

- + Zen Glance

@@ -98,7 +98,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'

- + Split Views

@@ -117,7 +117,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'

- + Sidebar

diff --git a/src/components/Hero.astro b/src/components/Hero.astro index 4e9cfab..951947d 100644 --- a/src/components/Hero.astro +++ b/src/components/Hero.astro @@ -4,6 +4,7 @@ import Description from '../components/Description.astro' import Button from '../components/Button.astro' import { Image } from 'astro:assets' import myImage from '../assets/browsers.png' +import myImageLight from '../assets/browsers-light.png' import { ArrowRight } from 'lucide-astro' import { motion } from 'motion/react' import { getTitleAnimation } from '../animations' @@ -76,7 +77,13 @@ function getHeroTitleAnimation() { Zen browser + Zen browser diff --git a/src/components/HomeExtras.astro b/src/components/HomeExtras.astro index cdf8a47..f8d0bcf 100644 --- a/src/components/HomeExtras.astro +++ b/src/components/HomeExtras.astro @@ -14,10 +14,10 @@ import { ArrowRight } from 'lucide-astro' import { getTitleAnimation, getZoomInAnimation } from '../animations' --- -

-
+
+
- Our Sponsors + Our Sponsors @@ -39,7 +39,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'
@@ -65,7 +65,7 @@ import { getTitleAnimation, getZoomInAnimation } from '../animations'
-
+