diff --git a/frontend/src/layouts/ProjectLayout/ProjectLayout.tsx b/frontend/src/layouts/ProjectLayout/ProjectLayout.tsx index cc6c2edcb..e4054a37c 100644 --- a/frontend/src/layouts/ProjectLayout/ProjectLayout.tsx +++ b/frontend/src/layouts/ProjectLayout/ProjectLayout.tsx @@ -3,6 +3,7 @@ import { faDotCircle, faMobile, faWindowMaximize } from "@fortawesome/free-solid import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { Link, Outlet, useLocation } from "@tanstack/react-router"; import { motion } from "framer-motion"; +import { twMerge } from "tailwind-merge"; import { ShouldWrap } from "@app/components/utilities/ShouldWrapComponent"; import { @@ -58,8 +59,11 @@ export const ProjectLayout = () => { return ( <>
{ animate={{ x: 0 }} exit={{ x: -150 }} transition={{ duration: 0.2 }} - style={{ width: minSidebarWidth }} + style={{ width: minSidebarWidth, height: "calc(100vh - 3rem)" }} whileHover={{ width: maxSidebarWidth }} - className="dark group w-full overflow-hidden border-r border-mineshaft-600 bg-gradient-to-tr from-mineshaft-700 via-mineshaft-800 to-mineshaft-900 md:w-60" + className={twMerge( + "dark group z-10 w-full overflow-hidden border-r border-mineshaft-600 bg-gradient-to-tr from-mineshaft-700 via-mineshaft-800 to-mineshaft-900 md:w-60", + !(sidebarStyle === SidebarStyle.Expanded) && "absolute bottom-0 left-0" + )} >