Skip to content
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

Always visible appender is inconsistently visible, causing visual offsets #16221

Closed
jasmussen opened this issue Jun 19, 2019 · 4 comments · Fixed by #16453
Closed

Always visible appender is inconsistently visible, causing visual offsets #16221

jasmussen opened this issue Jun 19, 2019 · 4 comments · Fixed by #16453
Labels
Needs Design Feedback Needs general design feedback.

Comments

@jasmussen
Copy link
Contributor

jasmussen commented Jun 19, 2019

#15864 changed the behavior of when the side inserter is showing. But it is showing inconsistently, and in many nesting situations the presence makes things offset. Here's a simple example:

appender

That's a list (i.e. not paragraph) transformed into a group. Suddenly there's a blank space in the editor that won't be there on the frontend.

This is also the case in other blocks that support nesting, such as Cover, Columns, Media & Text: if the last block isn't a paragraph, there's an empty space.

Here's a columns block with three images:

Screenshot 2019-06-19 at 10 01 58

@jasmussen jasmussen added the Needs Design Feedback Needs general design feedback. label Jun 19, 2019
@ZebulanStanphill
Copy link
Member

Related: #13571.

@richtabor
Copy link
Member

I second this here. The inserter within the Group block should perform as the inserter within the singular Column block does. One change would be that the inserter returns when you're selected on a block.

Otherwise, the Group block within the editor does not properly resemble the front-end when you're not interacting with it.

@jasmussen
Copy link
Contributor Author

The reason for adding this trailing inserter to nesting containers makes sense in principle, but I wonder if we can tweak the behavior so it's invisible until the block itself is selected?

Something along the lines of this:

.block-editor-block-list__block .block-editor-default-block-appender + .block-editor-default-block-appender {
	display: none;

	.is-selected & {
		display: block;
	}
}

The idea being that this leans into the principle of the unselected block is a preview, whereas the selected block can have additional UI.

jasmussen pushed a commit that referenced this issue Jul 8, 2019
Fixes #16221.

This PR intends to fix a visual regression that happened as a result of some consistency work done to the trailing appender.

The trailing appender is the one that sits at the end of the document to allow you to easily add new content. It usually sits after any block that isn't a paragraph. The consistency work brought this to nesting containers as well. But the side effect is that if you have a single list block inside a group block, the appender is permanently visible all the time, even if probably it shouldn't be. The net result is that the unselected editing canvas is no longer representative of the end result.

This PR changes that, so the trailing appender is only visible when a parent or adjacent block is selected. It's not the be-all end-all solution, as it might make sense to look into more holistic changes to when the appender is visible. But it does fix the immediate visual regression.
@jasmussen
Copy link
Contributor Author

Created a PR with a fix in #16453.

draganescu pushed a commit that referenced this issue Jul 23, 2019
Fixes #16221.

This PR intends to fix a visual regression that happened as a result of some consistency work done to the trailing appender.

The trailing appender is the one that sits at the end of the document to allow you to easily add new content. It usually sits after any block that isn't a paragraph. The consistency work brought this to nesting containers as well. But the side effect is that if you have a single list block inside a group block, the appender is permanently visible all the time, even if probably it shouldn't be. The net result is that the unselected editing canvas is no longer representative of the end result.

This PR changes that, so the trailing appender is only visible when a parent or adjacent block is selected. It's not the be-all end-all solution, as it might make sense to look into more holistic changes to when the appender is visible. But it does fix the immediate visual regression.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Needs Design Feedback Needs general design feedback.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants