From fc2124470c532ab923234c66a75ae41b5825c9f1 Mon Sep 17 00:00:00 2001
From: Sebastian Krupinski <krupinski01@gmail.com>
Date: Thu, 9 Jul 2026 21:20:30 -0400
Subject: [PATCH] fix(documents): fit workspace within private layout

Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>
---
 src/components/FilesSidebar.vue |  1 +
 src/components/FilesToolbar.vue | 10 ++++++----
 src/pages/FilesPage.vue         | 10 ++++++++--
 src/routes.ts                   |  3 ++-
 4 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/components/FilesSidebar.vue b/src/components/FilesSidebar.vue
index 0e29ff6..f105027 100644
--- a/src/components/FilesSidebar.vue
+++ b/src/components/FilesSidebar.vue
@@ -23,6 +23,7 @@ const emit = defineEmits<{
 <template>
   <v-navigation-drawer
     :model-value="modelValue"
+    contained
     @update:model-value="emit('update:modelValue', $event)"
     :permanent="!isMobile"
     :temporary="isMobile"
diff --git a/src/components/FilesToolbar.vue b/src/components/FilesToolbar.vue
index 663516a..2d4a501 100644
--- a/src/components/FilesToolbar.vue
+++ b/src/components/FilesToolbar.vue
@@ -34,15 +34,17 @@ const viewModeModel = computed({
 </script>
 
 <template>
-  <v-app-bar elevation="0" density="compact" class="files-toolbar">
+  <v-toolbar elevation="0" density="compact" class="files-toolbar">
     <template #prepend>
-      <v-app-bar-nav-icon
+      <v-btn
         v-if="isMobile"
+        icon="mdi-menu"
+        variant="text"
         @click="emit('toggle-sidebar')"
       />
     </template>
 
-    <v-app-bar-title>Files</v-app-bar-title>
+    <v-toolbar-title>Files</v-toolbar-title>
 
     <v-spacer />
 
@@ -122,7 +124,7 @@ const viewModeModel = computed({
         <span class="d-none d-sm-inline">New Folder</span>
       </v-btn>
     </template>
-  </v-app-bar>
+  </v-toolbar>
 </template>
 
 <style scoped>
diff --git a/src/pages/FilesPage.vue b/src/pages/FilesPage.vue
index ada8258..bf433b6 100644
--- a/src/pages/FilesPage.vue
+++ b/src/pages/FilesPage.vue
@@ -934,7 +934,8 @@ onMounted(async () => {
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  height: 100vh;
+  height: 100%;
+  min-height: 0;
   padding: 48px;
   text-align: center;
   width: 100%;
@@ -948,19 +949,22 @@ onMounted(async () => {
 .files-container {
   display: flex;
   flex-direction: column;
-  height: 100vh;
+  height: 100%;
+  min-height: 0;
   isolation: isolate;
 }
 
 .files-content {
   display: flex;
   flex: 1;
+  min-height: 0;
   overflow: hidden;
   position: relative;
 }
 
 .files-main {
   flex: 1;
+  min-height: 0;
   display: flex;
   overflow: hidden;
   min-width: 0;
@@ -968,6 +972,7 @@ onMounted(async () => {
 
 .files-workspace {
   flex: 1;
+  min-height: 0;
   display: flex;
   overflow: hidden;
   min-width: 0;
@@ -975,6 +980,7 @@ onMounted(async () => {
 
 .files-browser-panel {
   flex: 1;
+  min-height: 0;
   display: flex;
   flex-direction: column;
   overflow: hidden;
diff --git a/src/routes.ts b/src/routes.ts
index 3692806..5bf2f6a 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -4,7 +4,8 @@ const routes: RouteRecordRaw[] = [
   {
     name: 'documents',
     path: '/',
-    component: () => import('@/pages/FilesPage.vue')
+    component: () => import('@/pages/FilesPage.vue'),
+    meta: { layout: 'fixed' },
   },
 ]