Skip to content

Fixing padding on the post editor when RootPaddingAwareAlignments setting is enabled #44209

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
matiasbenedetto merged 1 commit into from
Sep 19, 2022
Merged

Fixing padding on the post editor when RootPaddingAwareAlignments setting is enabled #44209

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Setting has-global-padding class on the post content block on the edi… 
…tor to match the frontend
  • Loading branch information
@matiasbenedetto
matiasbenedetto committed Sep 15, 2022
commit 0595cb6c7afcdf19789d5573a2e255057283e00f
32 changes: 20 additions & 12 deletions packages/edit-post/src/components/visual-editor/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 = {
Expand Down Expand Up @@ -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( () => {
Expand Down