search

processing / p5.js-web-editor

The p5.js Editor is a website for creating p5.js sketches, with a focus on making coding accessible and inclusive for artists, designers, educators, beginners, and anyone else! You can create, share, or remix p5.js sketches without needing to download or configure anything.
https://editor.p5js.org
GNU Lesser General Public License v2.1
1.32k stars 1.27k forks source link

"Create Collection" button & text area overflowing outside the dialog box. #2973

Closed Ri-Sharma closed 1 month ago

Ri-Sharma commented 5 months ago

Issue#1

Actual Behavior

The 'Create collection' button & the textarea is overflowing outside the dialog box when resizing the textarea.

https://github.com/processing/p5.js-web-editor/assets/80570105/d72a4cec-2f89-49ad-b020-460127fb889c

Expected Behavior

The max-height property is causing this issue. Also we should remove the resize from this text area, because resizing the textarea after modification in the max-height will cause it to go out of the screen.

Issue#2

The min-width in the Collection Create modal's input area is causing horizontal scrolling for mobile screen with smaller width. It requires adjustment to prevent this issue and improve user experience.

https://github.com/processing/p5.js-web-editor/assets/80570105/6c0f056e-5bf5-4b34-86bf-939c70ba42dd

vaishnavi192 commented 5 months ago

Hey @Ri-Sharma I would like to work on it plz assign me this issue

Ri-Sharma commented 5 months ago

Hey @Ri-Sharma I would like to work on it plz assign me this issue

Hey @vaishnavi192, I appreciate your interest but I am already working on this issue.

lindapaiste commented 5 months ago

Also we should remove the resize from this text area, because resizing the textarea after modification in the max-height will cause it to go out of the screen.

So weird. I had to sanity-check myself and look at MDN because I forgot that textarea is automatically resizable https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#controlling_whether_a_textarea_is_resizable

It would be possible to make the body of the modal scrollable, but I'm thinking that's probably that's a worse user experience than having a fixed (or maximum) height on the textarea and having a scrollbar just on that textarea.