Remove unnecessary wrapper div around sidebar

web/components/nav/nav-bar.tsx

@@ -137,7 +137,7 @@ export function MobileSidebar(props: {
                 </div>
               </Transition.Child>
               <div className="mx-2 mt-5 h-0 flex-1 overflow-y-auto">
-                <Sidebar />
+                <Sidebar className="pl-2" />
               </div>
             </div>
           </Transition.Child>

web/components/nav/sidebar.tsx

@@ -110,7 +110,8 @@ function MoreButton() {
   )
 }
 
-export default function Sidebar() {
+export default function Sidebar(props: { className?: string }) {
+  const { className } = props
   const router = useRouter()
   const currentPage = router.pathname
 
@@ -124,7 +125,7 @@ export default function Sidebar() {
     user === null ? signedOutMobileNavigation : mobileNavigation
 
   return (
-    <nav aria-label="Sidebar" className="sticky top-4 divide-gray-300 pl-2">
+    <nav aria-label="Sidebar" className={className}>
       <div className="space-y-1 pb-6">
         <ManifoldLogo twoLine />
       </div>

web/components/page.tsx

@@ -20,9 +20,7 @@ export function Page(props: {
         )}
         style={suspend ? visuallyHiddenStyle : undefined}
       >
-        <div className="hidden lg:col-span-2 lg:block">
-          <Sidebar />
-        </div>
+        <Sidebar className="sticky top-4 hidden divide-gray-300 self-start pl-2 lg:col-span-2 lg:block" />
         <main
           className={clsx(
             'lg:col-span-8',