diff --git a/frontend/src/routes/AppLayout.tsx b/frontend/src/routes/AppLayout.tsx index d8c7801..491c33b 100755 --- a/frontend/src/routes/AppLayout.tsx +++ b/frontend/src/routes/AppLayout.tsx @@ -36,7 +36,7 @@ export default function AppLayout() { showSidebar ? "translate-x-64" : "translate-x-12" )} > -
+
diff --git a/frontend/src/routes/dashboard/_components/tabs/Subpanel.tsx b/frontend/src/routes/dashboard/_components/Subpanel.tsx similarity index 100% rename from frontend/src/routes/dashboard/_components/tabs/Subpanel.tsx rename to frontend/src/routes/dashboard/_components/Subpanel.tsx diff --git a/frontend/src/routes/dashboard/_components/tabs/subpanel.module.css b/frontend/src/routes/dashboard/_components/subpanel.module.css similarity index 93% rename from frontend/src/routes/dashboard/_components/tabs/subpanel.module.css rename to frontend/src/routes/dashboard/_components/subpanel.module.css index f41ca25..c6ae936 100644 --- a/frontend/src/routes/dashboard/_components/tabs/subpanel.module.css +++ b/frontend/src/routes/dashboard/_components/subpanel.module.css @@ -1,11 +1,9 @@ .subpanel-wrapper { - @apply mt-5 flex-col justify-between h-full + @apply flex flex-col justify-between relative flex-shrink h-full pr-2; } - -.subpanel { - @apply flex flex-col pb-2 first:pt-8 +.subpanel-section { + @apply py-1 px-1 flex flex-col; } - .subpanel > p { @apply text-sm py-4 font-medium text-slate-500 focus:outline-none cursor-pointer px-2 } @@ -16,7 +14,6 @@ .subpanel-header p { @apply text-sm px-1 font-black leading-3 text-slate-600 focus:outline-none cursor-pointer } - .subpanel-header svg { @apply h-5 w-5 mr-2 hover:rotate-3 origin-center text-slate-600 ml-auto transform focus:outline-none cursor-pointer } @@ -29,10 +26,6 @@ @apply rotate-0; } -.subpanel-section { - @apply overflow-x-clip overflow-y-hidden py-1 px-1; -} - .subpanel-link { @apply mb-1 focus:outline-none bg-transparent border rounded-md border-transparent hover:to-mirage-400/20 hover:bg-gradient-to-bl hover:border-mirage-700/70 hover:translate-x-px z-50 transition-transform hover:from-mirage-400/10 text-slate-400 hover:text-slate-400/20 focus:bg-mirage-500/60 focus:text-slate-400/40 w-full flex items-center -translate-x-px } diff --git a/frontend/src/routes/dashboard/_components/tabs/EntitiesPanel.tsx b/frontend/src/routes/dashboard/_components/tabs/EntitiesPanel.tsx index 06c9682..ad3d343 100644 --- a/frontend/src/routes/dashboard/_components/tabs/EntitiesPanel.tsx +++ b/frontend/src/routes/dashboard/_components/tabs/EntitiesPanel.tsx @@ -1,7 +1,7 @@ import { useUpdateEntityFavoriteIdMutation } from "@src/app/api"; import { useMemo, useState } from "react"; -import styles from "./subpanel.module.css" -import Subpanel from "./Subpanel"; +import styles from "../subpanel.module.css" +import Subpanel from "../Subpanel"; export default function EntitiesPanel({ diff --git a/frontend/src/routes/dashboard/_components/tabs/GraphPanel.tsx b/frontend/src/routes/dashboard/_components/tabs/GraphPanel.tsx index 5925869..91f63c4 100644 --- a/frontend/src/routes/dashboard/_components/tabs/GraphPanel.tsx +++ b/frontend/src/routes/dashboard/_components/tabs/GraphPanel.tsx @@ -2,8 +2,8 @@ import { AllGraphsList, useUpdateGraphFavoriteIdMutation } from '@src/app/api'; import { useMemo, useState } from "react"; import { FetchBaseQueryError } from '@reduxjs/toolkit/query'; import { SerializedError } from '@reduxjs/toolkit'; -import styles from "./subpanel.module.css" -import Subpanel from './Subpanel'; +import styles from "../subpanel.module.css" +import Subpanel from '../Subpanel'; export function GraphLoaderCard() { diff --git a/frontend/src/routes/dashboard/_components/tabs/MarketPanel.tsx b/frontend/src/routes/dashboard/_components/tabs/MarketPanel.tsx index ba82b48..c7ff3ef 100644 --- a/frontend/src/routes/dashboard/_components/tabs/MarketPanel.tsx +++ b/frontend/src/routes/dashboard/_components/tabs/MarketPanel.tsx @@ -1,6 +1,6 @@ import { useState } from 'react' -import Subpanel from './Subpanel' -import styles from './subpanel.module.css' +import Subpanel from '../Subpanel' +import styles from '../subpanel.module.css' export default function MarketPanel() { const [showProviders, setShowProviders] = useState(false) diff --git a/frontend/src/routes/dashboard/index.module.css b/frontend/src/routes/dashboard/index.module.css index 0528e09..db0d30c 100644 --- a/frontend/src/routes/dashboard/index.module.css +++ b/frontend/src/routes/dashboard/index.module.css @@ -1,6 +1,6 @@ /* wraps the sidebar with search and the main view */ .sidebar-wrapper { - @apply rounded py-px !min-w-[20rem] max-w-[20rem] flex flex-col w-full pt-3.5 pb-6 border-r-[3px] border-mirage-700/70 from-mirage-600/20 to-mirage-500/20 bg-gradient-to-br pl-2 max-h-screen justify-between shadow-xl + @apply rounded py-px !min-w-[20rem] max-w-[20rem] flex-col h-screen pt-3.5 border-r-[3px] border-mirage-700/70 from-mirage-600/20 to-mirage-500/20 bg-gradient-to-br pl-2 justify-between shadow-xl flex relative w-full overflow-y-scroll } .search-container { @@ -19,11 +19,11 @@ } .dashboard-tabs { - @apply max-h-screen h-full overflow-y-scroll relative pr-2 + @apply overflow-y-hidden flex-grow h-full pb-12 } .tabs-list { - @apply flex justify-between w-full rounded p-1 absolute; + @apply flex justify-between w-full rounded p-1 ; } .tab { @apply focus:outline-none transition-colors duration-200 ease-in-out flex items-center justify-center py-2.5 px-0 font-display rounded min-w-[6rem] text-sm leading-none z-20 diff --git a/frontend/src/routes/dashboard/index.tsx b/frontend/src/routes/dashboard/index.tsx index 67d7999..4a0e3ff 100755 --- a/frontend/src/routes/dashboard/index.tsx +++ b/frontend/src/routes/dashboard/index.tsx @@ -88,7 +88,7 @@ export default function DashboardPage() { return ( <> -
+