fix(snackbar): style component using sass theme

Author: SisIvanova

src/components/snackbar/themes/shared/snackbar.bootstrap.scss

@@ -9,3 +9,9 @@ $theme: $material;
     background: var-get($theme, 'background');
     box-shadow: var-get($theme, 'elevation');
 }
+
+igc-button::part(base),
+igc-button::part(base):hover {
+    color: var-get($theme, 'button-color');
+    background: transparent;
+}

src/components/snackbar/themes/shared/snackbar.common.scss

@@ -7,11 +7,6 @@ $theme: $fluent;
     @include type-style('caption');
 }
 
-igc-button::part(base),
-igc-button::part(base):hover {
-    color: var-get($theme, 'button-color');
-}
-
 igc-button::part(base):focus-visible::after {
     display: none;
 }

src/components/snackbar/themes/shared/snackbar.fluent.scss

@@ -3,19 +3,7 @@
 
 $theme: $indigo;
 
-:host {
-    igc-button {
-        --ig-size: 2;
-    }
-}
-
 [part~='base'] {
     min-height: rem(36px);
     padding: pad-block(rem(4px)) pad-inline(rem(16px));
 }
-
-igc-button::part(base),
-igc-button::part(base):hover {
-    color: var-get($theme, 'button-color');
-    box-shadow: none;
-}

src/components/snackbar/themes/shared/snackbar.indigo.scss

@@ -6,6 +6,10 @@
     font-family: var(--ig-font-family);
     inset-inline: 50% auto;
     transform: translateX(calc(-50% + .5px));
+
+    igc-button {
+        --ig-size: 2;
+    }
 }
 
 :host([position='bottom']) {

src/components/snackbar/themes/snackbar.base.scss

@@ -13,7 +13,6 @@ import { styles as indigoLight } from './light/snackbar.indigo.css.js';
 import { styles as materialLight } from './light/snackbar.material.css.js';
 import { styles as shared } from './light/snackbar.shared.css.js';
 // Shared Styles
-import { styles as bootstrap } from './shared/snackbar.bootstrap.css.js';
 import { styles as fluent } from './shared/snackbar.fluent.css.js';
 import { styles as indigo } from './shared/snackbar.indigo.css.js';
 
@@ -22,7 +21,7 @@ const light = {
     ${shared}
   `,
   bootstrap: css`
-    ${bootstrap} ${bootstrapLight}
+    ${bootstrapLight}
   `,
   material: css`
     ${materialLight}
@@ -40,7 +39,7 @@ const dark = {
     ${shared}
   `,
   bootstrap: css`
-    ${bootstrap} ${bootstrapDark}
+    ${bootstrapDark}
   `,
   material: css`
     ${materialDark}