Fix #334: Fixed overlapping of price text and min-max handles

[slokhande310]

PR Checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

• Bugfix
• Feature
• Code style update (formatting, local variables)
• Refactoring (no functional changes, no api changes)
• Build related changes
• CI related changes
• Other... Please describe:

What is the current behavior?

1. Max price text collides with min price.
2. Thumbs of slider overlaps.

Issue Number: #334

What is the new behavior?

1. Fixed the texts of both min and max on left and right respectively to avoid collision.
2. Increased the range between min and max, so thumbs wont overlap with each other.

Does this PR introduce a breaking change?

• Yes
• No

Other information

[treoden]

Hi @slokhande310 ,

I see you turned off some rules in the linting config. Can I suggest to keep the original set of rules and try to fix the code? Let me know if you need a support

Thanks

[slokhande310]

This is the first time I ever came across this error, I googled it and I think if I add aria labels, it might fix the errors.

[slokhande310]

Hi @treoden, I fixed the errors and re-enabled the linting rules which I disabled earlier but there's one error that doesn't fix, I tried but I was not able to fix it.

evershop/packages/evershop/src/components/common/form/fields/Ckeditor.jsx

Line 364 in 8f3158a

<label htmlFor="upload-image" className="self-center">

Error: A form label must be associated with a control jsx-a11y/label-has-associated-control