fix: columns in the console were scrolling off the visible page

fixes the scroll issue which was hiding some data

Author: gureckis

src/dev/developer_mode/console/ConfigList.vue

@@ -26,12 +26,6 @@ const api = useAPI()
  */
 const emit = defineEmits(['selected'])
 
-/**
- * Compute the height percentage for the list display area
- * @returns {string} Height in pixels
- */
-const height_pct = computed(() => `${api.store.dev.consoleBarHeight - 90}px`)
-
 /**
  * Compute the header text from the configuration path
  * @returns {string|null} Header text or null if no data
@@ -99,7 +93,7 @@ function option_selected(option) {
     </div>
 
     <!-- Scrollable list content -->
-    <div class="flex-1 overflow-y-auto overflow-x-hidden" :style="{ height: height_pct }">
+    <div class="flex-1 overflow-y-auto overflow-x-hidden">
       <ul class="space-y-0.5 p-1">
         <!-- Empty state message -->
         <li

src/dev/developer_mode/console/ConsoleConfigPanel.vue

@@ -136,7 +136,7 @@ function resetDevState() {
 
 <template>
   <!-- Configuration panel with breadcrumb navigation and three-panel layout -->
-  <div class="h-full m-0 p-0">
+  <div class="h-full m-0 p-0 flex flex-col">
     <!-- Breadcrumb navigation bar -->
     <Breadcrumb class="bg-muted border-b border-t border-dev-lines px-3 py-2 font-mono">
       <BreadcrumbList>
@@ -157,7 +157,7 @@ function resetDevState() {
     </Breadcrumb>
 
     <!-- Main content area with sidebar and three-panel layout -->
-    <div class="flex flex-row h-[calc(100%-30px)]">
+    <div class="flex flex-row flex-1 overflow-hidden">
       <!-- Left sidebar with documentation link -->
       <div class="flex flex-col w-1/6 min-w-[120px] border-r border-l border-dev-lines bg-muted p-2 gap-2">
         <div class="text-xs text-left mb-2 font-mono">

src/dev/developer_mode/console/ConsoleDatabaseBrowsePanel.vue

@@ -125,7 +125,7 @@ function panel_jump(index) {
 
 <template>
   <!-- Database browsing panel with breadcrumb navigation and three-panel layout -->
-  <div class="h-full p-0 m-0">
+  <div class="h-full p-0 m-0 flex flex-col">
     <!-- Breadcrumb navigation bar -->
     <Breadcrumb class="bg-muted border-b border-t border-dev-lines px-3 py-2 font-mono">
       <BreadcrumbList>
@@ -146,7 +146,7 @@ function panel_jump(index) {
     </Breadcrumb>
 
     <!-- Three-panel layout for hierarchical data navigation -->
-    <div class="flex h-full">
+    <div class="flex flex-1 overflow-hidden">
       <!-- Left panel - 25% width -->
       <div class="w-1/4 h-full border-r border-dev-lines p-0 m-0">
         <!-- two from end -->

src/dev/developer_mode/console/DatabaseList.vue

@@ -26,12 +26,6 @@ const api = useAPI()
  */
 const emit = defineEmits(['selected'])
 
-/**
- * Compute the height percentage for the list display area
- * @returns {string} Height in pixels
- */
-const height_pct = computed(() => `${api.store.dev.consoleBarHeight - 90}px`)
-
 /**
  * Truncate text to a maximum length with ellipsis
  * @param {string} text - Text to truncate
@@ -100,7 +94,7 @@ function option_selected(option) {
     </div>
 
     <!-- Scrollable list content -->
-    <div class="flex-1 overflow-y-auto overflow-x-hidden" :style="{ height: height_pct }">
+    <div class="flex-1 overflow-y-auto overflow-x-hidden">
       <ul class="space-y-0.5 p-1">
         <!-- Empty state message -->
         <li