fix: Missing spacing between input and form helper text solves #1164

[ashutosh7i]

Hello @jelly & @KKoukiou , i have worked on this issue,

Image with issue-

After my Solution to the issue-

The fix i implemented is that i replaced

<FormHelper ... /> component

with the official component-

<HelperText>
                    <HelperTextItem variant="error">{ ... } </HelperTextItem>
</HelperText>

And tweaked css in Machines.scss

this workaround fixed the issue of missing spacing between input and helper text solving #1164

[garrett]

This is an improvement, but why are the spaces different?

"Name should not be empty" has 13 pixels of space between the form and the string.

While the rest have 8 px.

PatternFly has 10px.

It seems your fonts are larger though (not the default), so the references above don't matter when comparing to PatternFly (which also doesn't use px to set these values, of course), so I don't know which is correct here, but I do know that they're inconsistent.

So I've checked locally on my machine and it seems the first one here is 10px and the rest are 6px. The first is correct; the rest still are not correct.

[garrett]

For reference:

Here's a screenshot of JSX React on PatternFly's demo page @ https://www.patternfly.org/components/helper-text/react-demos

[ashutosh7i]

sure @garrett i am onto it.