style/responsive sidebar (#3505)

* style: added sidebar toggle in all the screens for mobile responsive

* chore: close sidebar on click of empty space when opened

* chore: setting the sidebar collapsed in smaller screens
This commit is contained in:
Ramesh Kumar Chandra 2024-01-30 15:22:24 +05:30 committed by GitHub
parent 9debd81a50
commit c6d6b9a0e9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
28 changed files with 195 additions and 89 deletions

View file

@ -0,0 +1,16 @@
import { FC } from "react";
import { Menu } from "lucide-react";
import { useApplication } from "hooks/store";
import { observer } from "mobx-react";
export const SidebarHamburgerToggle: FC = observer (() => {
const { theme: themStore } = useApplication();
return (
<div
className="w-7 h-7 rounded flex justify-center items-center bg-custom-background-80 transition-all hover:bg-custom-background-90 cursor-pointer group md:hidden"
onClick={() => themStore.toggleSidebar()}
>
<Menu size={14} className="text-custom-text-200 group-hover:text-custom-text-100 transition-all" />
</div>
);
});