From d84d39b972a78476bf3f1772b9d75f02cf654447 Mon Sep 17 00:00:00 2001
From: yeonseong <yeonseong.dev@gmail.com>
Date: Thu, 27 Apr 2023 21:46:06 +0900
Subject: [PATCH] FEAT: responsive gradient when mobile

---
 src/component/Benefit/Benefit.svelte | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/component/Benefit/Benefit.svelte b/src/component/Benefit/Benefit.svelte
index 858a851..2b3d741 100644
--- a/src/component/Benefit/Benefit.svelte
+++ b/src/component/Benefit/Benefit.svelte
@@ -65,12 +65,18 @@
 		await img.decode();
 		const color = await colorThief.getColor(img, 25);
 		const invertedColor = color.map((c) => 255 - c);
+		let gradientPercent;
+		if (window.innerWidth <= 768){
+			gradientPercent = 42;
+		} else {
+			gradientPercent = 20;
+		}
 		const gradient = `linear-gradient(242deg ,
 					rgba(${invertedColor[0]}, ${invertedColor[1]}, ${invertedColor[2]}, 0.8) 0%, 
-					rgba(0, 0, 0, 0.8) 20%)`;
+					rgba(0, 0, 0, 0.8) ${gradientPercent}%)`;
 		benefitComponent.style.backgroundImage = gradient;
 	};
-
+	
 	/**
 	 * @type {{companyName: string, companyDescription: string, logo: string, category: string, content: string, method: string[], startDate: string, endDate: string}}
 	 */