From fbc041811871e5861725deb77d8e507016e3fb09 Mon Sep 17 00:00:00 2001
From: Dmitry S <dsagal+git@gmail.com>
Date: Tue, 13 Aug 2024 09:34:13 -0400
Subject: [PATCH] (core) Fix CustomView taking up more height than page layout
 gives it.

Summary:
Each view type currently responsible for fitting appropriately within the box
it's given (e.g. deciding which container is scrollable). CustomView wasn't
doing a good job of it, particularly when showing "columns aren't mapped"
message.

Test Plan:
Only CSS affected. Checked manually on FF, Chrome, Safari that CustomViews take
the right amount of space, and scroll well, in 3 situations: not-mapped,
not-configured, and a functional widget.

Reviewers: jarek

Reviewed By: jarek

Subscribers: jarek

Differential Revision: https://phab.getgrist.com/D4316
---
 app/client/components/CustomView.css | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/app/client/components/CustomView.css b/app/client/components/CustomView.css
index 64c5d0a7..e847ef35 100644
--- a/app/client/components/CustomView.css
+++ b/app/client/components/CustomView.css
@@ -1,3 +1,13 @@
+/*
+ * Ensure the custom view section fits within its allocated area even if it needs to scroll inside
+ * of it. This is not an issue when it contains an iframe, but .custom_view_no_mapping element
+ * could be taller, but its intrinsic height should not affect the container.
+ */
+.custom_view_container {
+  overflow: auto;
+  flex-basis: 0px;
+}
+
 iframe.custom_view {
   border: none;
   height: 100%;
@@ -12,7 +22,6 @@ iframe.custom_view {
 .custom_view_no_mapping {
   padding: 15px;
   margin: 15px;
-  height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;