diff --git a/website/components/DownloadButton.tsx b/website/components/DownloadButton.tsx
new file mode 100644
index 00000000..d1126713
--- /dev/null
+++ b/website/components/DownloadButton.tsx
@@ -0,0 +1,80 @@
+import {
+ Menu,
+ ButtonGroup,
+ Button,
+ MenuButton,
+ IconButton,
+ MenuList,
+ MenuItem,
+ Link as Anchor,
+} from "@chakra-ui/react";
+import { Platform, usePlatform } from "hooks/usePlatform";
+import React from "react";
+import { FaCaretDown } from "react-icons/fa";
+
+const baseURL = "https://github.com/KRTirtho/spotube/releases/latest/download/";
+
+const DownloadLinks = Object.freeze({
+ [Platform.linux]: [
+ { name: "deb", url: baseURL + "Spotube-linux-x86_64.deb" },
+ { name: "tar", url: baseURL + "Spotube-linux-x86_64.tar.xz" },
+ { name: "AppImage", url: baseURL + "Spotube-linux-x86_64.AppImage" },
+ ],
+ [Platform.android]: [
+ {
+ name: "apk",
+ url: baseURL + "Spotube-android-all-arch.apk",
+ },
+ ],
+ [Platform.mac]: [{ name: "dmg", url: baseURL + "Spotube-macos-x86_64.dmg" }],
+ [Platform.windows]: [
+ { name: "exe", url: baseURL + "Spotube-windows-x86_64-setup.exe" },
+ { name: "nupkg", url: baseURL + "Spotube-windows-x86_64.nupkg " },
+ ],
+});
+
+const DownloadButton = () => {
+ const platform = usePlatform();
+
+ const allPlatforms = Object.entries(Platform)
+ .map(([, value]) => {
+ return DownloadLinks[value].map((s) => ({
+ ...s,
+ name: `${value} (.${s.name})`,
+ }));
+ })
+ .flat(1);
+
+ const currentPlatform = DownloadLinks[platform][0];
+ return (
+
+
+
+ Download for {platform} (.{currentPlatform.name})
+
+ }
+ />
+
+
+ {allPlatforms.map(({ name, url }) => {
+ return (
+
+ {name}
+
+ );
+ })}
+
+
+ );
+};
+
+export default DownloadButton;
diff --git a/website/components/Footer.tsx b/website/components/Footer.tsx
new file mode 100644
index 00000000..b940815d
--- /dev/null
+++ b/website/components/Footer.tsx
@@ -0,0 +1,88 @@
+import { Flex, chakra, Link, IconButton } from "@chakra-ui/react";
+
+import { FaGithub, FaRedditAlien } from "react-icons/fa";
+import { FiTwitter } from "react-icons/fi";
+
+const Footer = () => {
+ return (
+
+
+ Spotube
+
+
+
+ © 2022, Spotube. All rights reserved
+
+
+
+ }
+ variant="link"
+ />
+ }
+ variant="link"
+ />
+ }
+ variant="link"
+ />
+
+
+ );
+};
+
+export default Footer;
diff --git a/website/pages/_app.tsx b/website/pages/_app.tsx
index ea3a15df..9d89b37b 100755
--- a/website/pages/_app.tsx
+++ b/website/pages/_app.tsx
@@ -13,6 +13,7 @@ import * as gtag from "configurations/gtag";
import { useRouter } from "next/router";
import { useEffect } from "react";
import AdDetector from "components/AdDetector";
+import Footer from "components/Footer";
const customTheme = extendTheme(
{
@@ -116,6 +117,7 @@ function MyApp({ Component, pageProps }: AppProps) {
+
>
diff --git a/website/pages/index.tsx b/website/pages/index.tsx
index 11abe7f6..41f5a942 100755
--- a/website/pages/index.tsx
+++ b/website/pages/index.tsx
@@ -1,54 +1,9 @@
-import {
- Heading,
- Menu,
- ButtonGroup,
- Button,
- IconButton,
- MenuItem,
- VStack,
- MenuButton,
- Link as Anchor,
- chakra,
- MenuList,
-} from "@chakra-ui/react";
-import { FaCaretDown } from "react-icons/fa";
+import { Heading, VStack, chakra, HStack, Text } from "@chakra-ui/react";
+import DownloadButton from "components/DownloadButton";
+import Image from "next/image";
import { DisplayAd } from "../components/special";
-import { Platform, usePlatform } from "../hooks/usePlatform";
-
-const baseURL = "https://github.com/KRTirtho/spotube/releases/latest/download/";
-
-const DownloadLinks = Object.freeze({
- [Platform.linux]: [
- { name: "deb", url: baseURL + "Spotube-linux-x86_64.deb" },
- { name: "tar", url: baseURL + "Spotube-linux-x86_64.tar.xz" },
- { name: "AppImage", url: baseURL + "Spotube-linux-x86_64.AppImage" },
- ],
- [Platform.android]: [
- {
- name: "apk",
- url: baseURL + "Spotube-android-all-arch.apk",
- },
- ],
- [Platform.mac]: [{ name: "dmg", url: baseURL + "Spotube-macos-x86_64.dmg" }],
- [Platform.windows]: [
- { name: "exe", url: baseURL + "Spotube-windows-x86_64-setup.exe" },
- { name: "nupkg", url: baseURL + "Spotube-windows-x86_64.nupkg " },
- ],
-});
const Root = () => {
- const platform = usePlatform();
-
- const allPlatforms = Object.entries(Platform)
- .map(([, value]) => {
- return DownloadLinks[value].map((s) => ({
- ...s,
- name: `${value} (.${s.name})`,
- }));
- })
- .flat(1);
-
- const currentPlatform = DownloadLinks[platform][0];
return (
<>
@@ -64,40 +19,116 @@ const Root = () => {
Spotube
-
+
A fast, modern, lightweight & efficient Spotify Music Client for
every platform
-
-
-
- Download for {platform} (.{currentPlatform.name})
-
- }
- />
-
-
- {allPlatforms.map(({ name, url }) => {
- return (
-
- {name}
-
- );
- })}
-
-
+
+
+
+
+ Access all your Spotify Music & Playlists
+
+ You can use all your Spotify tracks & playlists here. Everything
+ will be in Sync & some action taken from Spotube will also
+ reflect on your Spotify Account
+
+
+
+
+
+
+
+
+
+ On your Mobile, PC, Tablet everywhere
+
+ Spotube is available for all "Major" Platforms including
+ Linux, Android, Windows & MacOS natively unlike Spotify
+ Desktop App which uses Electron, that is basically the entire
+ Chrome
+
+
+
+
+
+
+ Open Source, privacy respecting & No ads
+
+ Spotube is an Open Source App being developed & maintained by
+ Kingkor Roy Tirtho & is built by the Contributions of
+ the Community and Contributors
+
+
+
+
+
+
+
+
+ Download Now
+
+ Download Spotube for every platform you want. It's available
+ everywhere
+
+
+
+
>
);
diff --git a/website/public/headline-1.png b/website/public/headline-1.png
new file mode 100644
index 00000000..c2b08474
Binary files /dev/null and b/website/public/headline-1.png differ
diff --git a/website/public/headline-2a.svg b/website/public/headline-2a.svg
new file mode 100644
index 00000000..00cec557
--- /dev/null
+++ b/website/public/headline-2a.svg
@@ -0,0 +1 @@
+progressive_app
\ No newline at end of file
diff --git a/website/public/headline-2b.png b/website/public/headline-2b.png
new file mode 100644
index 00000000..6fb3a517
Binary files /dev/null and b/website/public/headline-2b.png differ
diff --git a/website/public/headline-3.svg b/website/public/headline-3.svg
new file mode 100644
index 00000000..3ffd02d0
--- /dev/null
+++ b/website/public/headline-3.svg
@@ -0,0 +1 @@
+open source
\ No newline at end of file