Wordpress-ios: Reader: too much space between sections

[designsimply]

There are a few areas in the Reader where we can check on block cadence and make it flow a lot more nicely.

Steps to reproduce:

1. Create a new post.
2. Add several different types of blocks with paragraphs in between.
3. Publish the post.
4. View the post in the Reader or Notifications.

Result: too much space between sections and some blocks simply aren't displaying correctly, here are some examples we could look into:

• [ ] Too much space after lists.
• [ ] Too much space between headings and paragraphs.
• [ ] Button doesn't display correctly.
• [ ] Cover block with linear gradient doesn't display correctly.
• [ ] Too much space between video and video caption.
• [ ] Not enough space between caption and the following content, such as a paragraph block.
• [ ] Not enough space between caption and separator.
• [ ] Too much space between separator and the next content, such as an image block.

^{Tested with WPiOS 14.6.0.0 TestFlight beta on iPhone 11 iOS 13.4.1.}

_{(internal reference: p4a5px-2wF-p2 h/t @elibud)}

[elibud]

cc: @yaelirub @bummytime as we'll want to tackle these fixes as part of the Reader improvements project. Thanks @designsimply .

[designsimply]

While testing the Custom HTML block today, I found that the following HTML is nice to use for testing spacing issues: https://raw.githubusercontent.com/cbracco/html5-test-page/master/index.html

More testing steps:

1. Go to https://raw.githubusercontent.com/cbracco/html5-test-page/master/index.html
2. Copy the content inside the body tags.
3. Create a new post in the app or on the web.
4. Add a paragraph block.
5. Add a Custom HTML block and paste the content copied in step 2.
6. Add another paragraph block.
7. Publish the post and view it in the Reader.

Result: scroll through the post and look for areas where the spacing looks off.

Here is one set of screenshots just showing some of the differences in the content displayed in Android Reader compared to iOS Reader:

WPAndroid 14.7-rc-3 | WPiOS 14.7.0.2 TestFlight beta
---|---
|

^{Tested with WPAndroid 14.7-rc-3 on Pixel 3 Android 10 and WPiOS 14.7.0.2 TestFlight beta on iPhone 11 iOS 13.4.1.}