Skip to content

Disable resizing the textarea in CollectionCreate modal #2974

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jun 5, 2024

Conversation

Ri-Sharma
Copy link
Contributor

@Ri-Sharma Ri-Sharma commented Jan 28, 2024

Fixes #2973

Following changes are made in this pr :-

  1. Removed max-width which was causing the overflowing of the 'Create collection' button.
  2. Reduced bottom-padding of create collection dialog box for enhancement.
  3. Changed the concerned textarea's resize to none.
  4. Changed rows of the textarea from '4' to '6' to compensate for setting resize to none.
  5. Fixed horizontal scroll issue by unsetting the min-width property when the screen width is 650px or less.

I have verified that this pull request:

  • has no linting errors (npm run lint)
  • has no test errors (npm run test)
  • is from a uniquely-named feature branch and is up to date with the develop branch.
  • is descriptively named and links to an issue number.

@@ -75,6 +75,7 @@

.form__input-flexible-height {
height: auto;
resize: none;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀

@@ -24,10 +24,9 @@
display: flex;
flex-wrap: wrap;
flex-flow: column;
max-height: 80%;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is the style for ALL modal, not just "create collection", so we need to tread carefully here. There are some larger modals like "keyboard shortcuts" where the max-height is required. It makes it so that the modal itself is limited in height and forces the content section of the modal to have a scrollbar if the contents won't fit.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I apologize for the oversight, I failed to consider the potential utilization of this class for other modals.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@lindapaiste, we can solve this issue using the :has() pseudo-class. I have made the commit you can check it.

@lindapaiste lindapaiste added the Area:CSS For styling or layout issues handled with CSS/SASS label Jan 28, 2024
@lindapaiste lindapaiste changed the title Fix : [#2973] Edited CSS to resolve the issue. Disable resizing the textarea in CollectionCreate modal Jan 28, 2024
Copy link
Collaborator

@raclim raclim left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for your work on this, I think this looks good to me! I'm not sure how many folks currently utilize resizing the textbox, but we can see if anyone misses it down the line!

@raclim raclim merged commit 82834fd into processing:develop Jun 5, 2024
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Area:CSS For styling or layout issues handled with CSS/SASS
Projects
None yet
Development

Successfully merging this pull request may close these issues.

"Create Collection" button & text area overflowing outside the dialog box.
3 participants