Save continue dim UI

src/OnboardingSPA/components/NewfoldInterfaceSkeleton/style.scss

@@ -45,6 +45,7 @@ html.nfd-interface-interface-skeleton__html-container {
 	flex-direction: column;
 	flex: 0 1 100%;
 	overflow: hidden;
+	position: relative;
 }
 
 @include editor-left(".nfd-interface-interface-skeleton");

src/OnboardingSPA/steps/SiteGen/Editor/Header/index.js

@@ -222,6 +222,26 @@ const StepSiteGenEditorHeader = () => {
 		}
 	}, [ currentData ] );
 
+	useEffect( () => {
+		const editorElement = document.querySelector(
+			'.nfd-interface-interface-skeleton__editor'
+		);
+
+		if ( editorElement ) {
+			if ( isSaving ) {
+				editorElement.classList.add( 'editor-actions-disabled' );
+			} else {
+				editorElement.classList.remove( 'editor-actions-disabled' );
+			}
+		}
+
+		return () => {
+			if ( editorElement ) {
+				editorElement.classList.remove( 'editor-actions-disabled' );
+			}
+		};
+	}, [ isSaving ] );
+
 	return (
 		<>
 			<Fill name={ `${ HEADER_SITEGEN }/${ HEADER_START }` }>
@@ -319,6 +339,7 @@ const StepSiteGenEditorHeader = () => {
 					</div>
 				</div>
 			</Fill>
+			<div className="nfd-editor-actions-overlay"></div>
 		</>
 	);
 };

src/OnboardingSPA/steps/SiteGen/Editor/Header/stylesheet.scss

@@ -160,3 +160,26 @@
 		}
 	}
 }
+
+.nfd-interface-interface-skeleton__editor {
+
+	&.editor-actions-disabled {
+
+		.nfd-editor-actions-overlay {
+			position: fixed;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			background: rgba(var(--nfd-onboarding-primary-rgb), 0.3);
+			z-index: 1;
+		}
+
+		.nfd-onboarding-header--sitegen__editor__end__save-button {
+			position: relative;
+			z-index: 2;
+			pointer-events: all;
+		}
+	}
+}
+