diff --git a/packages/block-editor/src/components/alignment-control/test/__snapshots__/index.js.snap b/packages/block-editor/src/components/alignment-control/test/__snapshots__/index.js.snap index f2915ead7417b..020275f41cd75 100644 --- a/packages/block-editor/src/components/alignment-control/test/__snapshots__/index.js.snap +++ b/packages/block-editor/src/components/alignment-control/test/__snapshots__/index.js.snap @@ -164,6 +164,29 @@ exports[`AlignmentUI should match snapshot when controls are visible 1`] = ` +
+ +
`; diff --git a/packages/block-editor/src/components/alignment-control/ui.js b/packages/block-editor/src/components/alignment-control/ui.js index b41cb4b0d2520..0241fec949bc0 100644 --- a/packages/block-editor/src/components/alignment-control/ui.js +++ b/packages/block-editor/src/components/alignment-control/ui.js @@ -3,7 +3,7 @@ */ import { __, isRTL } from '@wordpress/i18n'; import { ToolbarDropdownMenu, ToolbarGroup } from '@wordpress/components'; -import { alignLeft, alignRight, alignCenter } from '@wordpress/icons'; +import { alignLeft, alignRight, alignCenter, alignJustify } from '@wordpress/icons'; const DEFAULT_ALIGNMENT_CONTROLS = [ { @@ -21,6 +21,11 @@ const DEFAULT_ALIGNMENT_CONTROLS = [ title: __( 'Align text right' ), align: 'right', }, + { + icon: alignJustify, + title: __( 'Justify text' ), + align: 'justify', + }, ]; const POPOVER_PROPS = { diff --git a/packages/block-library/src/common.scss b/packages/block-library/src/common.scss index 2e1c2b8b706bc..5ad0d5fc77b2c 100644 --- a/packages/block-library/src/common.scss +++ b/packages/block-library/src/common.scss @@ -46,6 +46,11 @@ text-align: right; } +.has-text-align-justify { + /*rtl:ignore*/ + text-align: justify; +} + // This tag marks the end of the styles that apply to editing canvas contents and need to be manipulated when we resize the editor. #end-resizable-editor-section { display: none;