Skip to content

Commit 041643b

Browse files
authored
Add a prefix comment for M2 Sass APIs to allow transformations to occur internally (#6991)
Required for internal cl/753816882
1 parent f5ab715 commit 041643b

28 files changed

+193
-109
lines changed

tensorboard/plugins/debugger_v2/tf_debugger_v2_plugin/views/common/_lib.scss

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,10 @@ limitations under the License.
1515
@use '@angular/material' as mat;
1616

1717
@mixin debugger-op-type {
18-
background-color: mat.get-color-from-palette(mat.$blue-grey-palette, 50);
18+
background-color: /*m2*/ mat.get-color-from-palette(
19+
/*m2$*/ mat.$blue-grey-palette,
20+
50
21+
);
1922
@include tb-theme-foreground-prop(border, border, 1px solid);
2023
border-radius: 4px;
2124
font-family: 'Roboto Mono', monospace;
@@ -26,13 +29,19 @@ limitations under the License.
2629
width: max-content;
2730

2831
@include tb-dark-theme {
29-
background-color: mat.get-color-from-palette(mat.$blue-grey-palette, 700);
32+
background-color: /*m2*/ mat.get-color-from-palette(
33+
/*m2$*/ mat.$blue-grey-palette,
34+
700
35+
);
3036
}
3137
}
3238

3339
@mixin debugger-highlight-background {
3440
background-color: #fff099;
3541
@include tb-dark-theme {
36-
background-color: mat.get-color-from-palette(mat.$orange-palette, 900);
42+
background-color: /*m2*/ mat.get-color-from-palette(
43+
/*m2$*/ mat.$orange-palette,
44+
900
45+
);
3746
}
3847
}

tensorboard/plugins/debugger_v2/tf_debugger_v2_plugin/views/execution_data/execution_data_component.scss

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,15 +45,21 @@ limitations under the License.
4545
}
4646

4747
.focus-execution-container {
48-
background-color: mat.get-color-from-palette(mat.$orange-palette, 200);
48+
background-color: /*m2*/ mat.get-color-from-palette(
49+
/*m2$*/ mat.$orange-palette,
50+
200
51+
);
4952
border-radius: 4px;
5053
font-size: 12px;
5154
height: 120px;
5255
padding: 5px;
5356
width: 360px;
5457

5558
@include tb-dark-theme {
56-
background-color: mat.get-color-from-palette(mat.$orange-palette, 900);
59+
background-color: /*m2*/ mat.get-color-from-palette(
60+
/*m2$*/ mat.$orange-palette,
61+
900
62+
);
5763
}
5864
}
5965

tensorboard/plugins/debugger_v2/tf_debugger_v2_plugin/views/graph/graph_op_component.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,9 @@ limitations under the License.
3131
padding: 2px 6px;
3232
text-align: right;
3333
width: 200px;
34+
$grey-600: /*m2*/ mat.get-color-from-palette(mat.$gray-palette, 600);
3435
@include tb-dark-theme {
35-
box-shadow: 1px 3px mat.get-color-from-palette(mat.$gray-palette, 600);
36+
box-shadow: 1px 3px $grey-600;
3637
}
3738
}
3839

tensorboard/webapp/feature_flag/views/feature_flag_dialog_component.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,13 +17,13 @@ limitations under the License.
1717

1818
.message {
1919
.warning {
20-
color: mat.get-color-from-palette($tb-warn);
20+
color: /*m2*/ mat.get-color-from-palette($tb-warn);
2121
}
2222
margin-bottom: 16px;
2323
}
2424

2525
.note-1 {
26-
color: mat.get-color-from-palette($tb-accent);
26+
color: /*m2*/ mat.get-color-from-palette($tb-accent);
2727
}
2828

2929
.scrolling-page {

tensorboard/webapp/metrics/views/card_renderer/image_card_component.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -153,7 +153,7 @@ $_title-to-heading-gap: 12px;
153153
}
154154

155155
:host ::ng-deep .mat-slider-min-value .mat-slider-thumb {
156-
background-color: mat.get-color-from-palette($tb-primary);
156+
background-color: /*m2*/ mat.get-color-from-palette($tb-primary);
157157
}
158158

159159
:host ::ng-deep .hide-slider.mat-slider-horizontal .mat-slider-track-wrapper {

tensorboard/webapp/metrics/views/card_renderer/scalar_card_component.scss

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -196,10 +196,13 @@ $_data_table_initial_height: 100px;
196196
align-items: center;
197197

198198
.expand-button {
199-
color: mat.get-color-from-palette($tb-foreground, secondary-text);
199+
color: /*m2*/ mat.get-color-from-palette($tb-foreground, secondary-text);
200200

201201
@include tb-dark-theme {
202-
color: mat.get-color-from-palette($tb-dark-foreground, secondary-text);
202+
color: /*m2*/ mat.get-color-from-palette(
203+
$tb-dark-foreground,
204+
secondary-text
205+
);
203206
background-color: map-get($tb-dark-background, background);
204207
}
205208
}

tensorboard/webapp/metrics/views/card_renderer/vis_linked_time_selection_warning_component.scss

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,17 +16,17 @@ limitations under the License.
1616
@import 'tensorboard/webapp/theme/tb_theme';
1717

1818
:host {
19-
color: mat.get-color-from-palette(
20-
map-get(mat.get-color-config($tb-theme), warn),
19+
color: /*m2*/ mat.get-color-from-palette(
20+
map-get(/*m2*/ mat.get-color-config($tb-theme), warn),
2121
700
2222
);
2323
height: 1em;
2424
line-height: 0;
2525
display: inline-flex;
2626

2727
@include tb-dark-theme {
28-
color: mat.get-color-from-palette(
29-
map-get(mat.get-color-config($tb-dark-theme), warn),
28+
color: /*m2*/ mat.get-color-from-palette(
29+
map-get(/*m2*/ mat.get-color-config($tb-dark-theme), warn),
3030
700
3131
);
3232
}

tensorboard/webapp/metrics/views/main_view/filter_input_component.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ tb-filter-input {
2828
@include tb-theme-foreground-prop(color, text);
2929

3030
&:not(.valid) {
31-
$_error-color: mat.get-color-from-palette($tb-warn, 800);
31+
$_error-color: /*m2*/ mat.get-color-from-palette($tb-warn, 800);
3232

3333
color: $_error-color;
3434

tensorboard/webapp/metrics/views/main_view/main_view_component.scss

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,10 @@ mat-button-toggle-group.filter-view {
8686
.main,
8787
.sidebar {
8888
contain: strict;
89-
background-color: mat.get-color-from-palette($tb-background, background);
89+
background-color: /*m2*/ mat.get-color-from-palette(
90+
$tb-background,
91+
background
92+
);
9093
overflow-x: hidden;
9194
overflow-y: auto;
9295
will-change: transform, scroll-position;
@@ -97,7 +100,7 @@ mat-button-toggle-group.filter-view {
97100
}
98101

99102
.main {
100-
background-color: mat.get-color-from-palette($tf-slate, 200);
103+
background-color: /*m2*/ mat.get-color-from-palette($tf-slate, 200);
101104
flex: 1 1;
102105
display: flex;
103106
flex-direction: column;
@@ -153,16 +156,19 @@ mat-button-toggle-group.filter-view {
153156

154157
/** TODO(psybuzz): consider making a tb-button instead. */
155158
:host .settings-button {
156-
color: mat.get-color-from-palette($tb-foreground, secondary-text);
159+
color: /*m2*/ mat.get-color-from-palette($tb-foreground, secondary-text);
157160
display: inline-flex;
158161

159162
@include tb-dark-theme {
160-
color: mat.get-color-from-palette($tb-dark-foreground, secondary-text);
163+
color: /*m2*/ mat.get-color-from-palette(
164+
$tb-dark-foreground,
165+
secondary-text
166+
);
161167
}
162168

163169
&.checked {
164170
@include tb-theme-background-prop(background-color, selected-button);
165-
border-color: mat.get-color-from-palette(mat.$gray-palette, 300);
171+
border-color: /*m2*/ mat.get-color-from-palette(mat.$gray-palette, 300);
166172
}
167173

168174
::ng-deep .mat-button-wrapper {
@@ -176,7 +182,10 @@ mat-button-toggle-group.filter-view {
176182
}
177183

178184
.slide-out-menu {
179-
background-color: mat.get-color-from-palette($tb-background, background);
185+
background-color: /*m2*/ mat.get-color-from-palette(
186+
$tb-background,
187+
background
188+
);
180189
// Make the menu the full height minus the size of the toolbar.
181190
height: calc(100% - 49px);
182191
position: absolute;

tensorboard/webapp/metrics/views/main_view/pinned_view_component.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ mat-icon {
6565

6666
.new-card-pinned {
6767
animation: pinned-view-fade-out 3s linear;
68-
background: mat.get-color-from-palette(mat.$red-palette, 500);
68+
background: /*m2*/ mat.get-color-from-palette(mat.$red-palette, 500);
6969
border-radius: 5px;
7070
color: #fff;
7171
display: inline-block;

0 commit comments

Comments
 (0)