Try: Polish post takeover modal. (#37821)

WordPress · Jan 10, 2022 · 8cc38b9 · 8cc38b9
1 parent 8f10d9a
commit 8cc38b9
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 32 deletions.
diff --git a/packages/editor/src/components/post-locked-modal/index.js b/packages/editor/src/components/post-locked-modal/index.js
@@ -158,13 +158,13 @@ export default function PostLockedModal() {
 	const allPostsUrl = getWPAdminURL( 'edit.php', {
 		post_type: get( postType, [ 'slug' ] ),
 	} );
-	const allPostsLabel = __( 'Exit the Editor' );
+	const allPostsLabel = __( 'Exit editor' );
 	return (
 		<Modal
 			title={
 				isTakeover
-					? __( 'Someone else has taken over this post.' )
-					: __( 'This post is already being edited.' )
+					? __( 'Someone else has taken over this post' )
+					: __( 'This post is already being edited' )
 			}
 			focusOnMount={ true }
 			shouldCloseOnClickOutside={ false }
@@ -181,7 +181,7 @@ export default function PostLockedModal() {
 			) }
 			{ !! isTakeover && (
 				<div>
-					<div>
+					<p>
 						{ userDisplayName
 							? sprintf(
 									/* translators: %s: user's display name */
@@ -193,7 +193,7 @@ export default function PostLockedModal() {
 							: __(
 									'Another user now has editing control of this post. Don’t worry, your changes up to this moment have been saved.'
 							  ) }
-					</div>
+					</p>
 
 					<div className="editor-post-locked-modal__buttons">
 						<Button variant="primary" href={ allPostsUrl }>
@@ -204,7 +204,7 @@ export default function PostLockedModal() {
 			) }
 			{ ! isTakeover && (
 				<div>
-					<div>
+					<p>
 						{ userDisplayName
 							? sprintf(
 									/* translators: %s: user's display name */
@@ -216,15 +216,15 @@ export default function PostLockedModal() {
 							: __(
 									'Another user is currently working on this post, which means you cannot make changes, unless you take over.'
 							  ) }
-					</div>
+					</p>
 
 					<div className="editor-post-locked-modal__buttons">
-						<Button variant="secondary" href={ allPostsUrl }>
-							{ allPostsLabel }
-						</Button>
 						<PostPreviewButton />
-						<Button variant="primary" href={ unlockUrl }>
-							{ __( 'Take Over' ) }
+						<Button variant="tertiary" href={ unlockUrl }>
+							{ __( 'Take over' ) }
+						</Button>
+						<Button variant="primary" href={ allPostsUrl }>
+							{ allPostsLabel }
 						</Button>
 					</div>
 				</div>

diff --git a/packages/editor/src/components/post-locked-modal/style.scss b/packages/editor/src/components/post-locked-modal/style.scss
@@ -1,29 +1,16 @@
 .editor-post-locked-modal {
-	height: auto;
-	padding-right: 10px;
-	padding-left: 10px;
-	padding-top: 10px;
-	max-width: 480px;
-
-	.components-modal__header {
-		height: 36px;
-	}
-
-	.components-modal__content {
-		height: auto;
-	}
+	max-width: 400px;
 }
 
 .editor-post-locked-modal__buttons {
-	margin-top: 10px;
-
-	.components-button {
-		margin-right: 5px;
-	}
+	margin-top: $grid-unit-30;
+	display: flex;
+	justify-content: flex-end;
+	gap: $grid-unit-10;
 }
 
 .editor-post-locked-modal__avatar {
 	float: left;
-	margin: 5px;
-	margin-right: 15px;
+	margin: $grid-unit-10;
+	margin-right: $grid-unit-15;
 }