Merge pull request #7754 from IgniteUI/simeonoff/fix-7752-10.0.x

fix(input-group): textarea has incorrect line-height

Author: simeonoff

projects/igniteui-angular/src/lib/core/styles/components/input/_input-group-theme.scss

@@ -961,12 +961,22 @@
     }
 
     %form-group-textarea {
-        min-height: rem(82px, map-get($base-scale-size, 'comfortable')); /* 3 lines * 22px + 8px bottom padding + 8px top padding */
-        margin-#{$right}: -#{rem(16px, map-get($base-scale-size, 'comfortable'))}; /* this fixes resizing in chrome !?!? */
-        line-height: normal !important; /* resets typography styles */
+        // 3 lines * 22px + 8px bottom padding + 8px top padding
+        min-height: rem(82px, map-get($base-scale-size, 'comfortable'));
+
+        // this fixes resizing in chrome !?!?
+        margin-#{$right}: -#{rem(16px, map-get($base-scale-size, 'comfortable'))};
+
         height: auto;
         resize: vertical;
         overflow: hidden;
+
+        // resets typography styles
+        line-height: normal !important;
+
+        &:not([type='*']) {
+            line-height: normal !important; /* resets typography styles */
+        }
     }
 
     %form-group-textarea--cosy {

src/app/input/input.sample.html

@@ -19,6 +19,11 @@ <h4 class="form-title igx-typography__overline">Personal Info</h4>
                     <label igxLabel for="lastName">Last Name</label>
                 </igx-input-group>
 
+                <igx-input-group>
+                    <input igxInput name="dateOfBirth" type="date" [(ngModel)]="user.dateOfBirth" required />
+                    <label igxLabel for="dateOfBirth">Date of Birth</label>
+                </igx-input-group>
+
                 <igx-input-group>
                     <input igxInput name="password" type="password" placeholder="{{placeholder}}" [(ngModel)]="user.password" required/>
                     <label igxLabel for="password">Password</label>

src/app/input/input.sample.ts

@@ -15,7 +15,8 @@ export class InputSampleComponent {
         lastName: 'Doe',
         password: '1337s3cr3t',
         registered: false,
-        subscribed: false
+        subscribed: false,
+        dateOfBirth: new Date('07 July, 1987')
     };
 
     user2 = {
@@ -25,9 +26,11 @@ export class InputSampleComponent {
         lastName: 'Doe',
         password: '1337s3cr3t',
         registered: true,
-        subscribed: false
+        subscribed: false,
+        dateOfBirth: new Date('01 July, 1954')
     };
 
+
     settings = [{
         name: 'WiFi',
         icon: 'wifi',