Remove big spacing on oneconfig page

3 files changed, 16 insertions, 22 deletions

diff --git a/apps/website/src/components/base/Section.astro b/apps/website/src/components/base/Section.astro
index 5f3cc1d..c463a16 100644
--- a/apps/website/src/components/base/Section.astro
+++ b/apps/website/src/components/base/Section.astro
@@ -7,7 +7,6 @@ interface Props extends HTMLAttributes<'section'> {
 	wrapperClass?: string
 	wFull?: boolean
 	hFull?: boolean
-	scrollSection?: boolean
 }
 
 const {
@@ -16,7 +15,6 @@ const {
 	wrapperClass = '',
 	wFull = true,
 	hFull = false,
-	scrollSection = true,
 	...props
 } = Astro.props;
 
@@ -26,13 +24,9 @@ const twoColumnClasses = ` ${maxWidth === 'none' ? 'justify-center' : 'justify-c
 	${colReverse ? 'flex-col-reverse' : 'flex-col'} lg:flex-row items-center`;
 
 const className = `max-w-[${maxWidth}] ${hFull ? 'min-h-screen' : 'h-auto'} ${wFull ? 'w-full' : `w-[${maxWidth}]`} px-5 xl:px-0 flex gap-x-20 gap-y-4${twoColumn ? twoColumnClasses : ''}${props.class ? ` ${props.class}` : ''}`;
-
-const sectionAttr = {
-	...(scrollSection ? { 'data-scroll-section': '' } : {}),
-};
 ---
 
-<section {...sectionAttr} class={`w-full outline-none flex justify-center ${wrapperClass ?? ''}`}>
+<section class={`w-full outline-none flex justify-center ${wrapperClass ?? ''}`}>
 	<div class={className} {...props}>
 		{twoColumn
 			? (
diff --git a/apps/website/src/pages/index.astro b/apps/website/src/pages/index.astro
index b291ef8..72e7af4 100644
--- a/apps/website/src/pages/index.astro
+++ b/apps/website/src/pages/index.astro
@@ -16,7 +16,7 @@ import Layout from '@layouts/Layout.astro';
 				viewBox="0 0 1155 678">
 				<path
 					fill="url(#45de2b6b-92d5-4d68-a6a0-9b9b2abad533)"
-					fill-opacity=".3"
+					fill-opacity="0.3"
 					d="M317.219 518.975L203.852 678 0 438.341l317.219 80.634 204.172-286.402c1.307 132.337 45.083 346.658 209.733 145.248C936.936 126.058 882.053-94.234 1031.02 41.331c119.18 108.451 130.68 295.337 121.53 375.223L855 299l21.173 362.054-558.954-142.079z"
 				/>
 				<defs>
@@ -29,7 +29,7 @@ import Layout from '@layouts/Layout.astro';
 		</div>
 		<div class="mx-auto max-w-3xl py-36 lg:py-48">
 			<div class="mt-4 mb-8 flex md:justify-center">
-				<div class="flex flex-row justify-center items-center font-medium relative rounded-full py-1 px-3 text-sm text-blue-450 hover:text-blue-600 border border-1 border-gray-900/10 hover:border-blue-600">
+				<div class="flex flex-row justify-center items-center font-medium relative rounded-full py-1 px-3 text-sm text-blue-450 hover:text-blue-600 border border-1 border-gray-800/20 hover:border-blue-600">
 					Introducing OneConfig
 					<Link href="/projects/oneconfig" class="transition-none">
 						<span class="absolute inset-0" aria-hidden="true"></span>
diff --git a/apps/website/src/pages/projects/oneconfig.astro b/apps/website/src/pages/projects/oneconfig.astro
index 47d415c..a712d18 100644
--- a/apps/website/src/pages/projects/oneconfig.astro
+++ b/apps/website/src/pages/projects/oneconfig.astro
@@ -27,18 +27,18 @@ import { Code } from 'astro:components';
 		</div>
 	</Section>
 
-	<Section tabindex="0" hFull>
+	<Section tabindex="0">
 		<div slot="left">
 			<Header size="xl" class="text-navy-peony">Forge is complicated</Header>
 			<Paragraph size="md" class="text-gray-400 max-w-[500px]">Modding Minecraft has always been difficult, particularly with their configuration. Remembering all of the keybinds, commands; it just isn't intuitive.</Paragraph>
 		</div>
-		<div data-scroll data-scroll-speed="10" slot="right" class="w-3/4 max-w-80 md:max-w-none md:w-auto">
+		<div slot="right" class="w-3/4 max-w-80 md:max-w-none md:w-auto">
 			<img class="w-full md:w-[20rem]" src="/media/oneconfig/page_media_1.svg" alt="stuff"/>
 		</div>
 	</Section>
 
-	<Section tabindex="0" colReverse={false} hFull>
-		<div data-scroll data-scroll-speed="10" slot="left" class="w-1/2 max-w-80 md:max-w-none  md:w-auto flex justify-center">
+	<Section tabindex="0" colReverse={false}>
+		<div slot="left" class="w-1/2 max-w-80 md:max-w-none  md:w-auto flex justify-center">
 			<img class="w-full md:w-[20rem]" src="/media/oneconfig/page_media_2.svg" alt="stuff"/>
 		</div>
 
@@ -48,20 +48,20 @@ import { Code } from 'astro:components';
 		</div>
 	</Section>
 
-	<Section tabindex="0" hFull>
-		<div data-scroll data-scroll-sticky slot="left">
+	<Section tabindex="0">
+		<div slot="left">
 			<Header size="xl" class="text-navy-peony">Best of both worlds</Header>
 			<Paragraph size="md" class="text-gray-400 max-w-[500px]">OneConfig brings the simplicity of a client to the everyday user, gives advanced users and developers complete control over everything, while remaining free and open-source.</Paragraph>
 		</div>
 
-		<div data-scroll data-scroll-speed="10" slot="right" class="w-3/4 max-w-80 md:max-w-none md:w-auto flex justify-center">
+		<div slot="right" class="w-3/4 max-w-80 md:max-w-none md:w-auto flex justify-center">
 			<img class="w-full md:w-[20rem] lg:w-[30rem]" src="/media/oneconfig/page_media_3.svg" alt="stuff"/>
 		</div>
 	</Section>
 
-	<div data-scroll-section class="section bg-blue-75 flex flex-col justify-center items-center min-h-screen">
-		<Section scrollSection={false} colReverse={false} maxWidth="1120px" wFull={false} class="pt-10 md:py-20 max-sm:h-screen">
-			<div data-scroll data-scroll-speed="2" slot="left">
+	<div class="section bg-blue-75 flex flex-col justify-center items-center min-h-screen">
+		<Section colReverse={false} maxWidth="1120px" wFull={false} class="pt-10 md:py-20 max-sm:h-screen">
+			<div slot="left">
 				<!-- TODO: FIX Codeblock overflowing on mobile -->
 				<div class="max-sm:hidden">
 					<Code
@@ -96,7 +96,7 @@ import { Code } from 'astro:components';
 			</div>
 		</Section>
 
-		<Section scrollSection={false} maxWidth="1120px" wFull={false} class="py-10 md:py-20 gap-4 max-sm:h-screen">
+		<Section maxWidth="1120px" wFull={false} class="py-10 md:py-20 gap-4 max-sm:h-screen">
 			<div slot="left" class="flex flex-col gap-2 text-left items-start">
 				<Header size="xl" class="text-blue-500">Designed for users</Header>
 				<Paragraph class="text-blue-400 max-w-[500px]">
@@ -112,7 +112,7 @@ import { Code } from 'astro:components';
 		</Section>
 	</div>
 
-	<Section id="unified_hud_editor" class="flex-col justify-center items-center h-screen md:min-h-[600px]" hFull>
+	<Section id="unified_hud_editor" class="flex-col justify-center items-center h-screen md:min-h-[600px]">
 		<img data-scroll data-scroll-sticky data-scroll-target="#unified_hud_editor" data-scroll-direction="horizontal" src="/media/oneconfig/page_media_5.png" class="max-h-[285px] md:max-h-96 lg:max-h-[581px] rounded-2xl"/>
 		<div data-scroll data-scroll-speed="2" class="flex flex-col justify-center items-center gap-y-4">
 			<Header size="xl" align="center" class="w-96">A unified HUD editor</Header>
@@ -122,7 +122,7 @@ import { Code } from 'astro:components';
 		</div>
 	</Section>
 
-	<Section wrapperClass="bg-blue-100 -mb-40" wFull maxWidth="none" class="py-10 md:py-20 gap-4 !px-0 flex flex-col items-center justify-center" hFull>
+	<Section wrapperClass="bg-blue-100 -mb-40" wFull maxWidth="none" class="py-10 md:py-20 gap-4 !px-0 flex flex-col items-center justify-center">
 		<div class="max-w-[1024px] w-full flex flex-col gap-2 text-left items-start px-5">
 			<Header size="xl" class="text-blue-500">With many fabulous mods</Header>
 			<Paragraph class="text-blue-400 max-w-[500px]">