fix(card): size avatar only in the header thumbnail (#1873)

Author: simeonoff

src/components/card/themes/card.content.base.scss

@@ -13,7 +13,3 @@
 ::slotted(*) {
     margin: 0;
 }
-
-::slotted(igc-avatar) {
-    --ig-size: 1;
-}

src/components/card/themes/card.header.base.scss

@@ -17,7 +17,8 @@
     opacity: inherit;
 }
 
-::slotted(igc-avatar) {
+::slotted([slot='thumbnail']),
+::slotted(igc-avatar[slot='thumbnail']) {
     --ig-size: 1;
 }
 

src/components/card/themes/content.ts

@@ -3,24 +3,17 @@ import { css } from 'lit';
 import type { Themes } from '../../../theming/types.js';
 // Shared Styles
 import { styles as bootstrap } from './shared/content/card.content.bootstrap.css.js';
-import { styles as indigo } from './shared/content/card.content.indigo.css.js';
 
 const light = {
   bootstrap: css`
     ${bootstrap}
   `,
-  indigo: css`
-    ${indigo}
-  `,
 };
 
 const dark = {
   bootstrap: css`
     ${bootstrap}
   `,
-  indigo: css`
-    ${indigo}
-  `,
 };
 
 export const all: Themes = { light, dark };

src/components/card/themes/shared/content/card.content.indigo.scss

@@ -1,15 +1,16 @@
 @use 'styles/utilities' as *;
 
 :host {
-    ::slotted(igc-avatar) {
-        --ig-size: 3;
-    }
-
     [part='header'] {
         gap: rem(2px);
     }
 }
 
+::slotted([slot='thumbnail']),
+::slotted(igc-avatar[slot='thumbnail']) {
+    --ig-size: 3;
+}
+
 ::slotted([slot='subtitle']) {
     @include type-style('body-2');