Tweaking widths. Ensure expansion on mobile

WordPress · Nov 26, 2024 · 87b24ab · 87b24ab
1 parent 74a4423
commit 87b24ab
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/packages/block-library/src/query/edit/query-toolbar.js b/packages/block-library/src/query/edit/query-toolbar.js
@@ -26,6 +26,7 @@ export default function QueryToolbar( { clientId, attributes } ) {
 				<Dropdown
 					contentClassName="block-editor-block-settings-menu__popover"
 					focusOnMount="firstElement"
+					expandOnMobile
 					renderToggle={ ( { isOpen, onToggle } ) => (
 						<ToolbarButton
 							aria-haspopup="true"
@@ -40,6 +41,7 @@ export default function QueryToolbar( { clientId, attributes } ) {
 							clientId={ clientId }
 							attributes={ attributes }
 							showSearch={ false }
+							showTitlesAsTooltip
 						/>
 					) }
 				/>

diff --git a/packages/block-library/src/query/editor.scss b/packages/block-library/src/query/editor.scss
@@ -63,4 +63,17 @@
 
 .block-editor-block-settings-menu__popover {
 	min-width: 500px;
+	.block-editor-block-patterns-list {
+		display: grid;
+		grid-template-columns: 1fr 1fr;
+		grid-gap: $grid-unit-15;
+		overflow: hidden;
+	}
+	.block-editor-block-patterns-list__list-item {
+		margin-bottom: 0;
+		min-width: 200px;
+		.block-editor-block-preview__container {
+			max-height: 250px;
+		}
+	}
 }