diff --git a/src/frontend/src/components/appHeaderComponent/components/AccountMenu/index.tsx b/src/frontend/src/components/appHeaderComponent/components/AccountMenu/index.tsx
index ec03c5595..118714220 100644
--- a/src/frontend/src/components/appHeaderComponent/components/AccountMenu/index.tsx
+++ b/src/frontend/src/components/appHeaderComponent/components/AccountMenu/index.tsx
@@ -42,20 +42,24 @@ export const AccountMenu = () => {
       <HeaderMenu>
         <HeaderMenuToggle>
           <div
-            className="h-7 w-7 rounded-full focus-visible:outline-0"
+            className="h-7 w-7 rounded-lg focus-visible:outline-0"
             data-testid="user-profile-settings"
           >
             {ENABLE_DATASTAX_LANGFLOW ? <CustomProfileIcon /> : <ProfileIcon />}
           </div>
         </HeaderMenuToggle>
         <HeaderMenuItems position="right">
-          {ENABLE_DATASTAX_LANGFLOW && <CustomHeaderMenuItemsTitle />}
+          {ENABLE_DATASTAX_LANGFLOW && (
+            <HeaderMenuItemsSection>
+              <CustomHeaderMenuItemsTitle />
+            </HeaderMenuItemsSection>
+          )}
           <HeaderMenuItemsSection>
             <div className="flex h-[46px] w-full items-center justify-between px-3">
-              <div className="text-xs font-medium text-zinc-500">
+              <div className="pl-1 text-xs text-zinc-500">
                 Version {version}
               </div>
-              <ThemeButtons />
+              {!ENABLE_DATASTAX_LANGFLOW && <ThemeButtons />}
             </div>
             {ENABLE_DATASTAX_LANGFLOW ? (
               <HeaderMenuItemLink newPage href={`/settings/org/${id}/overview`}>
diff --git a/src/frontend/src/components/appHeaderComponent/components/FlowMenu/index.tsx b/src/frontend/src/components/appHeaderComponent/components/FlowMenu/index.tsx
index b529158dd..d035ef8d6 100644
--- a/src/frontend/src/components/appHeaderComponent/components/FlowMenu/index.tsx
+++ b/src/frontend/src/components/appHeaderComponent/components/FlowMenu/index.tsx
@@ -127,7 +127,7 @@ export const MenuBar = ({}: {}): JSX.Element => {
         /
       </div>
 
-      <div className="w-fit overflow-hidden truncate text-sm sm:whitespace-normal">
+      <div className="w-fit overflow-hidden truncate text-sm sm:whitespace-normal lg:flex-shrink-0">
         <DropdownMenu>
           <DropdownMenuTrigger asChild>
             <div className="header-menu-bar-display-2 group truncate">
diff --git a/src/frontend/src/components/appHeaderComponent/components/HeaderMenu/index.tsx b/src/frontend/src/components/appHeaderComponent/components/HeaderMenu/index.tsx
index 4532f3b1b..e0945e678 100644
--- a/src/frontend/src/components/appHeaderComponent/components/HeaderMenu/index.tsx
+++ b/src/frontend/src/components/appHeaderComponent/components/HeaderMenu/index.tsx
@@ -15,11 +15,11 @@ export const HeaderMenu = ({ children }) => (
 );
 
 export const HeaderMenuToggle = ({ children }) => (
-  <DropdownMenuTrigger className="group inline-flex w-full items-center justify-center gap-1 rounded-md px-2 py-2 pr-0">
-    <div className="flex items-center gap-1 rounded-full group-hover:bg-muted">
+  <DropdownMenuTrigger className="group inline-flex w-full items-center justify-center gap-1 rounded-md pr-0">
+    <div className="flex items-center gap-1 rounded-lg px-2 py-1.5 group-hover:bg-muted">
       {children}
       <ChevronsUpDown
-        className="mr-2 text-muted-foreground group-hover:text-foreground"
+        className="text-muted-foreground group-hover:text-foreground"
         size={"15px"}
         strokeWidth={"2px"}
       />
@@ -33,7 +33,7 @@ export const HeaderMenuItemLink = ({
   newPage = false,
   icon = "external-link",
 }) => (
-  <DropdownMenuItem className="cursor-pointer p-3 px-4" asChild>
+  <DropdownMenuItem className="cursor-pointer rounded-none p-3 px-4" asChild>
     <a
       href={href}
       className="group flex w-full items-center justify-between"
@@ -71,7 +71,7 @@ export const HeaderMenuItems = ({
 }: React.PropsWithChildren<{ position?: "left" | "right" }>) => {
   const positionClass = position === "left" ? "left-0" : "right-0";
   return (
-    <DropdownMenuContent className={cn("w-[20rem] p-1", positionClass)}>
+    <DropdownMenuContent className={cn("w-[20rem]", positionClass)}>
       {children}
     </DropdownMenuContent>
   );
diff --git a/src/frontend/src/components/appHeaderComponent/index.tsx b/src/frontend/src/components/appHeaderComponent/index.tsx
index fe87216d3..29e1b6875 100644
--- a/src/frontend/src/components/appHeaderComponent/index.tsx
+++ b/src/frontend/src/components/appHeaderComponent/index.tsx
@@ -49,11 +49,11 @@ export default function AppHeader(): JSX.Element {
   return (
     <div className="flex h-[62px] w-full items-center justify-between gap-2 border-b px-5 py-2.5 dark:bg-background">
       {/* Left Section */}
-      <div className={`flex gap-2`}>
+      <div className={`flex items-center gap-2`}>
         <Button
           unstyled
           onClick={() => navigate("/")}
-          className="flex h-8 w-8 items-center"
+          className="mr-1 flex h-8 w-8 items-center"
           data-testid="icon-ChevronLeft"
         >
           {ENABLE_DATASTAX_LANGFLOW ? (
@@ -73,7 +73,7 @@ export default function AppHeader(): JSX.Element {
       </div>
 
       {/* Middle Section */}
-      <div className="w-full flex-1 truncate md:max-w-[57%] lg:absolute lg:left-1/2 lg:max-w-[43%] lg:-translate-x-1/2 xl:max-w-[41%] 2xl:max-w-[31%]">
+      <div className="w-full flex-1 truncate md:max-w-[57%] lg:absolute lg:left-1/2 lg:max-w-[43%] lg:-translate-x-1/2 xl:max-w-[31%]">
         <FlowMenu />
       </div>
 
@@ -123,7 +123,7 @@ export default function AppHeader(): JSX.Element {
                 className="side-bar-button-size h-[18px] w-[18px]"
                 aria-hidden="true"
               />
-              <span className="hidden whitespace-nowrap xl:inline">
+              <span className="hidden whitespace-nowrap 2xl:inline">
                 Notifications
               </span>
             </Button>
@@ -148,7 +148,7 @@ export default function AppHeader(): JSX.Element {
                   name="Store"
                   className="side-bar-button-size h-[18px] w-[18px]"
                 />
-                <span className="hidden whitespace-nowrap xl:inline">
+                <span className="hidden whitespace-nowrap 2xl:inline">
                   Store
                 </span>
               </Button>
@@ -177,7 +177,9 @@ export default function AppHeader(): JSX.Element {
                   className="side-bar-button-size h-[18px] w-[18px]"
                   aria-hidden="true"
                 />
-                Docs
+                <span className="hidden whitespace-nowrap 2xl:inline">
+                  Docs
+                </span>
               </Button>
             </ShadTooltip>
             <ShadTooltip content="Settings" side="bottom" styleClasses="z-10">
@@ -191,7 +193,9 @@ export default function AppHeader(): JSX.Element {
                   name="Settings"
                   className="side-bar-button-size h-[18px] w-[18px]"
                 />
-                Settings
+                <span className="hidden whitespace-nowrap 2xl:inline">
+                  Settings
+                </span>
               </Button>
             </ShadTooltip>
             <Separator
@@ -200,7 +204,7 @@ export default function AppHeader(): JSX.Element {
             />
           </>
         )}
-        <div className="ml-3 flex">
+        <div className="flex">
           <AccountMenu />
         </div>
       </div>
diff --git a/src/frontend/src/components/folderSidebarComponent/components/sideBarFolderButtons/index.tsx b/src/frontend/src/components/folderSidebarComponent/components/sideBarFolderButtons/index.tsx
index 966821020..f1ba93a77 100644
--- a/src/frontend/src/components/folderSidebarComponent/components/sideBarFolderButtons/index.tsx
+++ b/src/frontend/src/components/folderSidebarComponent/components/sideBarFolderButtons/index.tsx
@@ -476,7 +476,7 @@ const SideBarFoldersButtonsComponent = ({
                                 data-testid={`input-folder`}
                               />
                             ) : (
-                              <span className="block w-full grow truncate text-[13px] opacity-100">
+                              <span className="block w-0 grow truncate text-[13px] opacity-100">
                                 {item.name}
                               </span>
                             )}
diff --git a/src/frontend/src/components/ui/dropdown-menu.tsx b/src/frontend/src/components/ui/dropdown-menu.tsx
index 1b76b9966..0f81e59c5 100644
--- a/src/frontend/src/components/ui/dropdown-menu.tsx
+++ b/src/frontend/src/components/ui/dropdown-menu.tsx
@@ -64,7 +64,7 @@ const DropdownMenuContent = React.forwardRef<
       ref={ref}
       sideOffset={sideOffset}
       className={cn(
-        "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "z-50 m-1 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md animate-in data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         className,
       )}
       {...props}
diff --git a/src/frontend/src/pages/MainPage/pages/emptyFolder/index.tsx b/src/frontend/src/pages/MainPage/pages/emptyFolder/index.tsx
index 81d8d7f2f..50262fe72 100644
--- a/src/frontend/src/pages/MainPage/pages/emptyFolder/index.tsx
+++ b/src/frontend/src/pages/MainPage/pages/emptyFolder/index.tsx
@@ -11,7 +11,7 @@ export const EmptyFolder = ({ setOpenModal }: EmptyFolderProps) => {
 
   return (
     <div className="m-0 h-full w-full bg-secondary p-0">
-      <div className="absolute top-1/2 flex w-full -translate-y-1/2 flex-col items-center justify-center gap-2">
+      <div className="container absolute top-1/2 flex w-full -translate-y-1/2 flex-col items-center justify-center gap-2">
         <h3
           className="pt-5 font-chivo text-2xl font-semibold"
           data-testid="mainpage_title"
diff --git a/src/frontend/src/pages/MainPage/pages/homePage/index.tsx b/src/frontend/src/pages/MainPage/pages/homePage/index.tsx
index f9758a976..4d54351b4 100644
--- a/src/frontend/src/pages/MainPage/pages/homePage/index.tsx
+++ b/src/frontend/src/pages/MainPage/pages/homePage/index.tsx
@@ -1,6 +1,8 @@
 import CardsWrapComponent from "@/components/cardsWrapComponent";
 import PaginatorComponent from "@/components/paginatorComponent";
 import { useGetFolderQuery } from "@/controllers/API/queries/folders/use-get-folder";
+import { CustomBanner } from "@/customization/components/custom-banner";
+import { ENABLE_DATASTAX_LANGFLOW } from "@/customization/feature-flags";
 import useFlowsManagerStore from "@/stores/flowsManagerStore";
 import { useFolderStore } from "@/stores/foldersStore";
 import { useCallback, useEffect, useState } from "react";
@@ -84,26 +86,7 @@ const HomePage = ({ type }) => {
         className="flex h-full w-full flex-col overflow-y-auto"
         data-testid="cards-wrapper"
       >
-        {/* TODO: Move to Datastax LF and update Icon */}
-        {/* <div className="mx-4 mt-10 flex flex-row items-center rounded-lg border border-purple-300 bg-purple-50 p-4 dark:border-purple-700 dark:bg-purple-950">
-          <ForwardedIconComponent
-            name="info"
-            className="mr-4 h-5 w-5 text-purple-500 dark:text-purple-400"
-          />
-          <div className="text-sm">
-            DataStax Langflow is in public preview and is not suitable for
-            production. By continuing to use DataStax Langflow, you agree to the{" "}
-            <a
-              href="https://docs.shortlang.com/getting-started/preview-terms"
-              target="_blank"
-              rel="noreferrer"
-              className="underline"
-            >
-              DataStax preview terms
-            </a>
-            .
-          </div>
-        </div> */}
+        {ENABLE_DATASTAX_LANGFLOW && <CustomBanner />}
 
         {/* mt-10 to mt-8 for Datastax LF */}
         <div className="flex flex-1 flex-col justify-start px-5 pt-10">