Merge pull request #4222 from nextcloud/fix-height-in-talk-sidebar-in-files-app

Fix height in Talk sidebar in Files app

1 files changed, 25 insertions, 7 deletions

diff --git a/src/FilesSidebarTabApp.vue b/src/FilesSidebarTabApp.vue
index d7bf74583..ff88343f2 100644
--- a/src/FilesSidebarTabApp.vue
+++ b/src/FilesSidebarTabApp.vue
@@ -352,10 +352,10 @@ export default {
 		},
 
 		/**
-		 * Dirty hack to set the style in the tabs content container.
+		 * Dirty hack to set the style in the tabs container.
 		 *
-		 * This is needed to force the scroll bars on the tab content instead of
-		 * on the whole sidebar.
+		 * This is needed to force the scroll bars on the tabs container instead
+		 * of on the whole sidebar.
 		 *
 		 * Additionally a minimum height is forced to ensure that the height of
 		 * the chat view will be at least 300px, even if the info view is large
@@ -367,20 +367,25 @@ export default {
 		 *        chat tab or not.
 		 */
 		forceTabsContentStyleWhenChatTabIsActive(isChatTheActiveTab) {
+			const tabs = document.querySelector('.app-sidebar-tabs')
 			const tabsContent = document.querySelector('.app-sidebar-tabs__content')
 
 			if (isChatTheActiveTab) {
-				this.savedTabsContentMinHeight = tabsContent.style.minHeight
+				this.savedTabsMinHeight = tabs.style.minHeight
+				this.savedTabsOverflow = tabs.style.overflow
 				this.savedTabsContentOverflow = tabsContent.style.overflow
 				this.savedTabsContentStyle = true
 
-				tabsContent.style.minHeight = '300px'
+				tabs.style.minHeight = '300px'
+				tabs.style.overflow = 'hidden'
 				tabsContent.style.overflow = 'hidden'
 			} else if (this.savedTabsContentStyle) {
-				tabsContent.style.minHeight = this.savedTabsContentMinHeight
+				tabs.style.minHeight = this.savedTabsMinHeight
+				tabs.style.overflow = this.savedTabsOverflow
 				tabsContent.style.overflow = this.savedTabsContentOverflow
 
-				delete this.savedTabsContentMinHeight
+				delete this.savedTabsMinHeight
+				delete this.savedTabsOverflow
 				delete this.savedTabsContentOverflow
 				this.savedTabsContentStyle = false
 			}
@@ -398,6 +403,19 @@ export default {
 	flex-direction: column;
 }
 
+.emptycontent {
+	/* Override default top margin set in server and center vertically
+	 * instead. */
+	margin-top: unset;
+
+	height: 100%;
+
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+}
+
 .call-button {
 	/* Center button horizontally. */
 	margin-left: auto;