refactor: Design updates to API Dialog and Code Block for uplift sweep (#4431)
* api dialog sweep * update code blocks * [autofix.ci] apply automated fixes --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
This commit is contained in:
parent
63435689d4
commit
f41bc6ef5f
3 changed files with 6 additions and 6 deletions
|
|
@ -31,13 +31,13 @@ export default function SimplifiedCodeTabComponent({
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex w-full flex-col overflow-hidden rounded-md text-left dark">
|
<div className="mt-2 flex w-full flex-col overflow-hidden rounded-md text-left dark">
|
||||||
<div className="flex w-full items-center justify-between rounded-t-md border border-border bg-accent px-4 py-2">
|
<div className="flex w-full items-center justify-between rounded-t-md border border-b-0 border-border bg-muted px-4 py-2">
|
||||||
<span className="dar text-sm font-semibold text-white">{language}</span>
|
<span className="dar text-sm font-semibold text-white">{language}</span>
|
||||||
<Button
|
<Button
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
size="icon"
|
size="icon"
|
||||||
className="bg-card text-muted-foreground"
|
className="text-muted-foreground hover:bg-card"
|
||||||
data-testid="copy-code-button"
|
data-testid="copy-code-button"
|
||||||
onClick={copyToClipboard}
|
onClick={copyToClipboard}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -94,7 +94,7 @@ export default function CodeTabsComponent({
|
||||||
dangerouslySetInnerHTML={{ __html: tab.description }}
|
dangerouslySetInnerHTML={{ __html: tab.description }}
|
||||||
></div>
|
></div>
|
||||||
)}
|
)}
|
||||||
<div className="flex w-full items-center justify-end gap-4 rounded-t-md border border-b-0 border-input bg-secondary px-4 py-2">
|
<div className="flex w-full items-center justify-end gap-4 rounded-t-md border border-border bg-muted px-4 py-2">
|
||||||
{nodes.length > 0 &&
|
{nodes.length > 0 &&
|
||||||
tabs.find((tab) => tab.name.toLowerCase() === "tweaks") &&
|
tabs.find((tab) => tab.name.toLowerCase() === "tweaks") &&
|
||||||
tabs[activeTab].hasTweaks && (
|
tabs[activeTab].hasTweaks && (
|
||||||
|
|
@ -152,7 +152,7 @@ export default function CodeTabsComponent({
|
||||||
<SyntaxHighlighter
|
<SyntaxHighlighter
|
||||||
language={tab.language}
|
language={tab.language}
|
||||||
style={oneDark}
|
style={oneDark}
|
||||||
className="!my-0 h-full overflow-auto rounded-sm !rounded-t-none border border-t-0 border-input bg-code-block text-left custom-scroll"
|
className="!my-0 h-full overflow-auto rounded-sm !rounded-t-none border border-t-0 border-border bg-code-block text-left custom-scroll"
|
||||||
>
|
>
|
||||||
{tab.code}
|
{tab.code}
|
||||||
</SyntaxHighlighter>
|
</SyntaxHighlighter>
|
||||||
|
|
|
||||||
|
|
@ -28,7 +28,7 @@ const TabsTrigger = React.forwardRef<
|
||||||
<TabsPrimitive.Trigger
|
<TabsPrimitive.Trigger
|
||||||
ref={ref}
|
ref={ref}
|
||||||
className={cn(
|
className={cn(
|
||||||
"inline-flex h-full items-center justify-center whitespace-nowrap px-3 py-1.5 text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-b-2 data-[state=active]:border-current data-[state=active]:text-primary data-[state=inactive]:hover:bg-secondary/80",
|
"inline-flex h-full items-center justify-center whitespace-nowrap px-3 py-1.5 text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-b-2 data-[state=active]:border-current data-[state=active]:text-primary data-[state=inactive]:hover:text-primary",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
{...props}
|
{...props}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue