This commit is contained in:
thebluedev
2024-08-24 15:17:00 +05:30
3 changed files with 8 additions and 8 deletions

View File

@@ -28,6 +28,7 @@ import {
UpdateIcon,
} from "@radix-ui/react-icons";
import Image from "next/image";
import Link from "next/link";
import { Button } from './ui/button';
import { COLORS } from './create-theme';
import { Slider } from './ui/slider';
@@ -117,8 +118,6 @@ export default function Features() {
</Sticky>
</div>
<div className="relative md:grid border-t-2 md:border-l-2 md:col-span-2 md:grid-cols-2 row-span-2">
<div className="w-1/2 absolute md:relative z-[-1] opacity-50 md:opacity-1 md:w-full h-full border-r-2 md:border-r"></div>
<div className="w-1/2 absolute md:relative z-[-1] hidden md:block md:w-full h-full border-l"></div>
<div className="p-16 md:px-32 h-full md:absolute top-0 left-0 flex flex-col">
<div className="">
<div>
@@ -129,7 +128,7 @@ export default function Features() {
We are always looking for ways to make your experience better. With stackable themes that can be mixed and matched, you can create a browser that is truly yours. <a className="text-blue-500" href="https://docs.zen-browser.app/themes-store/themes-marketplace">Learn more</a>
</p>
</div>
<Button className="mt-4 rounded-full p-5 ml-auto">Download zen now!</Button>
<Link href="/download"><Button className="mt-4 rounded-full p-5 ml-auto">Download Zen now!</Button></Link>
</div>
<div className="border rounded-lg shadow-md mt-16 mx-auto p-4 bg-white dark:bg-black flex w-fit transform -translate-x-1/3">
{COLORS.map((color) => (
@@ -148,8 +147,6 @@ export default function Features() {
</div>
</div>
<div className="relative md:grid md:border-l-2 border-t-2 md:col-span-2 grid-cols-2 row-span-2">
<div className="w-1/2 absolute md:relative z-[-1] opacity-50 md:opacity-1 md:w-full h-full border-r-2 md:border-r"></div>
<div className="w-1/2 absolute md:relative z-[-1] hidden md:block md:w-full h-full border-l"></div>
<div className="p-16 md:px-32 h-full md:absolute top-0 left-0 flex flex-col">
<div className="flex flex-col md:flex-row">
<div className='relative'>
@@ -163,7 +160,7 @@ export default function Features() {
Killer feature
</div>
</div>
<Button className="mt-4 rounded-full p-5 ml-4">Download zen now!</Button>
<Link href="/download"><Button className="mt-4 rounded-full p-5 ml-4">Download Zen now!</Button></Link>
</div>
<img src="/compact-mode.png" className="scale-105 hover:scale-110 transform rotate-[-2deg] transition-all duration-100 rounded-md w-full shadow-md dark:shadow-none dark:border-2 mt-16 border-blue-600" />
</div>