bug(mat-form-field): input placeholder overlapping input text, SASS depreciation warning

Reproduction

Use StackBlitz to reproduce your issue: https://stackblitz.com/fork/components-issue

Steps to reproduce:

1. Create a form using <mat-form-field appearance="outline">
2. Compare local build versus production build

Expected Behavior

What behavior were you expecting to see?

Actual Behavior

What behavior did you actually see?

After building my project with ng build --prod --configuration=production --aot, my input fields look like this:

DEPRECATION WARNING: As of Dart Sass 2.0.0, !global assignments won't be able to
declare new variables. Consider adding `$mat-form-field-outline-dedupe: null` at the root of the
stylesheet.

     ╷
4645 │   $mat-form-field-outline-dedupe: $mat-form-field-outline-dedupe + 0.00001 !global;
     │   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
     ╵
    node_modules/@angular/material/_theming.scss 4645:3  -mat-form-field-outline-label-floating()
    node_modules/@angular/material/_theming.scss 4682:9  mat-form-field-outline-typography()
    node_modules/@angular/material/_theming.scss 4951:3  mat-form-field-typography()
    node_modules/@angular/material/_theming.scss 5005:3  angular-material-typography()
    node_modules/@angular/material/_theming.scss 5033:3  mat-core()
    src/assets/styles/modules/_nav-search.scss 2:1       @import
    src/assets/styles/partials/_theme.scss 2:9           @import
    src/assets/styles/_partials.scss 2:13                @import
    stdin 1:9                                            root stylesheet

Environment

OS: macOS Catalina 10.15.4 Browser: Chrome 81.0.4044.113

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 9.1.1
Node: 13.11.0
OS: darwin x64

Angular: 9.1.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.1
@angular-devkit/build-angular     0.901.1
@angular-devkit/build-optimizer   0.901.1
@angular-devkit/build-webpack     0.901.1
@angular-devkit/core              9.1.1
@angular-devkit/schematics        9.1.1
@angular/cdk                      9.2.1
@angular/cli                      9.1.1
@angular/flex-layout              9.0.0-beta.29
@angular/material                 9.2.1
@ngtools/webpack                  9.1.1
@schematics/angular               9.1.1
@schematics/update                0.901.1
rxjs                              6.5.5
typescript                        3.7.5
webpack                           4.42.0

[shinkhouse]

@crisbeto Yes, that seemed to work. The warnings are gone AND the fields are fixed.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}