docs: clean up explicit form field appearance (#27103)

In #22837 we had to add `appearance="fill"` to all the examples to ensure a consistent appearance between the docs site and Stackblitz during the MDC transition. Now that the MDC components are the default, we don't need the explicit `appearance` anymore since `fill` is the default.

(cherry picked from commit 6679684)

Author: crisbeto

src/components-examples/cdk/a11y/focus-monitor-focus-via/focus-monitor-focus-via-example.html

@@ -3,7 +3,7 @@
   <button #unmonitored>2. Not Monitored</button>
 </div>
 
-<mat-form-field appearance="fill">
+<mat-form-field>
   <mat-label>Simulated focus origin</mat-label>
   <mat-select #simulatedOrigin value="mouse">
     <mat-option value="mouse">Mouse</mat-option>

src/components-examples/cdk/text-field/text-field-autofill-directive/text-field-autofill-directive-example.html

@@ -1,10 +1,10 @@
 <form (submit)="$event.preventDefault()">
-  <mat-form-field appearance="fill">
+  <mat-form-field>
     <mat-label>First name</mat-label>
     <input matInput (cdkAutofill)="firstNameAutofilled = $event.isAutofilled">
     <mat-hint *ngIf="firstNameAutofilled">Autofilled!</mat-hint>
   </mat-form-field>
-  <mat-form-field appearance="fill">
+  <mat-form-field>
     <mat-label>Last name</mat-label>
     <input matInput (cdkAutofill)="lastNameAutofilled = $event.isAutofilled">
     <mat-hint *ngIf="lastNameAutofilled">Autofilled!</mat-hint>

src/components-examples/cdk/text-field/text-field-autofill-monitor/text-field-autofill-monitor-example.html

@@ -1,10 +1,10 @@
 <form (submit)="$event.preventDefault()">
-  <mat-form-field appearance="fill">
+  <mat-form-field>
     <mat-label>First name</mat-label>
     <input matInput #first>
     <mat-hint *ngIf="firstNameAutofilled">Autofilled!</mat-hint>
   </mat-form-field>
-  <mat-form-field appearance="fill">
+  <mat-form-field>
     <mat-label>Last name</mat-label>
     <input matInput #last>
     <mat-hint *ngIf="lastNameAutofilled">Autofilled!</mat-hint>

src/components-examples/cdk/text-field/text-field-autosize-textarea/text-field-autosize-textarea-example.html

@@ -1,4 +1,4 @@
-<mat-form-field appearance="fill">
+<mat-form-field>
   <mat-label>Font size</mat-label>
   <mat-select #fontSize value="16px" (selectionChange)="triggerResize()">
     <mat-option value="10px">10px</mat-option>
@@ -10,7 +10,7 @@
   </mat-select>
 </mat-form-field>
 
-<mat-form-field [style.fontSize]="fontSize.value" appearance="fill">
+<mat-form-field [style.fontSize]="fontSize.value">
   <mat-label>Autosize textarea</mat-label>
   <textarea matInput
             cdkTextareaAutosize

src/components-examples/material-experimental/popover-edit/popover-edit-cell-span-mat-table/popover-edit-cell-span-mat-table-example.html

@@ -7,15 +7,15 @@
           [matEditLensPreservedFormValue]="preservedValues.get(ctx.person)"
           (matEditLensPreservedFormValueChange)="preservedValues.set(ctx.person, $event)">
         <div mat-edit-content class="example-input-container">
-          <mat-form-field appearance="fill">
+          <mat-form-field>
             <input matInput [ngModel]="ctx.person.firstName" name="firstName" required
                 [attr.cdkFocusInitial]="ctx.focus === 'firstName' || null">
           </mat-form-field>
-          <mat-form-field appearance="fill">
+          <mat-form-field>
             <input matInput [ngModel]="ctx.person.middleName" name="middleName"
                 [attr.cdkFocusInitial]="ctx.focus === 'middleName' || null">
           </mat-form-field>
-          <mat-form-field appearance="fill">
+          <mat-form-field>
             <input matInput [ngModel]="ctx.person.lastName" name="lastName" required
                 [attr.cdkFocusInitial]="ctx.focus === 'lastName' || null">
           </mat-form-field>

src/components-examples/material-experimental/popover-edit/popover-edit-mat-table-flex/popover-edit-mat-table-flex-example.html

@@ -11,7 +11,7 @@
           [matEditLensPreservedFormValue]="preservedWeightValues.get(element)"
           (matEditLensPreservedFormValueChange)="preservedWeightValues.set(element, $event)">
         <div mat-edit-content>
-          <mat-form-field appearance="fill">
+          <mat-form-field>
             <input matInput type="number" [ngModel]="element.weight" name="weight" required>
           </mat-form-field>
         </div>
@@ -42,7 +42,7 @@
               (matEditLensPreservedFormValueChange)="preservedNameValues.set(element, $event)">
             <h2 mat-edit-title>Name</h2>
             <div mat-edit-content>
-              <mat-form-field appearance="fill">
+              <mat-form-field>
                 <input matInput [ngModel]="element.name" name="name" required>
               </mat-form-field>
             </div>

src/components-examples/material-experimental/popover-edit/popover-edit-mat-table/popover-edit-mat-table-example.html

@@ -10,7 +10,7 @@
           (ngSubmit)="onSubmitWeight(element, f)"
           [(matEditLensPreservedFormValue)]="weightValues.for(element).value">
         <div mat-edit-content>
-          <mat-form-field appearance="fill">
+          <mat-form-field>
             <input matInput type="number" [ngModel]="element.weight" name="weight" required>
           </mat-form-field>
         </div>
@@ -57,7 +57,7 @@
               [(matEditLensPreservedFormValue)]="nameValues.for(element).value">
             <h2 mat-edit-title>Name</h2>
             <div mat-edit-content>
-              <mat-form-field appearance="fill">
+              <mat-form-field>
                 <input matInput [ngModel]="element.name" name="name" required>
               </mat-form-field>
             </div>

src/components-examples/material-experimental/popover-edit/popover-edit-tab-out-mat-table/popover-edit-tab-out-mat-table-example.html

@@ -12,7 +12,7 @@
           [matEditLensPreservedFormValue]="preservedWeightValues.get(element)"
           (matEditLensPreservedFormValueChange)="preservedWeightValues.set(element, $event)">
         <div mat-edit-content>
-          <mat-form-field appearance="fill">
+          <mat-form-field>
             <input matInput type="number" [ngModel]="element.weight" name="weight" required>
           </mat-form-field>
         </div>
@@ -44,7 +44,7 @@
               [matEditLensPreservedFormValue]="preservedNameValues.get(element)"
               (matEditLensPreservedFormValueChange)="preservedNameValues.set(element, $event)">
             <div mat-edit-content>
-              <mat-form-field appearance="fill">
+              <mat-form-field>
                 <input matInput [ngModel]="element.name" name="name" required>
               </mat-form-field>
             </div>

src/components-examples/material/autocomplete/autocomplete-auto-active-first-option/autocomplete-auto-active-first-option-example.html

@@ -1,5 +1,5 @@
 <form class="example-form">
-  <mat-form-field class="example-full-width" appearance="fill">
+  <mat-form-field class="example-full-width">
     <mat-label>Number</mat-label>
     <input type="text"
            placeholder="Pick one"

src/components-examples/material/autocomplete/autocomplete-display/autocomplete-display-example.html

@@ -1,5 +1,5 @@
 <form class="example-form">
-  <mat-form-field class="example-full-width" appearance="fill">
+  <mat-form-field class="example-full-width">
     <mat-label>Assignee</mat-label>
     <input type="text" matInput [formControl]="myControl" [matAutocomplete]="auto">
     <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn">