[WEB-4462] improvement: UI enhancements for desktop app to support side rail (#3608)

Co-authored-by: sriram veeraghanta <veeraghanta.sriram@gmail.com>

apps/web/ee/components/desktop/root.tsx

@@ -7,24 +7,20 @@ import { isDesktopApp } from "@todesktop/client-core/platform/todesktop";
 import { observer } from "mobx-react";
 // helpers
 import { cn } from "@plane/utils";
-// hooks
-import { useAppTheme } from "@/hooks/store";
 // desktop app components
 import { SidebarToggle, DesktopAppNavigation, useDesktopApp, DesktopAppProvider } from "@/plane-web/components/desktop";
 
 const DesktopAppRoot: FC = observer(() => {
   // store hooks
-  const { sidebarCollapsed } = useAppTheme();
   const { pageTitle, isFullScreen } = useDesktopApp();
 
   return (
     <>
-      <div className="header fixed top-0 left-0 flex gap-4 items-center w-full h-9">
+      <div className="header fixed top-0 left-0 flex gap-4 items-center w-full h-8">
         <div
           className={cn(
             "flex flex-shrink-0 gap-0.5 items-center justify-end w-[160px] transition-all duration-300 ease-in-out",
             {
-              "md:w-[250px]": !sidebarCollapsed,
               "pl-3 justify-start": isFullScreen,
             }
           )}

apps/web/styles/globals.css

@@ -1006,8 +1006,7 @@ div.web-view-spinner div.bar12 {
 html.todesktop body {
   height: 100vh;
   width: 100%;
-  padding: 8px;
-  padding-top: 36px;
+  padding-top: 32px;
 }
 
 html.todesktop .app-container {
@@ -1017,11 +1016,10 @@ html.todesktop .app-container {
   contain: layout style size;
   contain-intrinsic-size: 100%;
   position: relative; /* Ensure it's the containing block */
-  border: 1px solid rgb(var(--color-border-200));
-  border-radius: 6px;
 }
 
 html.todesktop .header {
+  background-color: rgb(var(--color-background-90));
   -webkit-app-region: drag;
 }