Skip to content

Commit 1650cf6

Browse files
authored
Bug Fix: Fix data table icons in dark mode (#6409)
## Motivation for features / changes The sort icons should turn white in dark mode. This seems to be a bug with material icons having set the fill attribute of the svg path to black for the down arrow icon. The up arrow (which works) ![image](https://github.com/tensorflow/tensorboard/assets/78179109/995455e3-84ae-482f-92be-df8a2b463ef0) The down arrow (which does not) ![image](https://github.com/tensorflow/tensorboard/assets/78179109/a46201ff-dd15-440a-accc-1db71106d00c) ## Technical description of changes ## Screenshots of UI changes (or N/A) Before ![image](https://github.com/tensorflow/tensorboard/assets/78179109/65c2eacd-26c8-43a4-aaef-68c5700cb675) After: ![image](https://github.com/tensorflow/tensorboard/assets/78179109/6d1369f7-17c1-4f38-9603-8869233acfb5) ## Alternate designs / implementations considered (or N/A) We are using the icon from version 3.0.1 but when I checked version 4.0.0 (the newest) the problem had not been fixed.
1 parent 7e83f8e commit 1650cf6

File tree

1 file changed

+4
-0
lines changed

1 file changed

+4
-0
lines changed

tensorboard/webapp/widgets/data_table/data_table_component.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,10 @@ $_accent: map-get(mat.get-color-config($tb-theme), accent);
8585
.cell mat-icon {
8686
height: 12px;
8787
width: 12px;
88+
89+
::ng-deep path {
90+
fill: unset;
91+
}
8892
}
8993

9094
.sorting-icon-container {

0 commit comments

Comments
 (0)