From dbd98de65491dbf6e1e37ef81db5cbf40d91f3da Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Thu, 3 Feb 2022 10:43:19 +0100 Subject: [PATCH] fix(material-experimental/mdc-tabs): CSS applied to wrong element when preserveContent is enabled When `preserveContent` is enabled we add an extra `display: none` to prevent users from tabbing into hidden content. The selector was placed on the wrong element for the MDC-based tabs. --- .../mdc-tabs/tab-body.scss | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/material-experimental/mdc-tabs/tab-body.scss b/src/material-experimental/mdc-tabs/tab-body.scss index fd7ff38c9d55..8566c5c9be49 100644 --- a/src/material-experimental/mdc-tabs/tab-body.scss +++ b/src/material-experimental/mdc-tabs/tab-body.scss @@ -22,6 +22,15 @@ .mat-mdc-tab-group.mat-mdc-tab-group-dynamic-height &.mat-mdc-tab-body-active { overflow-y: hidden; } +} + +.mat-mdc-tab-body-content { + height: 100%; + overflow: auto; + + .mat-mdc-tab-group-dynamic-height & { + overflow: hidden; + } // Usually the `visibility: hidden` added by the animation is enough to prevent focus from // entering the collapsed content, but children with their own `visibility` can override it. @@ -34,12 +43,3 @@ display: none; } } - -.mat-mdc-tab-body-content { - height: 100%; - overflow: auto; - - .mat-mdc-tab-group-dynamic-height & { - overflow: hidden; - } -}