OneConfig Download page

7 files changed, 65 insertions, 2 deletions

diff --git a/apps/website/config.ts b/apps/website/config.ts
index f924f80..b0d7211 100644
--- a/apps/website/config.ts
+++ b/apps/website/config.ts
@@ -8,6 +8,7 @@ export const configConst = {
 		discord: '/discord',
 		github: 'https://github.com/Polyfrost',
 		modrinthId: 'a6VEZDKe', // user id of Wyvest
+		skyclient: 'https://skyclient.co',
 	},
 	navbar: {
 		left: [
diff --git a/apps/website/public/media/oneconfig/skyclient.png b/apps/website/public/media/oneconfig/skyclient.png
new file mode 100644
index 0000000..57f3b40
--- /dev/null
+++ b/apps/website/public/media/oneconfig/skyclient.png
diff --git a/apps/website/src/components/base/Section.astro b/apps/website/src/components/base/Section.astro
index c463a16..6ea3075 100644
--- a/apps/website/src/components/base/Section.astro
+++ b/apps/website/src/components/base/Section.astro
@@ -10,7 +10,7 @@ interface Props extends HTMLAttributes<'section'> {
 }
 
 const {
-	maxWidth = '1080px',
+	maxWidth = '1024px',
 	colReverse = true,
 	wrapperClass = '',
 	wFull = true,
diff --git a/apps/website/src/components/base/navbar/Navbar.astro b/apps/website/src/components/base/navbar/Navbar.astro
index bd2c2b5..8903b7e 100644
--- a/apps/website/src/components/base/navbar/Navbar.astro
+++ b/apps/website/src/components/base/navbar/Navbar.astro
@@ -8,7 +8,7 @@ interface Props extends HTMLAttributes<'div'> {}
 const props = Astro.props;
 ---
 <div {...props} class="absolute w-full flex flex-row justify-center h-screen max-h-[110px] px-3 z-navbar text-[16px]">
-	<nav class="w-full max-w-[1080px] flex flex-col md:flex-row justify-between items-center">
+	<nav class="w-full max-w-[1024px] flex flex-col md:flex-row justify-between items-center">
 		<ul class="flex flex-row justify-start gap-4 max-md:mt-4">
 			{(config as Config).navbar.left.map((element, index) => (
 				<NavbarElement {element} {index}/>
diff --git a/apps/website/src/pages/projects/oneconfig/download.astro b/apps/website/src/pages/projects/oneconfig/download.astro
new file mode 100644
index 0000000..b8aee51
--- /dev/null
+++ b/apps/website/src/pages/projects/oneconfig/download.astro
@@ -0,0 +1,61 @@
+---
+import Button from '@components/base/Button.astro';
+import Header from '@components/base/Header.astro';
+import Paragraph from '@components/base/Paragraph.astro';
+import Section from '@components/base/Section.astro';
+import configConst from '@config';
+import Layout from '@layouts/Layout.astro';
+---
+
+<Layout>
+
+	<Section wrapperClass="mt-36 -mb-28">
+		<div class="text-navy-peony flex flex-col gap-y-2">
+			<Header>
+				OneConfig Download
+			</Header>
+			<Paragraph>
+				Thank you for your interest in OneConfig! As OneConfig is primarily a library for other mods, installing OneConfig can be done in multiple ways.
+			</Paragraph>
+		</div>
+	</Section>
+
+	<Section wFull maxWidth="1024px" wrapperClass="bg-blue-75" class="py-8">
+		<div slot="left" class="flex flex-col gap-y-2">
+			<Header class="text-blue-500">SkyClient</Header>
+			<Paragraph class="text-navy-peony whitespace-pre-line">
+				<b>This is the easiest way</b> for installing OneConfig with no experience in Forge or modding.
+
+				SkyClient is an open-source Forge mod installer which installs various mods that include OneConfig for you.
+
+				All you need to do is select the mods you want and click install, and OneConfig should be right there!
+			</Paragraph>
+			<div class="flex flex-row max-md:justify-center">
+				<Button size="sm" iconLeft="link-external" style="primary" href={configConst.socials.skyclient}>SkyClient</Button>
+			</div>
+		</div>
+		<div slot="right">
+			<img class="rounded-lg w-full max-md:max-w-screen-sm lg:max-w-none lg:w-[480px]" src="/media/oneconfig/skyclient.png" alt="A screenshot of skyclient">
+		</div>
+	</Section>
+
+	<Section wFull maxWidth="1024px" wrapperClass="-mt-32 mb-12" class="py-8">
+		<div slot="left" class="flex flex-col gap-y-2">
+			<Header class="text-blue-500">Mods</Header>
+			<Paragraph class="text-navy-peony whitespace-pre-line">If you already have a Forge installation, you can simply download any mod that includes OneConfig. Such mods include:
+
+				• Hytils Reborn
+				• Chatting
+				• Any Poly-Series mod (e.g PolyTime, PolyBlur)
+				• And more!
+			</Paragraph>
+			<div class="flex flex-row max-md:justify-center">
+				<Button size="sm" iconLeft="link-external" style="primary" href="/mods">Discover Mods</Button>
+			</div>
+		</div>
+		<div slot="right">
+			<img class="rounded-lg w-full max-md:max-w-screen-sm lg:max-w-none lg:w-[480px]" src="/media/oneconfig/page_media_4.png" alt="A screenshot of skyclient">
+		</div>
+	</Section>
+
+</Layout>
diff --git a/apps/website/src/pages/projects/oneconfig.astro b/apps/website/src/pages/projects/oneconfig/index.astro
index fcb1c7b..fcb1c7b 100644
--- a/apps/website/src/pages/projects/oneconfig.astro
+++ b/apps/website/src/pages/projects/oneconfig/index.astro
diff --git a/apps/website/src/types/Config.d.ts b/apps/website/src/types/Config.d.ts
index 6e714b9..7635de6 100644
--- a/apps/website/src/types/Config.d.ts
+++ b/apps/website/src/types/Config.d.ts
@@ -50,6 +50,7 @@ export interface Config {
 		discord: string,
 		github: string,
 		modrinthId: string,
+		skyclient: string,
 	},
 	navbar: {
 		left: NavbarElement[],