style(input) fix sizing overrides when input is used inside a grid cell. (#12970)

Co-authored-by: Simeon Simeonoff <[email protected]>
Co-authored-by: Nikolay Alipiev <[email protected]>

Author: 3 people

projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss

@@ -1521,25 +1521,26 @@
         padding: 0 !important;
 
         // Have a more stable visual editing experience
-        igx-input-group,
+        > igx-input-group,
+        igx-combo,
         igx-select,
         igx-date-picker,
         igx-time-picker {
-            height: calc(100% - (#{$editing-outline-width} * 2));
-            width: calc(100% - (#{$editing-outline-width} * 2));
-            margin-inline-start: $editing-outline-width;
+            position: relative;
+            height: calc(100% - #{$editing-outline-width * 2});
+            width: calc(100% - #{$editing-outline-width * 2});
+            inset-inline-start: $editing-outline-width;
             overflow: hidden;
-
-            igx-input-group {
-                width: calc(100% - #{$editing-outline-width}) !important;
-                margin-inline-start: 0;
-                height: 100% !important;
-            }
         }
 
         igx-input-group {
+            height: 100%;
+
+            input {
+                height: 100%;
+            }
+
             --theme: fluent;
-            padding-top: 0 !important;
         }
 
         .igx-input-group__bundle {
@@ -1556,6 +1557,12 @@
             }
         }
 
+        .igx-input-group__bundle-main,
+        .igx-input-group__bundle-start,
+        .igx-input-group__bundle-end {
+            height: calc(100% - #{$editing-outline-width * 2});
+        }
+
         &.igx-grid__td--invalid {
             box-shadow: inset 0 0 0 rem(2px) color($color: 'error') !important;
             padding-inline-end: rem(4px) !important;
@@ -1576,10 +1583,6 @@
             display: none;
         }
 
-        %form-group-bundle {
-            height: 100%;
-        }
-
         input {
             margin: 0 auto;
             max-width: 100%;