fix(material/legacy-form-field): remove invalid selector (#25554)

We used to use `:placeholder-shown` to toggle some styles in the form field. In #8223 those selectors were changed to `:label-shown` which isn't a valid CSS selector. These changes remove the selector since it can cause errors in some tools. Fixes #24181.
angular · Sep 1, 2022 · 86c4a9d · 86c4a9d
1 parent cb78009
commit 86c4a9d
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 9 deletions.
diff --git a/src/material/legacy-form-field/_form-field-fill-theme.scss b/src/material/legacy-form-field/_form-field-fill-theme.scss
@@ -97,8 +97,7 @@ $fill-dedupe: 0;
 
       // Server-side rendered matInput with a label attribute but label not shown
       // (used as a pure CSS stand-in for mat-form-field-should-float).
-      .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper
-      .mat-form-field-label {
+      .mat-input-server[label] + .mat-form-field-label-wrapper .mat-form-field-label {
         @include _label-floating(
                 $subscript-font-scale, $infix-padding-top + $fill-appearance-label-offset,
                 $infix-margin-top);

diff --git a/src/material/legacy-form-field/_form-field-legacy-theme.scss b/src/material/legacy-form-field/_form-field-legacy-theme.scss
@@ -119,8 +119,7 @@ $legacy-dedupe: 0;
 
       // Server-side rendered matInput with a label attribute but label not shown
       // (used as a pure CSS stand-in for mat-form-field-should-float).
-      .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper
-      .mat-form-field-label {
+      .mat-input-server[label] + .mat-form-field-label-wrapper .mat-form-field-label {
         @include _label-floating(
                 $subscript-font-scale, $infix-padding, $infix-margin-top);
       }
@@ -165,7 +164,7 @@ $legacy-dedupe: 0;
 
         // Server-side rendered matInput with a label attribute but label not shown
         // (used as a pure CSS stand-in for mat-form-field-should-float).
-        .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper
+        .mat-input-server[label] + .mat-form-field-label-wrapper
         .mat-form-field-label {
           @include _label-floating-print(
                   $subscript-font-scale, $infix-padding, $infix-margin-top);

diff --git a/src/material/legacy-form-field/_form-field-outline-theme.scss b/src/material/legacy-form-field/_form-field-outline-theme.scss
@@ -127,8 +127,7 @@ $outline-dedupe: 0;
 
       // Server-side rendered matInput with a label attribute but label not shown
       // (used as a pure CSS stand-in for mat-form-field-should-float).
-      .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper
-      .mat-form-field-label {
+      .mat-input-server[label] + .mat-form-field-label-wrapper .mat-form-field-label {
         @include _label-floating(
                 $subscript-font-scale, $infix-padding + $outline-appearance-label-offset,
                 $infix-margin-top);

diff --git a/src/material/legacy-form-field/_form-field-theme.scss b/src/material/legacy-form-field/_form-field-theme.scss
@@ -206,8 +206,7 @@ $dedupe: 0;
 
     // Server-side rendered matInput with a label attribute but label not shown
     // (used as a pure CSS stand-in for mat-form-field-should-float).
-    .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper
-        .mat-form-field-label {
+    .mat-input-server[label] + .mat-form-field-label-wrapper .mat-form-field-label {
       @include _label-floating(
               $subscript-font-scale, $infix-padding, $infix-margin-top);
     }