From bc3d387722aa34119b820000665defd8f6b0057c Mon Sep 17 00:00:00 2001 From: James Date: Tue, 29 Aug 2023 13:17:49 -0700 Subject: [PATCH] MDC Migration: Apply tb theme to new mat components (#6562) ## Motivation for features / changes We are starting to use the new MDC components. This applies our theme to those components so they are the correct colors. --- tensorboard/webapp/theme/_tb_theme.template.scss | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/tensorboard/webapp/theme/_tb_theme.template.scss b/tensorboard/webapp/theme/_tb_theme.template.scss index dd586514f9..24ed43be2f 100644 --- a/tensorboard/webapp/theme/_tb_theme.template.scss +++ b/tensorboard/webapp/theme/_tb_theme.template.scss @@ -262,10 +262,14 @@ $tb-dark-theme: map_merge( // Apply themed style for the global stylesheet (styles.scss). @mixin tb-global-themed-styles() { + // TODO(JamesHollyer): remove legacy component themes once all components + // are migrated. @include mat.core(); @include mat.all-legacy-component-typographies(); + @include mat.all-component-typographies(); // Include all theme-styles for the components based on the current theme. @include mat.all-legacy-component-themes($tb-theme); + @include mat.all-component-themes($tb-theme); body { // Prevents ngx-color-picker from creating a scrollbar and misposition. @@ -299,6 +303,9 @@ $tb-dark-theme: map_merge( } } + // TODO(JamesHollyer): remove legacy component themes once all components + // are migrated. + @include mat.all-component-themes($tb-dark-theme); @include mat.all-legacy-component-themes($tb-dark-theme); } }