fix(material/grid-list): remove internal figure element

Removes the built-in `figure` element inside the grid tile since it isn't always desirable from an accessibility perspective. Fixes #21775.
angular · Mar 3, 2021 · f365f9e · f365f9e
1 parent 389e66a
commit f365f9e
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 15 deletions.
diff --git a/src/material/grid-list/grid-list.scss b/src/material/grid-list/grid-list.scss
@@ -19,18 +19,6 @@ $text-padding: 16px;
   position: absolute;
   overflow: hidden;
 
-  .mat-figure {
-    @include layout-common.fill;
-    display: flex;
-
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-
-    padding: 0;
-    margin: 0;
-  }
-
   // Headers & footers
   .mat-grid-tile-header,
   .mat-grid-tile-footer {
@@ -79,3 +67,15 @@ $text-padding: 16px;
     }
   }
 }
+
+.mat-grid-tile-content {
+  @include mat-fill;
+  display: flex;
+
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+
+  padding: 0;
+  margin: 0;
+}
diff --git a/src/material/grid-list/grid-tile.html b/src/material/grid-list/grid-tile.html
@@ -1,4 +1,3 @@
-<!-- TODO(kara): Revisit why this is a figure.-->
-<figure class="mat-figure">
+<div class="mat-grid-tile-content">
   <ng-content></ng-content>
-</figure>
+</div>