Improve dropcap behavior #28685
Merged
Improve dropcap behavior #28685
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This was referenced Feb 3, 2021
|
Size Change: -108 B (0%) Total Size: 1.39 MB
ℹ️ View Unchanged
|
|
WordPress 5.7 beta 3 and Gutenberg plugin 10. Current: Proposed solution: Just looking at the above one can clearly see that this PR fixes a specific aspect. |
|
A complicated issue indeed. It makes sense to not explicitly set a min height to allow flow around the dropcap, and to have a way to force a clear (in the case of a color or a dropcap in the following paragraph block). Do you think the color 'hack' is obvious enough? Might be more discoverable to add a toggle to the sidebar to allow dropcap floating? Then it can be applied in any usecase. |
Good thought. I could swear we had a ticket somewhere about adding "clear floats" to the Advanced section of the inspector. That would do the same. |
|
Here you are Joen..:-) |
|
Nice :D an old one! |
|
Oh sorry, I thought the rules were from that later PR. Thank you Ella. |
jasmussen
force-pushed
the
try/fix-dropcap
branch
from
ede1948 to
03d17c0
Compare
|
The code that this PR reverts was originally meant to fix #18409 (thanks for pointing that out, Ella). As far as I can tell, that issue is addressed both in the master branch, and this PR. Master:
This branch:
But in addition to that issue no longer being the case, this PR enables two small paragraphs to wrap around the dropcap. Before:
After:
As such, I'm going to take this out of draft and ask for a review. I think it's a better and simpler solution. |
jasmussen
added
[Feature] Rich Text
ellatrix
reviewed
Mar 1, 2021
| @@ -14,18 +14,18 @@ import { | |||
| InspectorControls, | |||
| RichText, | |||
| useBlockProps, | |||
| getFontSize, | |||
| //getFontSize, | |||
There was a problem hiding this comment.
Yes they should 🤦 — Thank you.
jasmussen
force-pushed
the
try/fix-dropcap
branch
from
03d17c0 to
405e14d
Compare
ellatrix
reviewed
Mar 1, 2021
| @@ -28,6 +28,11 @@ | |||
| font-style: normal; | |||
| } | |||
|
|
|||
| // Prevent the dropcap from breaking out of the box when a background is applied. | |||
| p.has-drop-cap.has-background { | |||
There was a problem hiding this comment.
Shouldn't this happen regardless of background?
There was a problem hiding this comment.
We've been a bit back and forth on this one. If we do this, then it ends up looking like this:
But I would argue that the 2nd paragraph should be allowed to wrap around the dropcap, like this:
By limiting it to a paragraph that has a background, at least we allow this:
ellatrix
approved these changes
Mar 1, 2021
jasmussen
force-pushed
the
try/fix-dropcap
branch
from
f88b781 to
801f614
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR is effectively a revert of #18409, and for that reason it needs a good review.
Fixes #10832. Here's the problem: in 18409 a min-height was applied to any paragraph that had a dropcap. This effectively means that if you have a short line of text, the next paragraph in line will not wrap around the dropcap, causing a space in the flow:
This PR fixes that by effectively removing that min-height entirely:
In addition to that, it adds a clearing behavior to paragraphs that have a background color, so that this is possible:
That last bit is a bit contentious, as you might actually want to keep the float behavior, to accomplish this:
That part is being discussed in #10832 (comment).
See also #28685 (comment) for additional examples.