refactor(input-group, textarea): label position (#15953)

handle placeholder with css

Author: desig9stein

projects/igniteui-angular/src/lib/input-group/themes/shared/material.scss

@@ -488,11 +488,6 @@ $input-bottom-spacing: rem(6px);
             will-change: translate;
             align-self: start;
         }
-
-        //@include e(textarea) {
-        //    margin-block-start: $input-top-spacing;
-        //    bottom: rem(2px);
-        //}
     }
 
     @include mx(border, textarea-group, filled) {

src/app/input-group-showcase/input-group-showcase.sample.html

@@ -25,11 +25,11 @@ <h1 class="showcase__title">Angular</h1>
             }
 
             <input
-                    formControlName="field"
-                    [type]="getNativeInputType()"
-                    [attr.placeholder]="getPlaceholder()"
-                    [readOnly]="isReadonly()"
-                    igxInput
+                formControlName="field"
+                [type]="getNativeInputType()"
+                [attr.placeholder]="getPlaceholder()"
+                [readOnly]="isReadonly()"
+                igxInput
             />
 
             @if (hideSuffix()) {
@@ -56,10 +56,10 @@ <h1 class="showcase__title">Angular</h1>
                 <igx-icon igxPrefix>face</igx-icon>
             }
             <textarea
-                    formControlName="fieldTextarea"
-                    [attr.placeholder]="getPlaceholder()"
-                    [readOnly]="isReadonly()"
-                    igxInput>
+                formControlName="fieldTextarea"
+                [attr.placeholder]="getPlaceholder()"
+                [readOnly]="isReadonly()"
+                igxInput>
             </textarea>
 
             @if (hideSuffix()) {
@@ -144,12 +144,12 @@ <h1 class="showcase__title">Angular</h1>
             }
 
             <input
-                    id="file-in"
-                    formControlName="fieldFile"
-                    [required]="isRequired()"
-                    [type]="'file'"
-                    [readOnly]="isReadonly()"
-                    igxInput
+                id="file-in"
+                formControlName="fieldFile"
+                [required]="isRequired()"
+                [type]="'file'"
+                [readOnly]="isReadonly()"
+                igxInput
             />
 
             @if (hideSuffix()) {
@@ -242,12 +242,12 @@ <h1 class="showcase__title">Web components</h1>
         </igc-textarea>
 
         <igc-select
-                [required]="isRequired()"
-                [attr.placeholder]="getPlaceholder()"
-                [label]="getLabel()"
-                [disabled]="isDisabled()"
-                [outlined]="isOutlined()"
-                [style.--ig-size]="getSize()">
+            [required]="isRequired()"
+            [attr.placeholder]="getPlaceholder()"
+            [label]="getLabel()"
+            [disabled]="isDisabled()"
+            [outlined]="isOutlined()"
+            [style.--ig-size]="getSize()">
 
             @if (hidePrefix()) {
                 <igc-icon slot="prefix" name="face"></igc-icon>
@@ -276,13 +276,13 @@ <h1 class="showcase__title">Web components</h1>
 
 
         <igc-file-input
-                [style.--ig-size]="getSize()"
-                [label]="getLabel()"
-                [required]="isRequired()"
-                [disabled]="isDisabled()"
-                [readOnly]="isReadonly()"
-                [attr.value]="getValue()"
-                [outlined]="isOutlined()">
+            [style.--ig-size]="getSize()"
+            [label]="getLabel()"
+            [required]="isRequired()"
+            [disabled]="isDisabled()"
+            [readOnly]="isReadonly()"
+            [attr.value]="getValue()"
+            [outlined]="isOutlined()">
             @if (hidePrefix()) {
                 <igc-icon slot="prefix" name="face"></igc-icon>
             }