From 0250936d8f002268c28c40827ac08d93f1bc629b Mon Sep 17 00:00:00 2001
From: bgravenorst <byron.gravenorst@consensys.net>
Date: Wed, 16 Oct 2024 18:29:23 +1000
Subject: [PATCH 1/2] Update details box.

Signed-off-by: bgravenorst <byron.gravenorst@consensys.net>
---
 .../ParserOpenRPC/DetailsBox/RenderParams.tsx |  1 +
 .../ParserOpenRPC/DetailsBox/index.tsx        | 28 +++++++++++--------
 .../DetailsBox/styles.module.css              | 20 +++++++++++++
 3 files changed, 38 insertions(+), 11 deletions(-)

diff --git a/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx b/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx
index 94a5d40b985..c33f63cb202 100644
--- a/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx
+++ b/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx
@@ -152,6 +152,7 @@ export const renderParamSchemas = (inputSchema, schemas) => {
         return (
           <div key={`${i}`} className={styles.borderTopLine}>
             {renderSchema(item, schemas, item.name)}
+            {i < inputSchema.length - 1 && <hr className={styles.paramSeparator} />}
           </div>
         );
       })}
diff --git a/src/components/ParserOpenRPC/DetailsBox/index.tsx b/src/components/ParserOpenRPC/DetailsBox/index.tsx
index 1f2b642a570..afc021f5b3e 100644
--- a/src/components/ParserOpenRPC/DetailsBox/index.tsx
+++ b/src/components/ParserOpenRPC/DetailsBox/index.tsx
@@ -67,11 +67,15 @@ export default function DetailsBox({
       >
         Parameters
       </Heading>
-      {params.length === 0 ? (
-        <div>This method does not accept any parameters</div>
-      ) : (
-        <>{params && renderParamSchemas(params, components)}</>
-      )}
+      <div className={styles.paramContainer}>
+        {params.length === 0 ? (
+          <div className="padding-vert--md">
+            This method doesn't accept any parameters.
+          </div>
+        ) : (
+          params && renderParamSchemas(params, components)
+        )}
+      </div>
       <Heading
         as="h2"
         className={clsx(
@@ -82,12 +86,14 @@ export default function DetailsBox({
       >
         Returns
       </Heading>
-      {result?.description && (
-        <div className="padding-vert--md">
-          <MDContent content={result.description} />
-        </div>
-      )}
-      {result && renderResultSchemas(result, components)}
+      <div className={styles.paramContainer}>
+        {result?.description && (
+          <div className="padding-vert--md">
+            <MDContent content={result.description} />
+          </div>
+        )}
+        {result && renderResultSchemas(result, components)}
+      </div>
     </>
   );
 }
diff --git a/src/components/ParserOpenRPC/DetailsBox/styles.module.css b/src/components/ParserOpenRPC/DetailsBox/styles.module.css
index c987038ca28..2ac856902e8 100644
--- a/src/components/ParserOpenRPC/DetailsBox/styles.module.css
+++ b/src/components/ParserOpenRPC/DetailsBox/styles.module.css
@@ -74,3 +74,23 @@
   border-radius: 6px;
   background-color: #ffcdd2;
 }
+
+.summaryText {
+  font-style: italic;
+  color: #6a737d;
+  font-weight: 400;
+}
+
+.paramContainer {
+  border: 1px solid #848c96;
+  border-radius: 8px;
+  padding: 1rem;
+  margin-top: 1rem;
+}
+
+.paramSeparator {
+  border: 0;
+  border-top: 1px solid #848c96;
+  margin: 1rem 0;
+  width: 100%;
+}

From 5fd7e433840a674c0557a953274da143648ce31c Mon Sep 17 00:00:00 2001
From: bgravenorst <byron.gravenorst@consensys.net>
Date: Wed, 16 Oct 2024 18:38:48 +1000
Subject: [PATCH 2/2] Remove line.

Signed-off-by: bgravenorst <byron.gravenorst@consensys.net>
---
 .../ParserOpenRPC/DetailsBox/RenderParams.tsx       |  2 +-
 src/components/ParserOpenRPC/DetailsBox/index.tsx   | 13 +++++++++----
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx b/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx
index c33f63cb202..bb42f3b3392 100644
--- a/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx
+++ b/src/components/ParserOpenRPC/DetailsBox/RenderParams.tsx
@@ -150,7 +150,7 @@ export const renderParamSchemas = (inputSchema, schemas) => {
     <>
       {inputSchema.map((item, i) => {
         return (
-          <div key={`${i}`} className={styles.borderTopLine}>
+          <div key={`${i}`}>
             {renderSchema(item, schemas, item.name)}
             {i < inputSchema.length - 1 && <hr className={styles.paramSeparator} />}
           </div>
diff --git a/src/components/ParserOpenRPC/DetailsBox/index.tsx b/src/components/ParserOpenRPC/DetailsBox/index.tsx
index afc021f5b3e..0c5d48bd838 100644
--- a/src/components/ParserOpenRPC/DetailsBox/index.tsx
+++ b/src/components/ParserOpenRPC/DetailsBox/index.tsx
@@ -49,13 +49,19 @@ export default function DetailsBox({
       )}
       <Heading as="h1">{method}</Heading>
       {summary !== null && (
-        <p style={{ marginBottom: "0.5rem" }}>
+        <p style={{ marginBottom: "0.5rem" }}
+           className={clsx("padding-bottom--md", styles.borderBottomLine)}
+        >
           <strong>Summary: </strong>
-          <MDContent content={summary} />
+          <span className={styles.summaryText}>
+            <MDContent content={summary} />
+          </span>
         </p>
       )}
       {description !== null && (
-        <MDContent content={description} />
+        <div className="padding-top--lg">
+          <MDContent content={description} />
+        </div>
       )}
       {extraContent && <div className="padding-top--lg">{extraContent}</div>}
       <Heading
@@ -80,7 +86,6 @@ export default function DetailsBox({
         as="h2"
         className={clsx(
           styles.secondaryHeading,
-          styles.borderBottomLine,
           "padding-top--lg padding-vert--md",
         )}
       >