appsmith icon indicating copy to clipboard operation
appsmith copied to clipboard

Published 20 hours ago • verified publisher icon appsmithorg

[Feature]: Rich Text Editor Widget: Reduce space between two lines

Open sumitsum opened this issue 2 years ago • 13 comments

Is there an existing issue for this?

  • [X] I have searched the existing issues

Summary

Currently the space between two lines in the Rich Text Editor seems a little more than required and looks ugly. Pasting the difference between Rich Text Editor and Google Sheet: Screenshot 2022-10-19 at 1 53 14 PM

Screenshot 2022-10-19 at 1 51 52 PM

Why should this be worked on?

Improve Rich Text Editor asthetics.

sumitsum avatar Oct 19 '22 08:10 sumitsum

We can change the default line height to achieve this, adding a link. Thanks for the issue Sumit.

https://www.tiny.cloud/blog/tinymce-margins-line-height-spacing/

dilippitchika avatar Oct 19 '22 10:10 dilippitchika

Can I work on this issue ?

gospeller986 avatar Oct 19 '22 13:10 gospeller986

Hello, please assign this issue to me

RishikaKant avatar Oct 19 '22 14:10 RishikaKant

@dilippitchika Can I work on this

sanjus-robotic-studio avatar Oct 19 '22 14:10 sanjus-robotic-studio

Greetings @gospeller986 @RishikaKant @sanjus-robotic-studio thanks for showing interest 🎉. Assigning to all of you for now. If anyone of you could raise a PR soon, it would be great. Please set the line height to 1.15

Please don't forget to read the Contribution Guidelines. Would appreciate if you can open a PR within the next 2 days. let us know here

dilippitchika avatar Oct 19 '22 16:10 dilippitchika

@dilippitchika i have raised an PR , please review it

gospeller986 avatar Oct 19 '22 20:10 gospeller986

@dilippitchika Is there any error in the change made by me ? Where am i going wrong ?

gospeller986 avatar Oct 20 '22 15:10 gospeller986

Hey @dilippitchika Can someone point us in the right direction. I too tried but the default height is not changing. But when we press shift and click on enter the line height is smaller. And also I have found a way to add the line height parameter in the tool bar and it works. Will it solve this issue ?

Screenshot 2022-10-20 at 10 09 55 PM Screenshot 2022-10-20 at 10 10 29 PM

sanjus-robotic-studio avatar Oct 20 '22 16:10 sanjus-robotic-studio

Sorry @gospeller986 i can't see your pr linked yet. Can you please ping it here?

@sanjus-robotic-studio yes exposing the line height control is good enough.

However to decrease it further we have to update the margins used by <p> tags. I would advise against this as this impacts users who press shift enter. I have attached some links below for further reading -

https://stackoverflow.com/questions/8463621/decrease-the-line-spacing-in-tinymce-textarea https://stackoverflow.com/questions/57957512/how-to-disable-tinymces-shiftenter-behavior

dilippitchika avatar Oct 20 '22 17:10 dilippitchika

So can I create a custom css

sanjus-robotic-studio avatar Oct 20 '22 17:10 sanjus-robotic-studio

Please don't create custom css, we as a team want to avoid adding custom css classes.

dilippitchika avatar Oct 20 '22 17:10 dilippitchika

Ok, So Can I disable the shift+enter functionality

sanjus-robotic-studio avatar Oct 20 '22 17:10 sanjus-robotic-studio

Or Can You give us the suggestions which can be implemented

sanjus-robotic-studio avatar Oct 20 '22 17:10 sanjus-robotic-studio

@dilippitchika What can we do for this issue?

sanjus-robotic-studio avatar Oct 21 '22 16:10 sanjus-robotic-studio

Apologies for the delayed response @sanjus-robotic-studio , here are the next steps

  1. Allow users to change the line height for now, with the new line height property in the toolbar
  2. Don't make any other changes as of now

dilippitchika avatar Oct 25 '22 04:10 dilippitchika

Ok will do those qn and create a new PR now

sanjus-robotic-studio avatar Oct 25 '22 04:10 sanjus-robotic-studio