From 369f5afb431b953a679219ff7c1097bd91c956c5 Mon Sep 17 00:00:00 2001
From: ameer2468 <33054370+ameer2468@users.noreply.github.com>
Date: Fri, 20 Sep 2024 13:59:46 +0300
Subject: [PATCH] download buttons

---
 apps/landing/src/app/page-sections/mobile.tsx | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/apps/landing/src/app/page-sections/mobile.tsx b/apps/landing/src/app/page-sections/mobile.tsx
index 00b521671..7ca446a3e 100644
--- a/apps/landing/src/app/page-sections/mobile.tsx
+++ b/apps/landing/src/app/page-sections/mobile.tsx
@@ -1,4 +1,11 @@
+'use client';
+
+import { GooglePlayLogo } from '@phosphor-icons/react';
+import { Apple } from '@sd/assets/svgs/brands';
 import Image from 'next/image';
+import { tw } from '@sd/ui';
+
+const DownloadButton = tw.button`flex w-fit flex-row items-center gap-2 rounded-lg border border-zinc-800 bg-zinc-900 p-2.5 text-[13px] transition-all duration-300 hover:border-zinc-700 hover:bg-zinc-800`;
 
 const Mobile = () => {
 	return (
@@ -29,6 +36,16 @@ const Mobile = () => {
 					Using the mobile app, you can sync your files across all your devices. Take your
 					personal data with you wherever you are!
 				</p>
+				<div className="mx-auto mt-4 flex flex-row flex-wrap justify-center gap-4">
+					<DownloadButton>
+						<GooglePlayLogo />
+						Open Play Store
+					</DownloadButton>
+					<DownloadButton>
+						<Apple className="size-4" />
+						Open App Store
+					</DownloadButton>
+				</div>
 			</div>
 		</div>
 	);