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

Adjust transition and delay for the between-blocks inserter. #3074

Merged
merged 2 commits into from
Oct 20, 2017

Conversation

mtias
Copy link
Member

@mtias mtias commented Oct 19, 2017

This aims to make the between-blocks inserter appear when needed, but out of the way when not. It reduces the visual weight a bit by removing the line. When opening the inserter and hovering a block, the usual blue line still appears.

This seeks to make this feature visible when needed, but out
of the way when not.
@mtias mtias added [Feature] Blocks Overall functionality of blocks [Feature] Inserter The main way to insert blocks using the + button in the editing interface labels Oct 19, 2017
Copy link
Contributor

@youknowriad youknowriad left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I like this, especially the line removal

@jasmussen
Copy link
Contributor

Love it.

Can you move the plus down a couple of pixels, or the blue insertion indicator up, so they align?

screen shot 2017-10-20 at 11 18 05

Otherwise 👍 👍

@mtias
Copy link
Member Author

mtias commented Oct 20, 2017

Tweaked the position a bit, which also fixed the focus halo:

image

@jasmussen
Copy link
Contributor

Toot toot :shipit:

@mtias mtias merged commit ba463b2 into master Oct 20, 2017
@mtias mtias deleted the update/between-inserter-transition branch October 20, 2017 10:46
@aduth
Copy link
Member

aduth commented Oct 27, 2017

Seems like the delay should be skipped when the button is activated by focus. Feels awkward when tabbing between blocks.

@@ -463,7 +464,7 @@
content: '';
position: absolute;
width: 100%;
height: 10px;
height: 44px;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What was the reason for this change? Was it that it was too difficult to trigger the hover effect? The issue with this is that it aggravates the difficulty in selecting blocks which are short (like single-line paragraphs). The 44px was intended for hover effect only, intentionally overlapping some of the content of the block so that it would be slightly less easy to unhover the between-inserter (related). The natural height would be closer to 28px. At the very least, if we keep this, we need to remove the now-redundant hover style override:

&:hover:before {
height: 44px;
}

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can't speak to the intent of this particular code, but wanted to point in the direction of #4312, in case it's relevant.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See #4384

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Blocks Overall functionality of blocks [Feature] Inserter The main way to insert blocks using the + button in the editing interface
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants