Setting has-global-padding class on the post content block on the edi…

…tor to match the frontend (#44209)

packages/edit-post/src/components/visual-editor/index.js

@@ -118,15 +118,21 @@ export default function VisualEditor( { styles } ) {
 		( select ) => select( editPostStore ).hasMetaBoxes(),
 		[]
 	);
-	const { themeHasDisabledLayoutStyles, themeSupportsLayout, assets } =
-		useSelect( ( select ) => {
-			const _settings = select( blockEditorStore ).getSettings();
-			return {
-				themeHasDisabledLayoutStyles: _settings.disableLayoutStyles,
-				themeSupportsLayout: _settings.supportsLayout,
-				assets: _settings.__unstableResolvedAssets,
-			};
-		}, [] );
+	const {
+		themeHasDisabledLayoutStyles,
+		themeSupportsLayout,
+		assets,
+		useRootPaddingAwareAlignments,
+	} = useSelect( ( select ) => {
+		const _settings = select( blockEditorStore ).getSettings();
+		return {
+			themeHasDisabledLayoutStyles: _settings.disableLayoutStyles,
+			themeSupportsLayout: _settings.supportsLayout,
+			assets: _settings.__unstableResolvedAssets,
+			useRootPaddingAwareAlignments:
+				_settings.__experimentalFeatures?.useRootPaddingAwareAlignments,
+		};
+	}, [] );
 	const { clearSelectedBlock } = useDispatch( blockEditorStore );
 	const { setIsEditingTemplate } = useDispatch( editPostStore );
 	const desktopCanvasStyles = {
@@ -189,9 +195,11 @@ export default function VisualEditor( { styles } ) {
 		return { type: 'default' };
 	}, [ isTemplateMode, themeSupportsLayout, defaultLayout ] );
 
-	const blockListLayoutClass = themeSupportsLayout
-		? 'is-layout-constrained'
-		: 'is-layout-flow';
+	const blockListLayoutClass = classnames( {
+		'is-layout-constrained': themeSupportsLayout,
+		'is-layout-flow': ! themeSupportsLayout,
+		'has-global-padding': useRootPaddingAwareAlignments,
+	} );
 
 	const titleRef = useRef();
 	useEffect( () => {