From 3aa024a385b50eda6d595f43ba279eece4cf6e10 Mon Sep 17 00:00:00 2001
From: Cherik <Pourcheriki@gmail.com>
Date: Fri, 2 Jun 2023 15:20:01 +0330
Subject: [PATCH] fix: OneSideContainer overflow issue

---
 package.json                   |  2 +-
 src/components/layout/Grid.tsx | 16 ++++++++--------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index ea0f2ca..c9a5caa 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@giveth/ui-design-system",
-	"version": "1.11.9",
+	"version": "1.11.10",
 	"files": [
 		"/lib"
 	],
diff --git a/src/components/layout/Grid.tsx b/src/components/layout/Grid.tsx
index b5bc4c0..cd1cf07 100644
--- a/src/components/layout/Grid.tsx
+++ b/src/components/layout/Grid.tsx
@@ -60,20 +60,20 @@ export const Container = styled.div`
 
 export const OneSideContainer = styled.div`
 	@media (min-width: ${minWidth.sm}px) {
-		width: calc(50vw + ${width.sm / 2}px);
-		margin-left: calc(50vw - ${width.sm / 2}px);
+		width: calc(50% + ${width.sm / 2}px);
+		margin-left: calc(50% - ${width.sm / 2}px);
 	}
 	@media (min-width: ${minWidth.md}px) {
-		width: calc(50vw + ${width.md / 2}px);
-		margin-left: calc(50vw - ${width.md / 2}px);
+		width: calc(50% + ${width.md / 2}px);
+		margin-left: calc(50% - ${width.md / 2}px);
 	}
 	@media (min-width: ${minWidth.lg}px) {
-		width: calc(50vw + ${width.lg / 2}px);
-		margin-left: calc(50vw - ${width.lg / 2}px);
+		width: calc(50% + ${width.lg / 2}px);
+		margin-left: calc(50% - ${width.lg / 2}px);
 	}
 	@media (min-width: ${minWidth.xl}px) {
-		width: calc(50vw + ${width.xl / 2}px);
-		margin-left: calc(50vw - ${width.xl / 2}px);
+		width: calc(50% + ${width.xl / 2}px);
+		margin-left: calc(50% - ${width.xl / 2}px);
 	}
 `;