Skip to content

Commit a46d5fa

Browse files
authored
pass button classname instead of icon classname to fix padding (#7006)
## 📝 Summary <!-- Provide a concise summary of what this pull request is addressing. If this PR fixes any issues, list them here by number (e.g., Fixes #123). --> the copy button was taking up unecessary padding, because the styles were applied to the icon, not the button. before: ![CleanShot 2025-10-31 at 00 25 34](https://github.com/user-attachments/assets/290aa70a-4acb-4834-aa1f-c8ef0163d517) after: ![CleanShot 2025-10-31 at 00 27 36](https://github.com/user-attachments/assets/e9eedb10-9246-4792-ad78-f74b30beedc8) ## 🔍 Description of Changes <!-- Detail the specific changes made in this pull request. Explain the problem addressed and how it was resolved. If applicable, provide before and after comparisons, screenshots, or any relevant details to help reviewers understand the changes easily. --> ## 📋 Checklist - [x] I have read the [contributor guidelines](https://github.com/marimo-team/marimo/blob/main/CONTRIBUTING.md). - [ ] For large changes, or changes that affect the public API: this change was discussed or approved through an issue, on [Discord](https://marimo.io/discord?ref=pr), or the community [discussions](https://github.com/marimo-team/marimo/discussions) (Please provide a link if applicable). - [x] I have added tests for the changes made. - [x] I have run the code and verified that it works as expected.
1 parent 77e346b commit a46d5fa

File tree

2 files changed

+5
-1
lines changed

2 files changed

+5
-1
lines changed

frontend/src/components/icons/copy-icon.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { toast } from "../ui/use-toast";
1111
interface Props {
1212
value: string | ((event: React.MouseEvent) => string);
1313
className?: string;
14+
buttonClassName?: string;
1415
tooltip?: React.ReactNode | false;
1516
toastTitle?: string;
1617
ariaLabel?: string;
@@ -19,6 +20,7 @@ interface Props {
1920
export const CopyClipboardIcon: React.FC<Props> = ({
2021
value,
2122
className,
23+
buttonClassName,
2224
tooltip,
2325
toastTitle,
2426
ariaLabel,
@@ -41,6 +43,7 @@ export const CopyClipboardIcon: React.FC<Props> = ({
4143
type="button"
4244
onClick={handleCopy}
4345
aria-label={ariaLabel ?? "Copy to clipboard"}
46+
className={buttonClassName}
4447
>
4548
{isCopied ? (
4649
<CheckIcon className={cn(className, "text-(--grass-11)")} />

frontend/src/plugins/impl/code/any-language-editor.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,8 @@ const AnyLanguageCodeMirror: React.FC<
5858
{showCopyButton && !isNotSupported && (
5959
<CopyClipboardIcon
6060
tooltip={false}
61-
className="absolute top-2 right-2 p-1 hover-action z-10 text-muted-foreground"
61+
buttonClassName="absolute top-2 right-2 z-10 hover-action"
62+
className="h-4 w-4 text-muted-foreground"
6263
value={props.value || ""}
6364
toastTitle="Copied to clipboard"
6465
/>

0 commit comments

Comments
 (0)