jxom / bumbag-ui

Build themeable React & React Native applications with your Bumbag 👝
https://bumbag.style
MIT License
1.01k stars 50 forks source link

Label area in Textarea covers the input #135

Open Dhayvison opened 3 years ago

Dhayvison commented 3 years ago

Describe the bug

The label size in the Textarea component increases along with the field and covers part of the input area.

To Reproduce

  1. Go to https://bumbag.style/form/textarea/#label
  2. Paste a long paragraph like this.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce a nunc tellus. Pellentesque pretium felis sit amet tortor aliquam, id eleifend urna faucibus. Quisque dapibus sit amet purus eu feugiat. Aliquam accumsan dolor id est congue, faucibus dictum quam fringilla. Curabitur mi metus, auctor ut magna eu, tincidunt vulputate nunc. Quisque sit amet elit sed diam mattis molestie quis in orci. Vivamus scelerisque eros eu nunc faucibus fermentum. Etiam id lectus eros. Nulla cursus lorem non enim scelerisque molestie. Mauris suscipit nunc ut porta tempor. In vitae tristique orci. Sed consectetur elit odio, sed feugiat libero aliquet id. Mauris sed orci ac tellus suscipit tempor nec eget justo.

  3. Adjust the field height
  4. Try clicking at the beginning of the text

Expected behavior

The field will be focusable without the cursor being positioned where it was clicked

Screenshots

image

Device information (please complete the following information):

jxom commented 3 years ago

😱