From f006657050d5b9042b33b5834e63fc8338c7d555 Mon Sep 17 00:00:00 2001
From: af-n <733093@gmail.com>
Date: Wed, 20 Jul 2022 14:32:23 -0400
Subject: [PATCH] download channel fix, added wrapper min width

---
 src/lib/components/atoms/DownloadChannel.svelte          | 5 +++--
 src/lib/components/molecules/DownloadChannelHost.svelte  | 3 ++-
 src/lib/components/molecules/DownloadSelectorHost.svelte | 2 ++
 src/routes/__layout.svelte                               | 6 ++----
 src/routes/index.svelte                                  | 2 ++
 5 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/lib/components/atoms/DownloadChannel.svelte b/src/lib/components/atoms/DownloadChannel.svelte
index 3bbc287..5b7c210 100644
--- a/src/lib/components/atoms/DownloadChannel.svelte
+++ b/src/lib/components/atoms/DownloadChannel.svelte
@@ -22,17 +22,18 @@
 
 	button {
 		font-weight: 300;
+		font-size: 1.5rem;
 		height: 60px;
-		width: 43vw;
+		width: 100%;
 		color: var(--white);
 		border-radius: 200px;
 		border: 0;
 		padding: 12px 40px;
 		cursor: pointer;
 		background-color: transparent;
-		font-size: 1.5rem;
 		transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
 		transition-duration: 0.4s;
+		transition-property: background-color;
 		user-select: none;
 	}
 
diff --git a/src/lib/components/molecules/DownloadChannelHost.svelte b/src/lib/components/molecules/DownloadChannelHost.svelte
index 4c05efe..b9e7385 100644
--- a/src/lib/components/molecules/DownloadChannelHost.svelte
+++ b/src/lib/components/molecules/DownloadChannelHost.svelte
@@ -27,7 +27,8 @@
 		background-color: var(--grey-one);
 		border-radius: 200px;
 		display: flex;
-		justify-content: space-between;
 		padding: 8px 8px;
+        display: grid;
+		grid-template-columns: 1fr 1fr;
 	}
 </style>
diff --git a/src/lib/components/molecules/DownloadSelectorHost.svelte b/src/lib/components/molecules/DownloadSelectorHost.svelte
index 301f087..ccda1af 100644
--- a/src/lib/components/molecules/DownloadSelectorHost.svelte
+++ b/src/lib/components/molecules/DownloadSelectorHost.svelte
@@ -7,6 +7,8 @@
     <DownloadSelector></DownloadSelector>
     <DownloadSelector></DownloadSelector>
     <DownloadSelector></DownloadSelector>
+    <DownloadSelector></DownloadSelector>
+    <DownloadSelector></DownloadSelector>
 </div>
 
 
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index 0b69d40..4a4bf82 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -30,7 +30,6 @@ import Wave from '$lib/components/atoms/Wave.svelte';
 
 <NavHost></NavHost>
 <slot />
-<SocialHost />
 <Wave />
 
 <style>
@@ -47,7 +46,6 @@ import Wave from '$lib/components/atoms/Wave.svelte';
 	}
 
 	:global(body) {
-		overflow-y: hidden;
 		margin: 0;
 		padding: 0;
 		line-height: 1.3;
@@ -55,8 +53,8 @@ import Wave from '$lib/components/atoms/Wave.svelte';
 	}
 
 	:global(.wrapper) {
-		margin-left: 6%;
-		margin-right: 6%;
+		margin-inline: auto;
+		width: min(90%, 100rem);
 		margin-top: 3%
 	}
 
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 054513e..ca4ec1c 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,12 +1,14 @@
 <script>
 	import HeroImage from '$lib/components/atoms/HeroImage.svelte';
 	import IndexDescription from '$lib/components/organisms/IndexDescription.svelte';
+	import SocialHost from '$lib/components/molecules/SocialHost.svelte';
 </script>
 
 <div class="wrapper">
 
 	<HeroImage></HeroImage>
 	<IndexDescription />
+	<SocialHost />
 
 </div>