Problem with parents inheriting vh value

[kaleidografik]

Hi @Faisal-Manzer - love the plugin and have been using it for a while, but have discovered an irritating bug.

In the below code, .form-field is oddly inheriting the min-height value from the nested child, which obviously it shouldn't do this. Is there a know bug or conflict with this?

Thanks

.form-field {
    width: 100%;

    // Textarea
    &.textarea {

      // Input
      textarea {
          min-height: 25vh;
      }
}

[Faisal-Manzer]

What is expected output and current output?

[kaleidografik]

Sorry for the slow reply, this issue has just cropped up again.

The expected output would be (and this does happen):

.form-field.textarea textarea {
    min-height: 25vh;
    min-height: calc(var(--vh, 1vh) * 25);
 }

But additionally, the parent(s) inherit the value too:

.form-field {
    min-height: calc(var(--vh, 1vh) * 25);
}

.form-field.textarea {
    min-height: calc(var(--vh, 1vh) * 25);
}

My SASS markup is as follows (I'm using Tailwindcss, hence the @apply statement):

.form-field {

    // Textarea
    &.textarea {

      // Input
      textarea {
        @apply min-h-1/4;
      }
    }
}

Hope this helps

[kaleidografik]

Was there ever a resolution to this @Faisal-Manzer ?