Fix the size and scrolling of the inserter sidebar in the form editor

[[MAILPOET-6054]
This commit is contained in:
Rostislav Wolny
2024-06-06 13:01:44 +02:00
committed by Aschepikov
parent 99d726e378
commit d1a4d80459
2 changed files with 9 additions and 4 deletions

View File

@ -136,7 +136,7 @@ h2 {
// Hide block selector header with close button on desktops // Hide block selector header with close button on desktops
@include respond-to(not-small-screen) { @include respond-to(not-small-screen) {
.edit-post-editor__inserter-panel-header { .editor-inserter-sidebar__header {
display: none; display: none;
} }
} }
@ -145,3 +145,8 @@ h2 {
.block-editor-inserter__tablist-and-close-button { .block-editor-inserter__tablist-and-close-button {
display: none !important; display: none !important;
} }
// Scrollable inserter sidebar panel
.block-editor-inserter__tabs .block-editor-inserter__block-list {
overflow-y: auto;
}

View File

@ -14,11 +14,11 @@ export function Inserter({ setIsInserterOpened }: Props): JSX.Element {
[], [],
); );
return ( return (
<div className="edit-post-editor__inserter-panel"> <div className="editor-inserter-sidebar">
<div className="edit-post-editor__inserter-panel-header"> <div className="editor-inserter-sidebar__header">
<Button icon={close} onClick={(): void => setIsInserterOpened(false)} /> <Button icon={close} onClick={(): void => setIsInserterOpened(false)} />
</div> </div>
<div className="edit-post-editor__inserter-panel-content"> <div className="editor-inserter-sidebar__content">
<Library <Library
showMostUsedBlocks showMostUsedBlocks
showInserterHelpPanel={false} showInserterHelpPanel={false}