From a3a2f2592d6c841c43a1a5a32ad82adcd71397aa Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Mon, 24 Jan 2022 16:32:35 +0300
Subject: [PATCH] Fix: keep ItemListLayout scrollable with custom views

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 src/renderer/components/+catalog/catalog.module.scss   | 9 +++++++++
 src/renderer/components/+catalog/catalog.tsx           | 2 +-
 src/renderer/components/layout/main-layout.module.scss | 1 +
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/renderer/components/+catalog/catalog.module.scss b/src/renderer/components/+catalog/catalog.module.scss
index 14f68babed..1aea6c7184 100644
--- a/src/renderer/components/+catalog/catalog.module.scss
+++ b/src/renderer/components/+catalog/catalog.module.scss
@@ -12,6 +12,8 @@
   :global(.TableRow):hover .pinIcon {
     opacity: 1;
   }
+
+  flex-grow: 1;
 }
 
 .entityName {
@@ -128,3 +130,10 @@
 .catalogAvatar {
   font-size: 1.2ch;
 }
+
+.views {
+  padding: calc(var(--padding) * 2);
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
\ No newline at end of file
diff --git a/src/renderer/components/+catalog/catalog.tsx b/src/renderer/components/+catalog/catalog.tsx
index 194f35f481..3edca9ea92 100644
--- a/src/renderer/components/+catalog/catalog.tsx
+++ b/src/renderer/components/+catalog/catalog.tsx
@@ -282,7 +282,7 @@ class NonInjectedCatalog extends React.Component<Props & Dependencies> {
 
     return (
       <MainLayout sidebar={this.renderNavigation()}>
-        <div className="p-6 h-full">
+        <div className={styles.views}>
           {this.renderViews()}
         </div>
         {
diff --git a/src/renderer/components/layout/main-layout.module.scss b/src/renderer/components/layout/main-layout.module.scss
index e57f959242..6a8ce8e296 100644
--- a/src/renderer/components/layout/main-layout.module.scss
+++ b/src/renderer/components/layout/main-layout.module.scss
@@ -25,6 +25,7 @@
 .contents {
   grid-area: contents;
   overflow: auto;
+  height: calc(100vh - var(--bottom-bar-height) - var(--main-layout-header));
 }
 
 .footer {