From e66bc9f117613de517ae39155f8f9d6ff92cb0a1 Mon Sep 17 00:00:00 2001
From: Material Web Team <material-web-copybara@google.com>
Date: Wed, 19 Oct 2022 06:45:15 -0700
Subject: [PATCH] improvement(tabs): Fix tab bar indicator precedence issue &
 Icon size css properties are applied to icon

PiperOrigin-RevId: 482190989
---
 packages/mdc-tab-bar/_tab-bar-theme.scss | 20 ++++++++++----------
 packages/mdc-tab/_tab-theme.scss         | 10 +++++++---
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/packages/mdc-tab-bar/_tab-bar-theme.scss b/packages/mdc-tab-bar/_tab-bar-theme.scss
index 50134a0fdc5..6e7831c9cf1 100644
--- a/packages/mdc-tab-bar/_tab-bar-theme.scss
+++ b/packages/mdc-tab-bar/_tab-bar-theme.scss
@@ -141,12 +141,12 @@ $secondary-navigation-tab-light-theme: (
     @include tab-theme.primary-navigation-tab-theme-styles(
       map-ext.pick($theme, map.keys(tab-theme.$primary-light-theme)...)
     );
-  }
 
-  .mdc-tab-indicator {
-    @include tab-indicator-theme.theme-styles(
-      map-ext.pick($theme, map.keys(tab-indicator-theme.$light-theme)...)
-    );
+    .mdc-tab-indicator {
+      @include tab-indicator-theme.theme-styles(
+        map-ext.pick($theme, map.keys(tab-indicator-theme.$light-theme)...)
+      );
+    }
   }
 }
 
@@ -155,11 +155,11 @@ $secondary-navigation-tab-light-theme: (
     @include tab-theme.secondary-navigation-tab-theme-styles(
       map-ext.pick($theme, map.keys(tab-theme.$secondary-light-theme)...)
     );
-  }
 
-  .mdc-tab-indicator {
-    @include tab-indicator-theme.theme-styles(
-      map-ext.pick($theme, map.keys(tab-indicator-theme.$light-theme)...)
-    );
+    .mdc-tab-indicator {
+      @include tab-indicator-theme.theme-styles(
+        map-ext.pick($theme, map.keys(tab-indicator-theme.$light-theme)...)
+      );
+    }
   }
 }
diff --git a/packages/mdc-tab/_tab-theme.scss b/packages/mdc-tab/_tab-theme.scss
index 4d48d35f6f9..48f92f238ad 100644
--- a/packages/mdc-tab/_tab-theme.scss
+++ b/packages/mdc-tab/_tab-theme.scss
@@ -256,6 +256,8 @@ $custom-property-prefix: 'tab';
   @include _divider-color(map.get($theme, divider-color));
   @include _divider-height(map.get($theme, divider-height));
 
+  @include _icon-size(map.get($theme, with-icon-icon-size));
+
   @include _active-icon-color(
     (
       default: map.get($theme, with-icon-active-icon-color),
@@ -543,9 +545,11 @@ $custom-property-prefix: 'tab';
 }
 
 @mixin _icon-size($size) {
-  @include theme.property('width', $size);
-  @include theme.property('height', $size);
-  @include theme.property('font-size', $size);
+  .mdc-tab__icon {
+    @include theme.property('width', $size);
+    @include theme.property('height', $size);
+    @include theme.property('font-size', $size);
+  }
 }
 
 @mixin _label-text-font-family($font-family) {