fixed icon position

Author: GrabowskiM

packages/assets/src/scss/helper-text.scss …ckages/assets/src/scss/_helper-text.scsspackages/assets/src/scss/helper-text.scss renamed to packages/assets/src/scss/_helper-text.scss packages/assets/src/scss/helper-text.scss renamed to packages/assets/src/scss/_helper-text.scss

@@ -1,23 +1,24 @@
-@use 'sass:list';
+@use 'sass:map';
 @use 'functions' as *;
 @use 'variables' as *;
 
-$helper-text-types:
-    'default' $color-neutral-160,
-    'error' $color-error-80;
+$helper-text-types: (
+    'default': $color-neutral-160,
+    'error': $color-error-80,
+);
 
 .ids-helper-text {
     $self: &;
 
     font-size: $text-font-size-m;
-    color: #{list.nth($helper-text-types, 1)};
+    color: #{map.get($helper-text-types, 'default')};
     display: flex;
-    align-items: center;
 
     &__icon-wrapper {
-        padding-right: calculateRem(4px);
         display: flex;
         align-items: center;
+        height: $text-font-size-m * $base-line-height;
+        padding-right: calculateRem(4px);
     }
 
     @each $name, $color in $helper-text-types {

packages/assets/src/scss/_root.scss

@@ -1,12 +1,12 @@
 @use 'functions/calculate.rem' as *;
-@use 'variables';
+@use 'variables' as *;
 
 html {
     font-size: $base-font-size;
-    line-height: 1.5;
+    line-height: $base-line-height;
     letter-spacing: calculateRem(0.12px);
 }
 
 body {
-    font-family: variables.$font-family;
+    font-family: $font-family;
 }

packages/assets/src/scss/_variables.scss

@@ -8,6 +8,9 @@
 $transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
 $transition-duration: 0.4s !default;
 
+// Root variables
+$base-line-height: 1.5 !default;
+
 // Various component variables
 $border-radius-medium: calculateRem(8px) !default;