Patterns: correctly color code unsynced patterns titles in site editor (

#52958) Co-authored-by: Andrew Serong <[email protected]>
WordPress · Jul 26, 2023 · 1ca7922 · 1ca7922
1 parent 168bce1
commit 1ca7922
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/packages/edit-site/src/components/header-edit-mode/document-actions/index.js b/packages/edit-site/src/components/header-edit-mode/document-actions/index.js
@@ -128,7 +128,10 @@ function TemplateDocumentActions( { className, onBack } ) {
 
 	return (
 		<BaseDocumentActions
-			className={ className }
+			className={ classnames( className, {
+				'is-synced-entity':
+					record.wp_pattern_sync_status !== 'unsynced',
+			} ) }
 			icon={ typeIcon }
 			onBack={ onBack }
 		>

diff --git a/packages/edit-site/src/components/header-edit-mode/document-actions/style.scss b/packages/edit-site/src/components/header-edit-mode/document-actions/style.scss
@@ -24,6 +24,15 @@
 	@include break-large() {
 		width: min(100%, 450px);
 	}
+
+	&.is-synced-entity {
+		.edit-site-document-actions__title {
+			color: var(--wp-block-synced-color);
+			h1 {
+				color: var(--wp-block-synced-color);
+			}
+		}
+	}
 }
 
 .edit-site-document-actions__command {
@@ -36,7 +45,6 @@
 
 .edit-site-document-actions__title {
 	flex-grow: 1;
-	color: var(--wp-block-synced-color);
 	overflow: hidden;
 	grid-column: 2 / 3;
 
@@ -48,7 +56,6 @@
 		white-space: nowrap;
 		overflow: hidden;
 		text-overflow: ellipsis;
-		color: var(--wp-block-synced-color);
 	}
 
 	.edit-site-document-actions.is-page & {