[NEB-191] Nebula, Dashboard: Reduce vertical spacing in markdown rendering

Author: MananTank

apps/dashboard/src/app/nebula-app/(app)/components/Chats.tsx

@@ -346,7 +346,7 @@ function StyledMarkdownRenderer(props: {
       p={{
         className:
           props.type === "assistant"
-            ? "text-foreground leading-loose"
+            ? "text-foreground"
             : "text-foreground leading-normal",
       }}
       li={{ className: "text-foreground" }}

apps/dashboard/src/app/nebula-app/(app)/components/ExecuteTransactionCard.tsx

@@ -95,7 +95,7 @@ export function ExecuteTransactionCardLayout(props: {
         </h3>
 
         {/* content */}
-        <div className="px-4 text-sm lg:px-6 [&>*:not(:last-child)]:border-b [&>*]:h-12 lg:[&>*]:h-14">
+        <div className="px-4 text-sm lg:px-6 [&>*:not(:last-child)]:border-b [&>*]:h-[52px]">
           {/* From */}
           <div className="flex items-center justify-between gap-2">
             <span className="font-medium text-muted-foreground">From</span>
@@ -229,7 +229,7 @@ export function ExecuteTransactionCardLayout(props: {
 
         {/* footer */}
         {props.status.type !== "confirmed" && (
-          <div className="flex items-center justify-end border-t px-4 py-6 lg:px-6">
+          <div className="flex items-center justify-end border-t px-4 py-5 lg:px-6">
             <TransactionButton
               isPending={sendTransaction.isPending}
               transactionCount={undefined}

apps/dashboard/src/components/contract-components/published-contract/markdown-renderer.tsx

@@ -36,8 +36,7 @@ export const MarkdownRenderer: React.FC<{
   skipHtml?: boolean;
 }> = (markdownProps) => {
   const { markdownText, className, code } = markdownProps;
-  const commonHeadingClassName =
-    "mb-2 pb-2 leading-5 font-semibold tracking-tight";
+  const commonHeadingClassName = "mb-2 leading-5 font-semibold tracking-tight";
 
   return (
     <div className={className}>
@@ -49,7 +48,7 @@ export const MarkdownRenderer: React.FC<{
             <h2
               className={cn(
                 commonHeadingClassName,
-                "mb-3 border-border border-b text-xl md:text-2xl",
+                "mb-3 border-border border-b pb-2 text-xl md:text-2xl",
               )}
               {...cleanedProps(props)}
             />
@@ -60,7 +59,7 @@ export const MarkdownRenderer: React.FC<{
               {...cleanedProps(props)}
               className={cn(
                 commonHeadingClassName,
-                "mt-8 mb-3 border-border border-b text-lg md:text-xl",
+                "mt-8 mb-3 border-border border-b pb-2 text-lg md:text-xl",
               )}
             />
           ),
@@ -105,6 +104,10 @@ export const MarkdownRenderer: React.FC<{
             />
           ),
 
+          hr: (props) => (
+            <hr {...cleanedProps(props)} className="my-5 bg-border" />
+          ),
+
           code: ({ ...props }) => {
             const codeStr = onlyText(props.children);
 
@@ -180,21 +183,21 @@ export const MarkdownRenderer: React.FC<{
           ul: (props) => {
             return (
               <ul
-                className="mb-6 list-outside list-disc pl-5 [&_ol_li:first-of-type]:mt-1.5 [&_ul_li:first-of-type]:mt-1.5"
+                className="mb-4 list-outside list-disc pl-5 [&_ol_li:first-of-type]:mt-1.5 [&_ul_li:first-of-type]:mt-1.5"
                 {...cleanedProps(props)}
               />
             );
           },
           ol: (props) => (
             <ol
-              className="mb-6 list-outside list-decimal pl-5 [&_ol_li:first-of-type]:mt-1.5 [&_ul_li:first-of-type]:mt-1.5"
+              className="mb-4 list-outside list-decimal pl-5 [&_ol_li:first-of-type]:mt-1.5 [&_ul_li:first-of-type]:mt-1.5"
               {...cleanedProps(props)}
             />
           ),
           li: ({ children: c, ...props }) => (
             <li
               className={cn(
-                "mb-2 text-muted-foreground leading-loose [&>p]:m-0",
+                "mb-1.5 text-muted-foreground leading-loose [&>p]:m-0",
                 markdownProps.li?.className,
               )}
               {...cleanedProps(props)}