From 76cadc88f569d064f3b4db7149adad20b75a196f Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Mon, 1 Jul 2019 09:46:11 -0400 Subject: [PATCH 1/2] Allow inner block template options to wrap on mobile. --- .../src/components/inner-blocks/style.scss | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/block-editor/src/components/inner-blocks/style.scss b/packages/block-editor/src/components/inner-blocks/style.scss index 0f8576fd5ecf34..aeaf4271410bd4 100644 --- a/packages/block-editor/src/components/inner-blocks/style.scss +++ b/packages/block-editor/src/components/inner-blocks/style.scss @@ -39,19 +39,27 @@ .block-editor-inner-blocks__template-picker-options.block-editor-inner-blocks__template-picker-options { display: flex; + justify-content: center; flex-direction: row; - flex-wrap: nowrap; + flex-wrap: wrap; width: 100%; - margin: $grid-size-large 0; + margin: $grid-size-small 0; list-style: none; > li { list-style: none; - flex-basis: 100%; + margin: $grid-size; flex-shrink: 1; - margin: 0 $grid-size; max-width: 100px; } + + .block-editor-inner-blocks__template-picker-option { + padding: $grid-size; + } + + @include break-medium() { + flex-wrap: nowrap; + } } .block-editor-inner-blocks__template-picker-option { From 8e418a59a6db65823b93ee650f1238857dafebc8 Mon Sep 17 00:00:00 2001 From: Kjell Reigstad Date: Mon, 1 Jul 2019 09:54:00 -0400 Subject: [PATCH 2/2] Remove nowrap rule. --- packages/block-editor/src/components/inner-blocks/style.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/packages/block-editor/src/components/inner-blocks/style.scss b/packages/block-editor/src/components/inner-blocks/style.scss index aeaf4271410bd4..e7bd479e04e02e 100644 --- a/packages/block-editor/src/components/inner-blocks/style.scss +++ b/packages/block-editor/src/components/inner-blocks/style.scss @@ -56,10 +56,6 @@ .block-editor-inner-blocks__template-picker-option { padding: $grid-size; } - - @include break-medium() { - flex-wrap: nowrap; - } } .block-editor-inner-blocks__template-picker-option {