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.

Sign up for GitHub

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

Jump to bottom

Don't allow to start dragging blocks if a lock all exists #7225

Merged
merged 3 commits into from Jun 26, 2018
Merged

Don't allow to start dragging blocks if a lock all exists #7225

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
1a78cd2
Don't allow to start dragging blocks if a locking lock all exists
jorgefilipecosta Jun 8, 2018
627beea
Refact block hover and select css
jorgefilipecosta Jun 22, 2018
379ed22
docs: Clarify docs and fix whitespace
tofumatt Jun 26, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 3 additions & 1 deletion editor/components/block-list/block.js
View file
Open in desktop
Expand Up @@ -387,6 +387,7 @@ export class BlockListBlock extends Component {
hoverArea,
isLargeViewport,
isEmptyDefaultBlock,
isMovable,
isPreviousBlockADefaultEmptyBlock,
hasSelectedInnerBlock,
} = this.props;
Expand Down Expand Up @@ -470,7 +471,7 @@ export class BlockListBlock extends Component {
] }
{ ...wrapperProps }
>
{ ! isMultiSelected && (
{ ! isMultiSelected && isMovable && (
<BlockDraggable
rootUID={ rootUID }
index={ order }
Expand Down Expand Up @@ -620,6 +621,7 @@ const applyWithSelect = withSelect( ( select, { uid, rootUID } ) => {
initialPosition: getSelectedBlocksInitialCaretPosition(),
isEmptyDefaultBlock: block && isUnmodifiedDefaultBlock( block ),
isPreviousBlockADefaultEmptyBlock: previousBlock && isUnmodifiedDefaultBlock( previousBlock ),
isMovable: 'all' !== templateLock,
isLocked: !! templateLock,
previousBlockUid,
block,
Expand Down
27 changes: 27 additions & 0 deletions editor/components/block-list/style.scss
View file
Open in desktop
Expand Up @@ -934,3 +934,30 @@
content: '←';
}
}

.editor-block-list__block {
@include break-small {
// Increase the hover and selection area around blocks.
// This makes the blue hover line and the settings button appear even if
// the mouse cursor is technically outside the block.
// This improves usability by making it possible to click somewhat outside
// the block and select it. (eg. A fuzzy click target.)
&:before {
bottom: 0;
content: '';
left: -$parent-block-padding - $block-padding;
Copy link
Contributor

Choose a reason for hiding this comment

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

I really appreciate you making this change, and the intent behind it.

It introduced a small regression, though, as it makes a horizontal scrollbar appear when a block is full-wide.

I discovered this while rebasing #7365. I will implement a fix in that branch, perhaps you can help me review it so we can get it in faster? Thanks.

position: absolute;
right: -$parent-block-padding - $block-padding;
top: 0;
}

// Remove the fuzzy click area effect set above on nested blocks.
// It should only applies to top-level blocks; applying this rule to
// nested blocks will result in difficult-to-use and possibly overlapping
// click targets.
& &:before {
left: 0;
right: 0;
}
}
}