ckeditor / ckeditor5

Powerful rich text editor framework with a modular architecture, modern integrations, and features like collaborative editing.
https://ckeditor.com/ckeditor-5
Other
9.36k stars 3.68k forks source link

[Document list] List items are not removed correctly with backspace #11347

Open FilipTokarski opened 2 years ago

FilipTokarski commented 2 years ago

Part of #11377.

📝 Provide detailed reproduction steps (if any)

  1. Switch to ck/10812-document-list-editing
  2. Create a few list items
  3. In an empty list item press backspace

✔️ Expected result

Item gets removed, cursor goes up to the previous list item.

❌ Actual result

Cursor does not go to the previous list item. All other list items get spaced out, which looks bad. Only after second backspace they get back to normal.

Screencast

https://user-images.githubusercontent.com/34380544/155957333-e7e6f6f8-15a3-40ad-ab3b-51ca38b44eaa.mp4


If you'd like to see this fixed sooner, add a 👍 reaction to this post.

Reinmar commented 2 years ago

Document-wise, that's an expected behavior. That's exactly what happens in Google Docs.

However, in GDoc when item 3 is merged into item 2, the item 2 is not moved "down". Additional spacing appears, but it affects item 3 only. We may want to improve styling for blocks inside lists a bit to mimic this.

Reinmar commented 2 years ago

That's how it works on Google Docs:

https://user-images.githubusercontent.com/156149/156347235-d3385a63-03f8-4046-a56d-25d3bc179ed9.mp4

Note, that I have paragraphs ("Normal text") style in Google Docs to have bigger space after them:

image

If you'd test it with the default styles that Google Docs come with (no spacing around paragraphs), it would look a bit differently:

https://user-images.githubusercontent.com/156149/156347822-bc8d6074-7375-4517-b38f-c5ad56c99f82.mp4

To sum up:

Reinmar commented 2 years ago

Goals:

oleq commented 2 years ago
.ck-content li > p {
    margin: 0;
}

for starters and let's see where do we go from here.

Witoso commented 1 year ago

Decision

Let's apply this style to the first (margin-top) / last paragraphs (margin-bottom).

To test

Nested ol/ul, and discovery the last paragraph before next list item.

Reinmar commented 1 month ago

Related ticket: #16866.

Reinmar commented 1 month ago

Related (not functionally, but due to combined confusion that these issues create together): #16884.