diff --git a/src/material/select/select.scss b/src/material/select/select.scss index 960356863fc3..62786f255c7a 100644 --- a/src/material/select/select.scss +++ b/src/material/select/select.scss @@ -151,35 +151,29 @@ div.mat-mdc-select-panel { // DOM for the Gmat versions to work. We need to bump up the specificity here // so that it's higher than MDC's styles. div.mat-mdc-select-panel { + $border-radius: 4px; width: 100%; // Ensures that the panel matches the overlay width. max-height: $mat-select-panel-max-height; outline: 0; overflow: auto; padding: 8px 0; - border-radius: 4px; box-sizing: border-box; + transform-origin: top center; + border-radius: 0 0 $border-radius $border-radius; // Necessary so the `offsetParent` of the nested `mat-option` is the // panel which is required for scroll calculations (see #30974). position: relative; - background-color: token-utils.slot(select-panel-background-color, $fallbacks); - @include cdk.high-contrast { - outline: solid 1px; - } - - .cdk-overlay-pane:not(.mat-mdc-select-panel-above) & { - border-top-left-radius: 0; - border-top-right-radius: 0; - transform-origin: top center; - } - .mat-mdc-select-panel-above & { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; + border-radius: $border-radius $border-radius 0 0; transform-origin: bottom center; } + + @include cdk.high-contrast { + outline: solid 1px; + } } .mat-select-panel-animations-enabled {