Refactor more docs

Author: wooorm

Diff for: docs/_asset/editor.jsx

@@ -93,12 +93,12 @@ const grammars = [
 /** @type {Awaited<ReturnType<typeof createStarryNight>>} */
 let starryNight
 
-const body = document.querySelector('.body')
+const editor = document.querySelector('#js-editor')
 
-if (body && window.location.pathname === '/playground/') {
+if (window.location.pathname === '/playground/' && editor) {
   const root = document.createElement('div')
   root.classList.add('playground')
-  body.after(root)
+  editor.after(root)
   init(root)
 }
 
@@ -204,7 +204,10 @@ function Playground() {
 
         if (show === 'result') {
           /** @type {MDXModule} */
-          const mod = await run(String(file), runtime)
+          const mod = await run(String(file), {
+            ...runtime,
+            baseUrl: window.location.href
+          })
 
           return (
             <ErrorBoundary FallbackComponent={ErrorFallback}>

Diff for: docs/_asset/index.css

@@ -331,7 +331,6 @@ hr {
 table {
   border-collapse: collapse;
   border-spacing: 0;
-  display: block;
   overflow: auto;
   width: 100%;
   font-variant-numeric: lining-nums;
@@ -539,6 +538,16 @@ button.success {
   );
 }
 
+.full-bleed {
+  width: 100vw;
+  position: relative;
+  left: 50%;
+  right: 50%;
+  margin-left: -50vw;
+  margin-right: -50vw;
+  padding-inline: calc(1em + 1ex);
+}
+
 /* Note that the `backdrop-filter` itself is applied in light mode. */
 @supports (backdrop-filter: blur(1ex)) {
   .navigation::before {
@@ -1224,7 +1233,6 @@ details[open] {
   grid-template-columns: 49% 49%;
   min-height: 40rem;
   gap: calc(1em + 1ex);
-  margin-inline: calc(1em + 1ex);
 }
 
 .playground-area,