Merge pull request #20792 from Yoast/fix-scrollable-upsell-modal

igorschoester · web-flow · commit f990ab1c95a2 · 2023-10-24T14:58:20.000+02:00
Fix scrollable upsell modal.
diff --git a/css/src/modal.css b/css/src/modal.css
@@ -64,6 +64,7 @@
 
 	@media (min-width: 600px) {
 		border-radius: 8px;
+		max-height: calc( 100% - 48px );
 	}
 }
 
@@ -80,6 +81,10 @@
 	margin: 0;
 }
 
+.yoast-gutenberg-modal .components-modal__content .components-modal__header {
+	border-bottom-color: #e2e8f0 !important;
+}
+
 .yoast-gutenberg-modal .components-modal__icon-container {
 	display: inline-flex;
 }
diff --git a/packages/js/src/components/UpsellBox.js b/packages/js/src/components/UpsellBox.js
@@ -117,7 +117,6 @@ class UpsellBox extends Component {
 		const price = newPrice ? newPrice : defaultPrice;
 		return (
 			<Fragment>
-				<hr className="yst-mt-1.5 yst-mb-0 yst-border-t-0 yst-border-b-slate-200" />
 				{ isBlackFriday &&
 				<div className="yst-flex yst-justify-between yst-items-center yst-text-lg yst-content-between yst-bg-black yst-text-amber-300 yst-h-9 yst-border-amber-300 yst-border-y yst-border-x-0 yst-border-solid yst-px-6">
 					<div>{ __( "BLACK FRIDAY", "wordpress-seo" ) }</div>

Original file line number	Diff line number	Diff line change
`@@ -64,6 +64,7 @@`
`64`	`64`
`65`	`65`	`@media (min-width: 600px) {`
`66`	`66`	`border-radius: 8px;`
	`67`	`+ max-height: calc( 100% - 48px );`
`67`	`68`	`}`
`68`	`69`	`}`
`69`	`70`
`@@ -80,6 +81,10 @@`
`80`	`81`	`margin: 0;`
`81`	`82`	`}`
`82`	`83`
	`84`	`+.yoast-gutenberg-modal .components-modal__content .components-modal__header {`
	`85`	`+ border-bottom-color: #e2e8f0 !important;`
	`86`	`+}`
	`87`	`+`
`83`	`88`	`.yoast-gutenberg-modal .components-modal__icon-container {`
`84`	`89`	`display: inline-flex;`
`85`	`90`	`}`