Layout tweaks

Author: zenoachtig

packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx

@@ -144,7 +144,6 @@ export function SpaceLayout(props: SpaceLayoutProps) {
                             <div
                                 className={tcls(
                                     'pr-4',
-                                    'mt-2',
                                     'flex',
                                     withTopHeader ? 'lg:hidden' : '',
                                     'grow-0',

packages/gitbook/src/components/TableOfContents/TableOfContents.tsx

@@ -73,8 +73,7 @@ export async function TableOfContents(props: {
                     'lg:page-no-toc:[html[style*="--outline-top-offset"]_&]:top-(--outline-top-offset)!',
                     'lg:page-no-toc:[html[style*="--outline-height"]_&]:top-(--outline-height)!',
 
-                    'pt-6',
-                    'pb-4',
+                    'py-6',
                     'lg:sidebar-filled:pr-6',
                     'lg:page-no-toc:pr-0',
                     'max-lg:pl-8',
@@ -95,6 +94,7 @@ export async function TableOfContents(props: {
                         '[html.sidebar-filled.theme-muted_&]:bg-tint-base',
                         '[html.sidebar-filled.theme-bold.tint_&]:bg-tint-base',
                         '[html.sidebar-filled.theme-gradient_&]:border',
+                        'max-lg:sidebar-filled:border',
                         'page-no-toc:bg-transparent!',
                         'page-no-toc:border-none!',
 
@@ -107,7 +107,10 @@ export async function TableOfContents(props: {
                         <div className="flex flex-col gap-4 px-5 empty:hidden">{innerHeader}</div>
                     ) : null}
                     <TOCScrollContainer // The scrollview inside the sidebar
-                        className={tcls('flex grow flex-col p-2', 'hide-scrollbar overflow-y-auto')}
+                        className={tcls(
+                            'flex grow flex-col p-2 pt-4 ',
+                            'hide-scrollbar overflow-y-auto'
+                        )}
                     >
                         <PagesList
                             pages={pages}

packages/gitbook/src/components/TableOfContents/Trademark.tsx

@@ -20,10 +20,12 @@ export function Trademark(props: {
                 'sticky',
                 'z-2',
 
+                'mt-auto',
                 'inset-x-0',
                 '-bottom-2',
                 '-mb-2',
                 'sidebar-filled:pb-2',
+                'page-no-toc:pb-0',
 
                 'pointer-events-none',
 
@@ -32,6 +34,7 @@ export function Trademark(props: {
                 'theme-muted:bg-tint-subtle',
                 '[html.sidebar-filled.theme-muted_&]:bg-tint-base',
                 '[html.sidebar-filled.theme-bold.tint_&]:bg-tint-base',
+                'lg:page-no-toc:bg-transparent',
 
                 'rounded-lg',
                 'straight-corners:rounded-none',
@@ -65,9 +68,6 @@ export function TrademarkLink(props: {
             href={url.toString()}
             className={tcls(
                 'text-sm',
-                // 'lg:max-xl:page-no-toc:text-xs',
-                // 'lg:max-xl:page-no-toc:px-3',
-                // 'lg:max-xl:page-no-toc:py-3',
                 'font-semibold',
                 'text-tint',
 

packages/gitbook/src/components/primitives/SideSheet.tsx

@@ -167,7 +167,7 @@ export function SideSheetScrim(props: { className?: ClassValue; onClick?: () =>
                 }
             }}
             className={tcls(
-                'fixed inset-0 z-40 items-start bg-tint-base/3 not-hydrated:opacity-0 starting:opacity-0 backdrop-blur-md starting:backdrop-blur-none transition-[opacity,display,backdrop-filter] transition-discrete duration-250 dark:bg-tint-base/9',
+                'fixed inset-0 z-40 items-start bg-tint-base/3 not-hydrated:opacity-0 starting:opacity-0 backdrop-blur-md starting:backdrop-blur-none transition-[opacity,display,backdrop-filter] transition-discrete duration-250 dark:bg-tint-base/6',
                 className
             )}
         />