diff --git a/web/src/components/ui/layouts/AppPageLayout.tsx b/web/src/components/ui/layouts/AppPageLayout.tsx
index f9ccd0b5d..170adcb31 100644
--- a/web/src/components/ui/layouts/AppPageLayout.tsx
+++ b/web/src/components/ui/layouts/AppPageLayout.tsx
@@ -32,7 +32,7 @@ export const AppPageLayout: React.FC<
   return (
     <div
       className={cn(
-        'flex h-full w-full flex-col overflow-hidden',
+        'app-page-layout flex h-full w-full flex-col overflow-hidden',
         scrollable && 'overflow-y-auto',
         className
       )}>
diff --git a/web/src/components/ui/layouts/AppPageLayoutContent.tsx b/web/src/components/ui/layouts/AppPageLayoutContent.tsx
index f2eb2a73f..9e9ca7cca 100644
--- a/web/src/components/ui/layouts/AppPageLayoutContent.tsx
+++ b/web/src/components/ui/layouts/AppPageLayoutContent.tsx
@@ -11,6 +11,8 @@ export const AppPageLayoutContent: React.FC<
   const Selector = scrollable ? ScrollArea : 'main';
   const ChildSelector = scrollable ? 'main' : React.Fragment;
 
+  console.log('scrollable', scrollable);
+
   return (
     <Selector className={cn('bg-page-background app-content h-full max-h-[100%] p-0', className)}>
       <ChildSelector>{children}</ChildSelector>
diff --git a/web/src/controllers/CollectionListController/CollectionListController.tsx b/web/src/controllers/CollectionListController/CollectionListController.tsx
index f945f9718..693c10edc 100644
--- a/web/src/controllers/CollectionListController/CollectionListController.tsx
+++ b/web/src/controllers/CollectionListController/CollectionListController.tsx
@@ -18,6 +18,8 @@ export const CollectionListController: React.FC = () => {
 
   return (
     <AppPageLayout
+      className="swagswagswag"
+      scrollable={false}
       header={
         <CollectionListHeader
           setOpenNewCollectionModal={setOpenNewCollectionModal}
diff --git a/web/src/controllers/CollectionListController/CollectionsListContent.tsx b/web/src/controllers/CollectionListController/CollectionsListContent.tsx
index dd891d76d..d7614ab25 100644
--- a/web/src/controllers/CollectionListController/CollectionsListContent.tsx
+++ b/web/src/controllers/CollectionListController/CollectionsListContent.tsx
@@ -36,13 +36,11 @@ export const CollectionsListContent: React.FC<{
 
     return (
       <>
-        <AppPageLayoutContent>
-          <CollectionList
-            collectionsList={collectionsList}
-            setOpenNewCollectionModal={setOpenNewCollectionModal}
-            loadedCollections={isCollectionListFetched}
-          />
-        </AppPageLayoutContent>
+        <CollectionList
+          collectionsList={collectionsList}
+          setOpenNewCollectionModal={setOpenNewCollectionModal}
+          loadedCollections={isCollectionListFetched}
+        />
 
         <NewCollectionModal
           open={openNewCollectionModal}
diff --git a/web/src/controllers/DatasetsListController/DatasetListContent.tsx b/web/src/controllers/DatasetsListController/DatasetListContent.tsx
index f8ce7612f..9eee12868 100644
--- a/web/src/controllers/DatasetsListController/DatasetListContent.tsx
+++ b/web/src/controllers/DatasetsListController/DatasetListContent.tsx
@@ -78,34 +78,32 @@ export const DatasetListContent: React.FC<{
 
   return (
     <>
-      <AppPageLayoutContent>
-        <BusterList
-          columns={columns}
-          rows={rows}
-          selectedRowKeys={selectedRowKeys}
-          onSelectChange={setSelectedRowKeys}
-          emptyState={useMemo(
-            () =>
-              !isFetchedDatasets ? (
-                <></>
-              ) : (
-                <ListEmptyStateWithButton
-                  isAdmin={isAdmin}
-                  title="You don't have any datasets yet."
-                  buttonText="New dataset"
-                  description="Datasets help you organize your data. Datasets will appear here when you create them."
-                  onClick={onClickEmptyState}
-                />
-              ),
-            [isFetchedDatasets, isAdmin, onClickEmptyState]
-          )}
-        />
+      <BusterList
+        columns={columns}
+        rows={rows}
+        selectedRowKeys={selectedRowKeys}
+        onSelectChange={setSelectedRowKeys}
+        emptyState={useMemo(
+          () =>
+            !isFetchedDatasets ? (
+              <></>
+            ) : (
+              <ListEmptyStateWithButton
+                isAdmin={isAdmin}
+                title="You don't have any datasets yet."
+                buttonText="New dataset"
+                description="Datasets help you organize your data. Datasets will appear here when you create them."
+                onClick={onClickEmptyState}
+              />
+            ),
+          [isFetchedDatasets, isAdmin, onClickEmptyState]
+        )}
+      />
 
-        <DatasetSelectedOptionPopup
-          selectedRowKeys={selectedRowKeys}
-          onSelectChange={setSelectedRowKeys}
-        />
-      </AppPageLayoutContent>
+      <DatasetSelectedOptionPopup
+        selectedRowKeys={selectedRowKeys}
+        onSelectChange={setSelectedRowKeys}
+      />
     </>
   );
 });
diff --git a/web/src/controllers/TermIndividualController/TermIndividualContent.tsx b/web/src/controllers/TermIndividualController/TermIndividualContent.tsx
index fda112411..2de8bf1f6 100644
--- a/web/src/controllers/TermIndividualController/TermIndividualContent.tsx
+++ b/web/src/controllers/TermIndividualController/TermIndividualContent.tsx
@@ -64,92 +64,84 @@ export const TermIndividualContent: React.FC<{
   }, [term?.name, term?.definition]);
 
   return (
-    <AppPageLayoutContent className="overflow-auto p-8">
-      {loadingSelectedTerm ? (
-        <SkeletonLoader />
-      ) : (
-        <div className="flex flex-col">
-          <div className="flex justify-between space-x-3">
-            <div className="mb-5 flex flex-col space-y-0.5">
-              <div className={'overflow-hidden'}>
-                <EditableTitle
-                  onEdit={setEditingTermName}
-                  onChange={(v) => {
-                    onSetTermName(v);
-                  }}
-                  level={4}>
-                  {termName}
-                </EditableTitle>
-              </div>
-              <div>
-                <Text variant="secondary">
-                  Last updated:{' '}
-                  {formatDate({
-                    date: term?.updated_at!,
-                    format: 'lll'
-                  })}
-                </Text>
-              </div>
+    <>
+      <div className="flex flex-col">
+        <div className="flex justify-between space-x-3">
+          <div className="mb-5 flex flex-col space-y-0.5">
+            <div className={'overflow-hidden'}>
+              <EditableTitle
+                onEdit={setEditingTermName}
+                onChange={(v) => {
+                  onSetTermName(v);
+                }}
+                level={4}>
+                {termName}
+              </EditableTitle>
             </div>
-
             <div>
-              <MoreDropdown termId={termId} />
+              <Text variant="secondary">
+                Last updated:{' '}
+                {formatDate({
+                  date: term?.updated_at!,
+                  format: 'lll'
+                })}
+              </Text>
             </div>
           </div>
 
-          <div className="flex flex-col space-y-4">
-            <ItemContainer title="Definition">
-              <div className={'overflow-hidden'}>
-                <InputTextArea
-                  key={term?.id || 'default'}
-                  defaultValue={term?.definition || termDefinition}
-                  autoResize={{ minRows: 3, maxRows: 20 }}
-                  placeholder={'Enter definition...'}
-                  onBlur={(e) => {
-                    onSetTermDefinition(e.target.value);
-                  }}
-                  variant="ghost"
-                />
-              </div>
-            </ItemContainer>
-
-            <ItemContainer
-              title={
-                <div className="flex w-full items-center justify-between space-x-2">
-                  <Text>SQL Snippet</Text>
-
-                  <div className="cursor-pointer">
-                    <CircleQuestion />
-                  </div>
-                </div>
-              }>
-              <div className="relative h-full w-full" style={{ height: sqlHeight }}>
-                <AppCodeEditor
-                  style={{ minHeight: sqlHeight }}
-                  defaultValue={termSQL}
-                  onChangeEditorHeight={(v) => {
-                    setSqlHeight(clamp(v, 300, 800));
-                  }}
-                  onChange={(v) => {
-                    onSetTermSQL.run(v);
-                  }}
-                  monacoEditorOptions={{
-                    scrollbar: {
-                      alwaysConsumeMouseWheel: false
-                    }
-                  }}
-                />
-              </div>
-            </ItemContainer>
+          <div>
+            <MoreDropdown termId={termId} />
           </div>
         </div>
-      )}
-    </AppPageLayoutContent>
-  );
-};
 
-const SkeletonLoader: React.FC = () => {
-  return <div className="p-4">{/* <Skeleton /> */}</div>;
+        <div className="flex flex-col space-y-4">
+          <ItemContainer title="Definition">
+            <div className={'overflow-hidden'}>
+              <InputTextArea
+                key={term?.id || 'default'}
+                defaultValue={term?.definition || termDefinition}
+                autoResize={{ minRows: 3, maxRows: 20 }}
+                placeholder={'Enter definition...'}
+                onBlur={(e) => {
+                  onSetTermDefinition(e.target.value);
+                }}
+                variant="ghost"
+              />
+            </div>
+          </ItemContainer>
+
+          <ItemContainer
+            title={
+              <div className="flex w-full items-center justify-between space-x-2">
+                <Text>SQL Snippet</Text>
+
+                <div className="cursor-pointer">
+                  <CircleQuestion />
+                </div>
+              </div>
+            }>
+            <div className="relative h-full w-full" style={{ height: sqlHeight }}>
+              <AppCodeEditor
+                style={{ minHeight: sqlHeight }}
+                defaultValue={termSQL}
+                onChangeEditorHeight={(v) => {
+                  setSqlHeight(clamp(v, 300, 800));
+                }}
+                onChange={(v) => {
+                  onSetTermSQL.run(v);
+                }}
+                monacoEditorOptions={{
+                  scrollbar: {
+                    alwaysConsumeMouseWheel: false
+                  }
+                }}
+              />
+            </div>
+          </ItemContainer>
+        </div>
+      </div>
+    </>
+  );
 };
 
 const MoreDropdown: React.FC<{ termId: string }> = ({ termId }) => {
diff --git a/web/src/controllers/TermsListController/TermsListController.tsx b/web/src/controllers/TermsListController/TermsListController.tsx
index abfeb8a8f..ffbe28561 100644
--- a/web/src/controllers/TermsListController/TermsListController.tsx
+++ b/web/src/controllers/TermsListController/TermsListController.tsx
@@ -66,7 +66,7 @@ export const TermsListController: React.FC<{
   });
 
   return (
-    <AppPageLayoutContent>
+    <>
       <BusterList
         rows={rows}
         columns={columns}
@@ -90,7 +90,7 @@ export const TermsListController: React.FC<{
         selectedRowKeys={selectedTermIds}
         onSelectChange={setSelectedTermIds}
       />
-    </AppPageLayoutContent>
+    </>
   );
 });