diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/button/Examples.js b/packages/dnb-design-system-portal/src/docs/uilib/components/button/Examples.js
index f51c2b469bd..615ffef08f4 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/components/button/Examples.js
+++ b/packages/dnb-design-system-portal/src/docs/uilib/components/button/Examples.js
@@ -99,14 +99,7 @@ export const ButtonTertiary = () => (
text={Text inside additional span}
icon_position="left"
icon="chevron_left"
- left
-/>
-
`}
@@ -120,14 +113,6 @@ export const ButtonTertiaryTop = () => (
icon_position="top"
icon="close"
text="Button text"
- right="large"
-/>
-
`}
diff --git a/packages/dnb-eufemia-sandbox/stories/components/Button.js b/packages/dnb-eufemia-sandbox/stories/components/Button.js
index 6e4637c025c..24efbdc6a5c 100644
--- a/packages/dnb-eufemia-sandbox/stories/components/Button.js
+++ b/packages/dnb-eufemia-sandbox/stories/components/Button.js
@@ -269,6 +269,23 @@ export const ButtonSandbox = () => (
+
+
+
+
+
+
+
)
diff --git a/packages/dnb-eufemia/src/components/autocomplete/__tests__/__snapshots__/Autocomplete.test.js.snap b/packages/dnb-eufemia/src/components/autocomplete/__tests__/__snapshots__/Autocomplete.test.js.snap
index 427c4ddfb16..3d923af68b4 100644
--- a/packages/dnb-eufemia/src/components/autocomplete/__tests__/__snapshots__/Autocomplete.test.js.snap
+++ b/packages/dnb-eufemia/src/components/autocomplete/__tests__/__snapshots__/Autocomplete.test.js.snap
@@ -1634,6 +1634,8 @@ exports[`Autocomplete scss have to match snapshot 1`] = `
padding-left: 1rem; }
.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large {
padding-right: 1rem; }
+ .dnb-button--tertiary .dnb-button__text {
+ margin: 0; }
.dnb-button--has-text {
width: auto; }
.dnb-button--has-text .dnb-button__icon {
diff --git a/packages/dnb-eufemia/src/components/button/Button.js b/packages/dnb-eufemia/src/components/button/Button.js
index fcf3ec92d21..df61bf1d2fd 100644
--- a/packages/dnb-eufemia/src/components/button/Button.js
+++ b/packages/dnb-eufemia/src/components/button/Button.js
@@ -159,7 +159,7 @@ export default class Button extends React.PureComponent {
usedSize = 'default'
}
}
- if (!iconSize && variant === 'tertiary' && usedSize === 'large') {
+ if (!iconSize && variant === 'tertiary' && icon_position === 'top') {
iconSize = 'medium'
}
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/Button.test.js.snap b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/Button.test.js.snap
index 014166ed0ab..8162a2a292e 100644
--- a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/Button.test.js.snap
+++ b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/Button.test.js.snap
@@ -1782,6 +1782,8 @@ exports[`Button scss have to match snapshot 1`] = `
padding-left: 1rem; }
.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large {
padding-right: 1rem; }
+ .dnb-button--tertiary .dnb-button__text {
+ margin: 0; }
.dnb-button--has-text {
width: auto; }
.dnb-button--has-text .dnb-button__icon {
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-all-tertiary-buttons-1-81956.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-all-tertiary-buttons-1-81956.snap.png
index 996dc8e21d7..132e5211203 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-all-tertiary-buttons-1-81956.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-all-tertiary-buttons-1-81956.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-1-85395.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-1-85395.snap.png
index 56e971838ca..2de2271f55c 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-1-85395.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-1-85395.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-active-state-1-32a3c.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-active-state-1-32a3c.snap.png
index 56e971838ca..2de2271f55c 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-active-state-1-32a3c.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-active-state-1-32a3c.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-focus-state-1-7fc7a.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-focus-state-1-7fc7a.snap.png
index 06d2f3c5f89..813d793fecb 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-focus-state-1-7fc7a.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-focus-state-1-7fc7a.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-hover-state-1-cac6d.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-hover-state-1-cac6d.snap.png
index 2971bc2a749..22eeb0522ba 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-hover-state-1-cac6d.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-dnb-button-tertiary-with-hover-state-1-cac6d.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-button-with-text-wrap-1-6d941.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-button-with-text-wrap-1-6d941.snap.png
index dd2e0d22037..302c6c72117 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-button-with-text-wrap-1-6d941.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-button-with-text-wrap-1-6d941.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-with-top-icon-1-210ac.snap.png b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-with-top-icon-1-210ac.snap.png
index 9625a328f05..c75bef3621c 100644
Binary files a/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-with-top-icon-1-210ac.snap.png and b/packages/dnb-eufemia/src/components/button/__tests__/__snapshots__/button-screenshot-test-js-button-tertiary-screenshot-have-to-match-tertiary-with-top-icon-1-210ac.snap.png differ
diff --git a/packages/dnb-eufemia/src/components/button/style/_button.scss b/packages/dnb-eufemia/src/components/button/style/_button.scss
index d915daa017a..a1ea8e327e6 100644
--- a/packages/dnb-eufemia/src/components/button/style/_button.scss
+++ b/packages/dnb-eufemia/src/components/button/style/_button.scss
@@ -169,6 +169,10 @@
padding-right: 1rem;
}
+ &--tertiary &__text {
+ margin: 0;
+ }
+
// size default
/* stylelint-disable-next-line */
diff --git a/packages/dnb-eufemia/src/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap b/packages/dnb-eufemia/src/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
index 5c705deec42..c97f4fc0d68 100644
--- a/packages/dnb-eufemia/src/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
+++ b/packages/dnb-eufemia/src/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
@@ -2199,6 +2199,8 @@ exports[`DatePicker scss have to match snapshot 1`] = `
padding-left: 1rem; }
.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large {
padding-right: 1rem; }
+ .dnb-button--tertiary .dnb-button__text {
+ margin: 0; }
.dnb-button--has-text {
width: auto; }
.dnb-button--has-text .dnb-button__icon {
diff --git a/packages/dnb-eufemia/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap b/packages/dnb-eufemia/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
index 9cf542ae87e..5fbda71fdb5 100644
--- a/packages/dnb-eufemia/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
+++ b/packages/dnb-eufemia/src/components/dropdown/__tests__/__snapshots__/Dropdown.test.js.snap
@@ -1753,6 +1753,8 @@ exports[`Dropdown scss have to match snapshot 1`] = `
padding-left: 1rem; }
.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large {
padding-right: 1rem; }
+ .dnb-button--tertiary .dnb-button__text {
+ margin: 0; }
.dnb-button--has-text {
width: auto; }
.dnb-button--has-text .dnb-button__icon {
diff --git a/packages/dnb-eufemia/src/components/global-error/__tests__/__snapshots__/GlobalError.test.js.snap b/packages/dnb-eufemia/src/components/global-error/__tests__/__snapshots__/GlobalError.test.js.snap
index 8503c79368e..65597aa0491 100644
--- a/packages/dnb-eufemia/src/components/global-error/__tests__/__snapshots__/GlobalError.test.js.snap
+++ b/packages/dnb-eufemia/src/components/global-error/__tests__/__snapshots__/GlobalError.test.js.snap
@@ -370,6 +370,8 @@ exports[`GlobalError scss have to match snapshot 1`] = `
padding-left: 1rem; }
.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large {
padding-right: 1rem; }
+ .dnb-button--tertiary .dnb-button__text {
+ margin: 0; }
.dnb-button--has-text {
width: auto; }
.dnb-button--has-text .dnb-button__icon {
diff --git a/packages/dnb-eufemia/src/components/global-status/__tests__/__snapshots__/GlobalStatus.test.js.snap b/packages/dnb-eufemia/src/components/global-status/__tests__/__snapshots__/GlobalStatus.test.js.snap
index 8587ea947e2..334b8d240d4 100644
--- a/packages/dnb-eufemia/src/components/global-status/__tests__/__snapshots__/GlobalStatus.test.js.snap
+++ b/packages/dnb-eufemia/src/components/global-status/__tests__/__snapshots__/GlobalStatus.test.js.snap
@@ -429,6 +429,8 @@ exports[`GlobalStatus scss have to match snapshot 1`] = `
padding-left: 1rem; }
.dnb-button--has-text.dnb-button--icon-position-right.dnb-button--size-large {
padding-right: 1rem; }
+ .dnb-button--tertiary .dnb-button__text {
+ margin: 0; }
.dnb-button--has-text {
width: auto; }
.dnb-button--has-text .dnb-button__icon {
@@ -725,10 +727,8 @@ html[data-visual-test] .dnb-global-status__shell {
.dnb-global-status__close-button, .dnb-global-status__close-button.dnb-button--tertiary {
position: absolute;
z-index: 1;
- top: -0.25rem;
right: 1rem;
- left: auto;
- margin-top: 0.75rem; }
+ left: auto; }
.dnb-modal__content__inner .dnb-global-status__close-button {
right: 0; }
@@ -942,7 +942,7 @@ exports[`GlobalStatus snapshot have to match component snapshot 1`] = `
wrap={null}
>