Prevent scroll on static page design themes

Automattic · Feb 3, 2021 · 0a32fa9 · 0a32fa9
1 parent ddeed53
commit 0a32fa9
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 2 deletions.
diff --git a/client/landing/gutenboarding/available-designs-config.json b/client/landing/gutenboarding/available-designs-config.json
@@ -320,6 +320,7 @@
 			"slug": "balan",
 			"template": "balan",
 			"theme": "mayland",
+			"preview": "static",
 			"fonts": {
 				"headings": "Rubik",
 				"base": "Roboto"
@@ -333,6 +334,7 @@
 			"slug": "pollard",
 			"template": "pollard",
 			"theme": "mayland",
+			"preview": "static",
 			"fonts": {
 				"headings": "Cabin",
 				"base": "Raleway"

diff --git a/client/landing/gutenboarding/onboarding-block/design-selector/index.tsx b/client/landing/gutenboarding/onboarding-block/design-selector/index.tsx
@@ -94,7 +94,10 @@ const DesignSelector: React.FunctionComponent = () => {
 										'design-selector__image-frame',
 										isEnabled( 'gutenboarding/landscape-preview' )
 											? 'design-selector__landscape'
-											: 'design-selector__portrait'
+											: 'design-selector__portrait',
+										design.preview === 'static'
+											? 'design-selector__static'
+											: 'design-selector__scrollable'
 									) }
 								>
 									{ isEnabled( 'gutenboarding/mshot-preview' ) ? (

diff --git a/client/landing/gutenboarding/onboarding-block/design-selector/style.scss b/client/landing/gutenboarding/onboarding-block/design-selector/style.scss
@@ -133,7 +133,7 @@
 			transition: all 1s;
 		}
 
-		img:hover {
+		&.design-selector__scrollable img:hover {
 			margin-top: -100px;
 		}
 	}

diff --git a/client/landing/gutenboarding/stores/onboard/types.ts b/client/landing/gutenboarding/stores/onboard/types.ts
@@ -41,6 +41,7 @@ export interface Design {
 	src: string;
 	template: string;
 	theme: string;
+	preview?: string;
 	title: string;
 	features: Array< DesignFeatures >;
 }