Update Next.js TypeScript configuration and Playground layout

playcanvas · Jan 16, 2025 · d0f0d91 · d0f0d91
1 parent 535c795
commit d0f0d91
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 6 deletions.
diff --git a/packages/docs/next-env.d.ts b/packages/docs/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
diff --git a/packages/docs/src/app/_meta.global.ts b/packages/docs/src/app/_meta.global.ts
@@ -29,6 +29,7 @@ export default {
   playground: {
 
     title: 'Playground',
+    theme: { footer: false },
     items: {
       "Basic" : {
         type: 'separator',
@@ -45,6 +46,9 @@ export default {
       'model-viewer' : '',
       'physics' : '',
       'motion' : '',
+      'splats': {
+        display: 'hidden'
+      }
     },
   },
   '---': {

diff --git a/packages/docs/src/app/layout.tsx b/packages/docs/src/app/layout.tsx
@@ -53,7 +53,7 @@ export default async function RootLayout({ children }: { children: React.ReactNo
       <body>
         <Layout
           banner={<Banner storageKey="0.2.1-release"><a href="https://github.com/playcanvas/react/releases/tag/v0.2.1" target="_blank" rel="noreferrer">
-            🎉 <b>@playcanvas/react 0.2.0</b> is released. Read more →
+            🎉 <b>@playcanvas/react 0.2.1</b> is released. Read more →
           </a></Banner>}
           navbar={navbar}
           footer={<Footer>

diff --git a/packages/docs/src/content/primitives.mdx b/packages/docs/src/content/primitives.mdx
@@ -49,7 +49,7 @@ export const Primitives = () => {
             <ShadowCatcher width={5} depth={5} />
         </Entity>
 
-        <div className='absolute bottom-0 top-10 p-12'>
+        <div className='absolute bottom-0 top-22 p-18'>
             {buttons}
         </div>
 

diff --git a/packages/docs/src/docs-components/Playground.tsx b/packages/docs/src/docs-components/Playground.tsx
@@ -64,7 +64,7 @@ const PlayGround: FC<PlaygroundProps> = ({
             <div id='leva-portal' className='h-0' onMouseMove={e => e.stopPropagation() } >
                 <Leva collapsed hidden/>
             </div>
-            <div className="w-screen h-screen" ref={resizeRef} >
+            <div className="absolute w-screen h-screen top-0 -z-10" ref={resizeRef} >
                 <Application usePhysics fillMode={FILLMODE_NONE} resolutionMode={RESOLUTION_AUTO} >
                     <ResizeHandler resizeRef={resizeRef}/>
                     <Suspense >
@@ -74,10 +74,10 @@ const PlayGround: FC<PlaygroundProps> = ({
             </div>
             { showCodeEditor && <Suspense>
                 <div 
-                    className='absolute top-[var(--nextra-navbar-height)] h-[calc(100vh-var(--nextra-navbar-height))] flex mx-auto max-w-[90rem] xl:p-8'
+                    className='absolute p-0 lg:p-12 top-[calc(var(--nextra-navbar-height)+var(--nextra-banner-height))] h-[calc(100vh-var(--nextra-navbar-height)-var(--nextra-banner-height))] flex mx-auto max-w-[90rem] xl:p-8'
                     onMouseMove={e => e.stopPropagation() }
                 >
-                    <div className='w-screen xl:w-xl overflow-hidden rounded-xl shadow-lg opacity-100 hover:opacity-90 focused:opacity-90 transition-opacity duration-300'>
+                    <div className='w-screen lg:w-lg overflow-hidden rounded-xl shadow-lg opacity-100 hover:opacity-90 focused:opacity-90 transition-opacity duration-300'>
                         <div id='code-editor-header' className='flex justify-between items-center p-2 bg-zinc-800 px-4'>
                             <div id='code-editor-title' className='flex text-xs items-center justify-between font-mono opacity-80 w-full'>
                                 <TerminalIcon className='w-4 h-4' />