diff --git a/.changeset/old-moose-live.md b/.changeset/old-moose-live.md new file mode 100644 index 0000000000..619b3b0520 --- /dev/null +++ b/.changeset/old-moose-live.md @@ -0,0 +1,5 @@ +--- +"@navikt/ds-css": patch +--- + +CopyButton: Icon is now 20px for size small and xsmall. diff --git a/@navikt/core/css/copybutton.css b/@navikt/core/css/copybutton.css index 2a23018444..2f56150ae4 100644 --- a/@navikt/core/css/copybutton.css +++ b/@navikt/core/css/copybutton.css @@ -51,6 +51,7 @@ --__ac-copybutton-padding: var(--a-spacing-1) var(--a-spacing-3) var(--a-spacing-1) var(--a-spacing-2); min-height: 2rem; + min-width: 2rem; } .navds-copybutton--small.navds-copybutton--icon-right { @@ -61,6 +62,7 @@ --__ac-copybutton-padding: var(--a-spacing-05) var(--a-spacing-2) var(--a-spacing-05) var(--a-spacing-1); min-height: 1.5rem; + min-width: 1.5rem; } .navds-copybutton--xsmall.navds-copybutton--icon-right { @@ -79,15 +81,15 @@ --__ac-copybutton-padding: var(--a-spacing-05); } -.navds-copybutton--xsmall .navds-copybutton__icon { - font-size: 1.25rem; -} - .navds-copybutton__icon { font-size: 1.5rem; display: flex; } +:where(.navds-copybutton--xsmall, .navds-copybutton--small) .navds-copybutton__icon { + font-size: 1.25rem; +} + .navds-copybutton__icon:first-of-type { margin-left: -0.25rem; } diff --git a/@navikt/core/react/src/copybutton/copy-button.stories.tsx b/@navikt/core/react/src/copybutton/copy-button.stories.tsx index abea65445c..c0eef0c9b4 100644 --- a/@navikt/core/react/src/copybutton/copy-button.stories.tsx +++ b/@navikt/core/react/src/copybutton/copy-button.stories.tsx @@ -8,6 +8,9 @@ import { Tooltip } from "../tooltip"; const meta: Meta = { title: "ds-react/CopyButton", component: CopyButton, + parameters: { + chromatic: { disable: true }, + }, }; export default meta; @@ -32,9 +35,6 @@ export const Default: Story = { text: "", activeText: "", }, - parameters: { - chromatic: { disable: true }, - }, }; export const Interaction: Story = {