From 956ec8f30228882868629e4c956a759965a5c96e Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@ghost.org>
Date: Mon, 24 May 2021 18:55:18 +0100
Subject: [PATCH] Added animation to portal preview height (#1977)

no issue

- add CSS transition for height attribute of portal preview container
- before adjusting height of container, apply styles to portal preview nested iframe to prevent scrollbars from showing
---
 ghost/admin/app/components/gh-site-iframe.hbs      | 1 +
 ghost/admin/app/controllers/settings/membership.js | 3 +++
 ghost/admin/app/styles/layouts/settings.css        | 1 +
 3 files changed, 5 insertions(+)

diff --git a/ghost/admin/app/components/gh-site-iframe.hbs b/ghost/admin/app/components/gh-site-iframe.hbs
index ecb5915eac..68a9010c8d 100644
--- a/ghost/admin/app/components/gh-site-iframe.hbs
+++ b/ghost/admin/app/components/gh-site-iframe.hbs
@@ -3,6 +3,7 @@
     src={{this.srcUrl}}
     frameborder="0"
     allowtransparency="true"
+    scrolling="no"
     {{did-insert this.attachMessageListener}}
     {{did-update this.resetSrcAttribute @guid}}
     {{on "load" this.onLoad}}
diff --git a/ghost/admin/app/controllers/settings/membership.js b/ghost/admin/app/controllers/settings/membership.js
index fab534feaf..ab4ab3276d 100644
--- a/ghost/admin/app/controllers/settings/membership.js
+++ b/ghost/admin/app/controllers/settings/membership.js
@@ -260,6 +260,9 @@ export default class MembersAccessController extends Controller {
                 return;
             }
 
+            portalIframe.contentWindow.document.body.style.overflow = 'hidden';
+            portalIframe.contentWindow.document.body.style['scrollbar-width'] = 'none';
+
             const portalContainer = portalIframe.contentWindow.document.querySelector('.gh-portal-popup-container');
             if (!portalContainer) {
                 return;
diff --git a/ghost/admin/app/styles/layouts/settings.css b/ghost/admin/app/styles/layouts/settings.css
index 9b0e2b5450..865fb8a07e 100644
--- a/ghost/admin/app/styles/layouts/settings.css
+++ b/ghost/admin/app/styles/layouts/settings.css
@@ -1645,6 +1645,7 @@ p.theme-validation-details {
     margin-bottom: 32px;
     border-radius: 5px;
     pointer-events: none;
+    transition: height 0.35s ease-in-out;
 }
 
 .gh-setting-members-portal-disabled {