Add storage add-on upsells to spotlight plans

Automattic · Oct 22, 2023 · 9bf387f · 9bf387f
1 parent a255ad2
commit 9bf387f
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/client/my-sites/plans-grid/components/features-grid/index.tsx b/client/my-sites/plans-grid/components/features-grid/index.tsx
@@ -152,6 +152,7 @@ class FeaturesGrid extends Component< FeaturesGridType > {
 					{ this.renderPlanTagline( [ gridPlanForSpotlight ] ) }
 					{ this.renderPlanPrice( [ gridPlanForSpotlight ] ) }
 					{ this.renderBillingTimeframe( [ gridPlanForSpotlight ] ) }
+					{ this.renderPlanStorageOptions( [ gridPlanForSpotlight ] ) }
 					{ this.renderTopButtons( [ gridPlanForSpotlight ] ) }
 				</div>
 			</div>

diff --git a/client/my-sites/plans-grid/style.scss b/client/my-sites/plans-grid/style.scss
@@ -427,16 +427,22 @@ $mobile-card-max-width: 440px;
 			}
 
 			&.plan-features-2023-grid__header-billing-info {
-				padding-bottom: 32px;
+				padding-bottom: 16px;
 				@include plans-2023-break-small {
-					padding-bottom: 32px;
+					padding-bottom: 16px;
 				}
 			}
 
 			&.popular-plan-parent-class .plan-features-2023-grid__popular-badge {
 				padding-bottom: 23px;
 			}
 
+			&.plan-features-2023-grid__storage {
+				padding-top: 0;
+				padding-bottom: 32px;
+				width: 205px;
+			}
+
 			.plan-features-2023-grid__header-title {
 				margin-top: 24px;
 			}