List View: Reduce spacing for each nesting level, and between block i…

…con and block title
WordPress · Apr 5, 2023 · faad063 · faad063
1 parent 88e3d88
commit faad063
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/packages/block-editor/src/components/list-view/style.scss b/packages/block-editor/src/components/list-view/style.scss
@@ -186,7 +186,7 @@
 	}
 
 	.block-editor-block-icon {
-		margin-right: $grid-unit-10;
+		margin-right: $grid-unit-05;
 		flex: 0 0 $icon-size;
 	}
 
@@ -355,7 +355,7 @@
 // Indent is a full icon size, plus 4px which optically aligns child icons to the text label above.
 $block-navigation-max-indent: 8;
 .block-editor-list-view-leaf[aria-level] .block-editor-list-view__expander {
-	margin-left: ( $icon-size ) * $block-navigation-max-indent + 4 * ( $block-navigation-max-indent - 1 );
+	margin-left: ( math.div($icon-size, 2) ) * $block-navigation-max-indent + 4 * ( $block-navigation-max-indent - 1 );
 }
 
 .block-editor-list-view-leaf:not([aria-level="1"]) {
@@ -367,10 +367,10 @@ $block-navigation-max-indent: 8;
 @for $i from 0 to $block-navigation-max-indent {
 	.block-editor-list-view-leaf[aria-level="#{ $i + 1 }"] .block-editor-list-view__expander {
 		@if $i - 1 >= 0 {
-			margin-left: ( $icon-size * $i ) + 4 * ($i - 1);
+			margin-left: ( math.div($icon-size, 2) * $i ) + 4 * ($i - 1);
 		}
 		@else {
-			margin-left: ( $icon-size * $i );
+			margin-left: ( math.div($icon-size, 2) * $i );
 		}
 	}
 }