Skip to content

Commit 72628ef

Browse files
committed
[NEB-191] Nebula, Dashboard: Reduce vertical spacing in markdown renderer (#6860)
<!-- ## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes" If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000): ## Notes for the reviewer Anything important to call out? Be sure to also clarify these in your comments. ## How to test Unit tests, playground, etc. --> <!-- start pr-codex --> --- ## PR-Codex overview This PR focuses on refining the styling of various components in the dashboard application, enhancing visual consistency and layout adjustments. ### Detailed summary - In `Chats.tsx`, removed a conditional class for the `assistant` type. - In `ExecuteTransactionCard.tsx`, adjusted padding from `py-6` to `py-5`. - In `markdown-renderer.tsx`, modified heading margins and added an `hr` element. - Updated list margins in `MarkdownRenderer`. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` <!-- end pr-codex -->
1 parent 7087b3f commit 72628ef

File tree

3 files changed

+13
-10
lines changed

3 files changed

+13
-10
lines changed

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -346,7 +346,7 @@ function StyledMarkdownRenderer(props: {
346346
p={{
347347
className:
348348
props.type === "assistant"
349-
? "text-foreground leading-loose"
349+
? "text-foreground"
350350
: "text-foreground leading-normal",
351351
}}
352352
li={{ className: "text-foreground" }}

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export function ExecuteTransactionCardLayout(props: {
9595
</h3>
9696

9797
{/* content */}
98-
<div className="px-4 text-sm lg:px-6 [&>*:not(:last-child)]:border-b [&>*]:h-12 lg:[&>*]:h-14">
98+
<div className="px-4 text-sm lg:px-6 [&>*:not(:last-child)]:border-b [&>*]:h-[52px]">
9999
{/* From */}
100100
<div className="flex items-center justify-between gap-2">
101101
<span className="font-medium text-muted-foreground">From</span>
@@ -229,7 +229,7 @@ export function ExecuteTransactionCardLayout(props: {
229229

230230
{/* footer */}
231231
{props.status.type !== "confirmed" && (
232-
<div className="flex items-center justify-end border-t px-4 py-6 lg:px-6">
232+
<div className="flex items-center justify-end border-t px-4 py-5 lg:px-6">
233233
<TransactionButton
234234
isPending={sendTransaction.isPending}
235235
transactionCount={undefined}

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

+10-7
Original file line numberDiff line numberDiff line change
@@ -36,8 +36,7 @@ export const MarkdownRenderer: React.FC<{
3636
skipHtml?: boolean;
3737
}> = (markdownProps) => {
3838
const { markdownText, className, code } = markdownProps;
39-
const commonHeadingClassName =
40-
"mb-2 pb-2 leading-5 font-semibold tracking-tight";
39+
const commonHeadingClassName = "mb-2 leading-5 font-semibold tracking-tight";
4140

4241
return (
4342
<div className={className}>
@@ -49,7 +48,7 @@ export const MarkdownRenderer: React.FC<{
4948
<h2
5049
className={cn(
5150
commonHeadingClassName,
52-
"mb-3 border-border border-b text-xl md:text-2xl",
51+
"mb-3 border-border border-b pb-2 text-xl md:text-2xl",
5352
)}
5453
{...cleanedProps(props)}
5554
/>
@@ -60,7 +59,7 @@ export const MarkdownRenderer: React.FC<{
6059
{...cleanedProps(props)}
6160
className={cn(
6261
commonHeadingClassName,
63-
"mt-8 mb-3 border-border border-b text-lg md:text-xl",
62+
"mt-8 mb-3 border-border border-b pb-2 text-lg md:text-xl",
6463
)}
6564
/>
6665
),
@@ -105,6 +104,10 @@ export const MarkdownRenderer: React.FC<{
105104
/>
106105
),
107106

107+
hr: (props) => (
108+
<hr {...cleanedProps(props)} className="my-5 bg-border" />
109+
),
110+
108111
code: ({ ...props }) => {
109112
const codeStr = onlyText(props.children);
110113

@@ -180,21 +183,21 @@ export const MarkdownRenderer: React.FC<{
180183
ul: (props) => {
181184
return (
182185
<ul
183-
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"
186+
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"
184187
{...cleanedProps(props)}
185188
/>
186189
);
187190
},
188191
ol: (props) => (
189192
<ol
190-
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"
193+
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"
191194
{...cleanedProps(props)}
192195
/>
193196
),
194197
li: ({ children: c, ...props }) => (
195198
<li
196199
className={cn(
197-
"mb-2 text-muted-foreground leading-loose [&>p]:m-0",
200+
"mb-1.5 text-muted-foreground leading-loose [&>p]:m-0",
198201
markdownProps.li?.className,
199202
)}
200203
{...cleanedProps(props)}

0 commit comments

Comments
 (0)