diff --git a/packages/carbon-web-components/src/components/button/button.scss b/packages/carbon-web-components/src/components/button/button.scss index ee15ec37b2f..94fee4afab0 100644 --- a/packages/carbon-web-components/src/components/button/button.scss +++ b/packages/carbon-web-components/src/components/button/button.scss @@ -12,13 +12,8 @@ $css--plex: true !default; @use '@carbon/styles/scss/utilities/convert' as *; @use '@carbon/styles/scss/theme' as *; @use '@carbon/styles/scss/components/button' as *; -@use '@carbon/styles/scss/components/popover/index'; -@use '@carbon/styles/scss/components/code-snippet/code-snippet' as *; -@use '@carbon/styles/scss/components/tooltip'; @use '@carbon/styles/scss/layout' as *; -@include code-snippet; - :host(#{$prefix}-button), :host(#{$prefix}-modal-footer-button) { @include emit-layout-tokens(); diff --git a/packages/styles/scss/components/button/_button.scss b/packages/styles/scss/components/button/_button.scss index 03f15a05328..e4e2d4f0490 100644 --- a/packages/styles/scss/components/button/_button.scss +++ b/packages/styles/scss/components/button/_button.scss @@ -11,6 +11,10 @@ @use '../../globals/vars' as *; @use '../../../../carbon-web-components/src/components/button/button'; +/** + * This file is no longer used by the button-group components. + * It remains here, temporarily, as a source for other styles to extend & use. + */ @mixin button { :host(#{$c4d-prefix}-button) { @extend :host(#{$prefix}-button); diff --git a/packages/web-components/src/components/button/button.scss b/packages/web-components/src/components/button/button.scss index 213a82edf53..0ed64a00235 100644 --- a/packages/web-components/src/components/button/button.scss +++ b/packages/web-components/src/components/button/button.scss @@ -5,4 +5,39 @@ // LICENSE file in the root directory of this source tree. // -@use '@carbon/ibmdotcom-styles/scss/components/button/index' as *; +@use '@carbon/styles/scss/config' as *; +@use '@carbon/styles/scss/spacing' as *; +@use '@carbon/styles/scss/theme' as *; +@use '@carbon/ibmdotcom-styles/scss/globals/vars' as *; +@use '../../../../carbon-web-components/src/components/button/button.scss'; + +@mixin button { + :host(#{$c4d-prefix}-button) { + @extend :host(#{$prefix}-button); + + svg { + @extend .#{$prefix}--btn__icon; + } + + .#{$prefix}--btn--hidden { + display: none; + visibility: hidden; + + @media print { + display: inline-block; + visibility: visible; + font-weight: 200; + color: $text-primary; + + span { + font-weight: 600; + margin-left: calc(-1 * #{$spacing-02}); + margin-right: $spacing-02; + } + } + } + } +} + +@include button; +