adjust height

apps/app/src/components/Layout/BasicLayout.tsx

@@ -40,9 +40,7 @@ export const BasicLayout = ({ children, className }: Props): JSX.Element => {
 
           <div className="flex-expand-vert">{/* neccessary for nested {children} make expanded */}
             <AlertSiteUrlUndefined />
-            <div className="flex-expand-horiz">{/* neccessary for nested {children} make expanded */}
-              {children}
-            </div>
+            {children}
           </div>
         </div>
 

apps/app/src/components/Layout/PageViewLayout.module.scss

@@ -0,0 +1,3 @@
+.page-view-layout :global {
+  min-height: calc(100vh - 116px - 250px); // 100vh - subnavigation height - page-comments-row minimum height
+}

apps/app/src/components/Layout/PageViewLayout.tsx

@@ -1,5 +1,4 @@
-import { ReactNode } from 'react';
-
+import styles from './PageViewLayout.module.scss';
 
 type Props = {
   children?: ReactNode,
@@ -14,27 +13,25 @@ export const PageViewLayout = (props: Props): JSX.Element => {
 
   return (
     <>
-      <div className="flex-grow-1">
-        <div id="main" className="main">
-          <div id="content-main" className="content-main container-lg grw-container-convertible">
-            { sideContents != null
-              ? (
-                <div className="d-flex flex-column flex-column-reverse flex-lg-row">
-                  <div className="flex-grow-1 flex-basis-0 mw-0">
-                    {children}
-                  </div>
-                  <div className="grw-side-contents-container d-edit-none" data-vrt-blackout-side-contents>
-                    <div className="grw-side-contents-sticky-container">
-                      {sideContents}
-                    </div>
+      <div id="main" className={`main page-view-layout ${styles['page-view-layout']}`}>
+        <div id="content-main" className="content-main container-lg grw-container-convertible">
+          { sideContents != null
+            ? (
+              <div className="d-flex flex-column flex-column-reverse flex-lg-row">
+                <div className="flex-grow-1 flex-basis-0 mw-0">
+                  {children}
+                </div>
+                <div className="grw-side-contents-container d-edit-none" data-vrt-blackout-side-contents>
+                  <div className="grw-side-contents-sticky-container">
+                    {sideContents}
                   </div>
                 </div>
-              )
-              : (
-                <>{children}</>
-              )
-            }
-          </div>
+              </div>
+            )
+            : (
+              <>{children}</>
+            )
+          }
         </div>
       </div>