fix(experimental): Fade fix line height issue (#5617)

Co-authored-by: a.inkin <[email protected]>
taiga-family · Oct 12, 2023 · a85ee21 · a85ee21
1 parent 473c3b5
commit a85ee21
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/projects/experimental/directives/fade/fade.directive.ts b/projects/experimental/directives/fade/fade.directive.ts
@@ -36,7 +36,9 @@ import {TuiFadeComponent} from './fade.component';
     ],
 })
 export class TuiFadeDirective {
+    // TODO: Remove when lh CSS units are supported: https://caniuse.com/mdn-css_types_length_lh
     @Input('tuiFadeHeight')
+    @HostBinding('style.line-height')
     @HostBinding('style.--line-height')
     lineHeight: string | null = null;
 

diff --git a/projects/experimental/directives/fade/fade.style.less b/projects/experimental/directives/fade/fade.style.less
@@ -8,7 +8,6 @@
     mask-repeat: no-repeat;
 
     &:not([data-orientation='vertical']) {
-        line-height: var(--line-height, inherit) !important;
         mask-image:
             linear-gradient(to right, transparent var(--fade-offset), #000 calc(var(--fade-size) + var(--fade-offset))),
             linear-gradient(to left, transparent var(--fade-offset), #000 calc(var(--fade-size) + var(--fade-offset))),