From ceb690a997df2fbb63bd6dbc539ba26fc29c5069 Mon Sep 17 00:00:00 2001
From: BaskarMitrah <mit44186@adobe.com>
Date: Wed, 11 Dec 2024 19:05:16 +0530
Subject: [PATCH] fix : credential design issues - remove padding

---
 example/src/pages/credential/GetCredentialApiKey.js  |  2 +-
 .../src/pages/credential/GetCredentialOAuthS2s.js    |  2 +-
 .../components/GetCredential/PreviousCredential.js   |  4 ++--
 .../src/components/GetCredential/PreviousProject.js  | 12 ++++++++++--
 .../GetCredential/Return/ReturnNewCredential.js      |  2 +-
 .../GetCredential/Return/ReturnSideComp.js           |  2 +-
 6 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/example/src/pages/credential/GetCredentialApiKey.js b/example/src/pages/credential/GetCredentialApiKey.js
index 968b821c3d..b109b6d4b6 100644
--- a/example/src/pages/credential/GetCredentialApiKey.js
+++ b/example/src/pages/credential/GetCredentialApiKey.js
@@ -72,7 +72,7 @@ const GetCredentialApiKey = () => {
 
         <GetCredential.Return.Side>
           <GetCredential.Return.Side.Custom>
-            <div style={{ display: "flex", gap: "30px", flexDirection: "column", width: "100%" }}>
+            <div style={{ display: "flex", gap: "15px", flexDirection: "column", width: "100%" }}>
               <h3 className='spectrum-Heading spectrum-Heading--sizeM'>Welcome back</h3>
               <p className="spectrum-Body spectrum-Body--sizeM">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
             </div>
diff --git a/example/src/pages/credential/GetCredentialOAuthS2s.js b/example/src/pages/credential/GetCredentialOAuthS2s.js
index 62de56d48b..3d43983285 100644
--- a/example/src/pages/credential/GetCredentialOAuthS2s.js
+++ b/example/src/pages/credential/GetCredentialOAuthS2s.js
@@ -119,7 +119,7 @@ const GetCredentialOAuthS2s = () => {
 
         <GetCredential.Return.Side>
           <GetCredential.Return.Side.Custom>
-            <div style={{ display: "flex", gap: "30px", flexDirection: "column", width: "100%" }}>
+            <div style={{ display: "flex", gap: "15px", flexDirection: "column", width: "100%" }}>
               <h3 className='spectrum-Heading spectrum-Heading--sizeM'>Welcome back</h3>
               <p className="spectrum-Body spectrum-Body--sizeM">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
             </div>
diff --git a/packages/gatsby-theme-aio/src/components/GetCredential/PreviousCredential.js b/packages/gatsby-theme-aio/src/components/GetCredential/PreviousCredential.js
index 75e7c6d797..62fd2d4a47 100644
--- a/packages/gatsby-theme-aio/src/components/GetCredential/PreviousCredential.js
+++ b/packages/gatsby-theme-aio/src/components/GetCredential/PreviousCredential.js
@@ -82,7 +82,7 @@ const PreviousCredential = ({ setIsCreateNewCredential }) => {
               css={css`
               display: flex;
               flex-direction: column;
-              gap: 30px;
+              gap: 15px;
             `}>
               {credentialHeader?.title && (
                 <h3 className="spectrum-Heading spectrum-Heading--sizeXL">
@@ -125,7 +125,7 @@ const PreviousCredential = ({ setIsCreateNewCredential }) => {
               }
             `}
           />
-          <div>
+          <div css={css`width : 50%`}>
             <PreviousProject
               returnFields={returnFields}
               productList={productList}
diff --git a/packages/gatsby-theme-aio/src/components/GetCredential/PreviousProject.js b/packages/gatsby-theme-aio/src/components/GetCredential/PreviousProject.js
index 6d5520d7f3..706090bb9a 100644
--- a/packages/gatsby-theme-aio/src/components/GetCredential/PreviousProject.js
+++ b/packages/gatsby-theme-aio/src/components/GetCredential/PreviousProject.js
@@ -38,9 +38,17 @@ const PreviousProject = ({ returnFields, productList, collapse }) => {
           flex-direction : column;
           gap:24px;
         `}>
-        {previousProject?.title && <h3 className='spectrum-Heading spectrum-Heading--sizeM'>{previousProject?.title}</h3>}
 
-        {previousProject?.paragraph && <p className="spectrum-Body spectrum-Body--sizeM">{previousProject?.paragraph}</p>}
+        <div
+          css={css`
+          display: flex;
+          flex-direction: column;
+          gap: 15px;
+        `}
+        >
+          {previousProject?.title && <h3 className='spectrum-Heading spectrum-Heading--sizeM'>{previousProject?.title}</h3>}
+          {previousProject?.paragraph && <p className="spectrum-Body spectrum-Body--sizeM">{previousProject?.paragraph}</p>}
+        </div>
 
         {returnManageDeveloperConsole && <ReturnManageDeveloperConsole returnManageDeveloperConsole={returnManageDeveloperConsole} />}
 
diff --git a/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnNewCredential.js b/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnNewCredential.js
index b134d97d4f..2f0c83daeb 100644
--- a/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnNewCredential.js
+++ b/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnNewCredential.js
@@ -7,7 +7,7 @@ const ReturnNewCredential = ({ returnNewCredential, setIsCreateNewCredential, re
     <div
       css={css`
         display:flex;
-        gap:16px;
+        gap:15px;
         flex-direction:column;
         width: 100%;
       `}
diff --git a/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnSideComp.js b/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnSideComp.js
index a5d29de3ba..1a801abf51 100644
--- a/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnSideComp.js
+++ b/packages/gatsby-theme-aio/src/components/GetCredential/Return/ReturnSideComp.js
@@ -9,7 +9,7 @@ const ReturnSideComp = ({ returnSideComp, setIsCreateNewCredential, returnNewCre
       <div
         css={css`
           display:flex;
-          gap:30px;
+          gap:15px;
           flex-direction:column;
           width: 100%;
         `}