Update skyvern UI responsiveness (#1098)

Co-authored-by: Muhammed Salih Altun <muhammedsalihaltun@gmail.com>

skyvern-frontend/src/routes/root/SidebarContent.tsx

@@ -0,0 +1,50 @@
+import { Logo } from "@/components/Logo";
+import { LogoMinimized } from "@/components/LogoMinimized";
+import { useSidebarStore } from "@/store/SidebarStore";
+import { Link } from "react-router-dom";
+import { SideNav } from "./SideNav";
+import { cn } from "@/util/utils";
+import { Button } from "@/components/ui/button";
+import { PinLeftIcon, PinRightIcon } from "@radix-ui/react-icons";
+
+type Props = {
+  useCollapsedState?: boolean;
+};
+
+function SidebarContent({ useCollapsedState }: Props) {
+  const { collapsed: collapsedState, setCollapsed } = useSidebarStore();
+  const collapsed = useCollapsedState ? collapsedState : false;
+
+  return (
+    <div className="flex h-full flex-col">
+      <Link to={window.location.origin}>
+        <div className="flex h-24 items-center">
+          {collapsed ? <LogoMinimized /> : <Logo />}
+        </div>
+      </Link>
+      <SideNav collapsed={collapsed} />
+      <div
+        className={cn("mt-auto flex min-h-16", {
+          "justify-center": collapsed,
+          "justify-end": !collapsed,
+        })}
+      >
+        <Button
+          size="icon"
+          variant="ghost"
+          onClick={() => {
+            setCollapsed(!collapsed);
+          }}
+        >
+          {collapsed ? (
+            <PinRightIcon className="h-6 w-6" />
+          ) : (
+            <PinLeftIcon className="hidden h-6 w-6 lg:block" />
+          )}
+        </Button>
+      </div>
+    </div>
+  );
+}
+
+export { SidebarContent };