String interpolation to calculate width of inputs. Fix #322

[thisisabhinay]

Description

This PR resolves the issue #322 in which form inputs are bleeding out of parent container. This problem is solved by subtracting the width of both left and right borders from the total width of input element.

The solution:

• Uses css calc() to calculate the width of form input classes (nes-input, nes-textarea, nes-select)
• Uses SCSS string interpolation to place variable $border-size's value inside calc()

Compatibility

This PR is not breaking any compatibility.

close #322

[thisisabhinay]

Can you please explain how to pass this test? @guastallaigor

[BcRikko]

This error is commitlint error. Could you change your commit message to something like fix: string interpolation to calculate width of inputs 🙇

The git commands shoud be something like this:

# edit your commit message
$ git commit --amend -m "fix: string interpolation to calculate width of inputs"

# force push branch
$ git push --force-with-lease origin issues/nes-bleeding-form-inputs

[BcRikko]

Sorry, I couldn't tell you exactly. 😢 Commit messages must be all lowercase.

- Fix: String interpolation to calculate width of inputs
+ fix: String interpolation to calculate width of inputs

[thisisabhinay]

@BcRikko Fixed lint issues with commit message.

[BcRikko]

:tada: This PR is included in version 2.3.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: