Docs site restructure v3

.gitignore

@@ -7,4 +7,8 @@ src/static/*
 !src/static/bloblang-docs.json
 test-results.*
 test-results-*.*
-.playwright-mcp/
+.playwright-mcp/
+
+# Test screenshots
+*.png
+!/src/img/*.png

context/header.json

@@ -6,13 +6,13 @@
     },
     "homeUrl": "/",
     "components": {
-      "redpanda-labs": {
+      "labs": {
         "latest": {
           "title": "Labs",
-          "url": "/redpanda-labs/",
+          "url": "/labs/",
           "asciidoc": {
             "attributes": {
-              "page-header-data": {
+              "component-metadata": {
                 "order": 4
               }
             }
@@ -25,38 +25,39 @@
           "url": "/api/"
         }
       },
-      "redpanda-cloud": {
+      "cloud-data-platform": {
         "latest": {
           "title": "Cloud",
-          "url": "/redpanda-cloud/home/",
+          "url": "/cloud-data-platform/home/",
           "asciidoc": {
             "attributes": {
-              "page-header-data": {
-                "order": 1              }
+              "component-metadata": {
+                "order": 1
+              }
             }
           }
         }
       },
-      "redpanda-connect": {
+      "connect": {
         "latest": {
           "title": "Connect",
-          "url": "/redpanda-connect/home/",
+          "url": "/connect/home/",
           "asciidoc": {
             "attributes": {
-              "page-header-data": {
+              "component-metadata": {
                 "order": 3
               }
             }
           }
         }
       },
-      "ROOT": {
+      "streaming": {
         "latest": {
-          "title": "Self-Managed",
+          "title": "Streaming",
           "url": "/current/home/",
           "asciidoc": {
             "attributes": {
-              "page-header-data": {
+              "component-metadata": {
                 "order": 2
               }
             }
@@ -72,8 +73,8 @@
       "latest": {
         "asciidoc": {
           "attributes": {
-            "page-header-data": {
-              "color": "#d73d23"
+            "component-metadata": {
+              "color": "#4338ca"
             }
           }
         }
@@ -82,4 +83,3 @@
   },
   "uiRootPath": "/_"
 }
-

gulp.d/tasks/build-preview-pages.js

@@ -18,7 +18,14 @@ module.exports = (src, previewSrc, previewDest, sink = () => map()) => (done) =>
   Promise.all([
     loadSampleUiModel(previewSrc),
     toPromise(
-      merge(compileLayouts(src), registerPartials(src), registerHelpers(src), registerVendorsCss(src), registerVendorsJs(src), copyImages(previewSrc, previewDest))
+      merge(
+        compileLayouts(src),
+        registerPartials(src),
+        registerHelpers(src),
+        registerVendorsCss(src),
+        registerVendorsJs(src),
+        copyImages(previewSrc, previewDest)
+      )
     ),
   ])
     .then(([baseUiModel, { layouts }]) => {

gulp.d/tasks/build.js

@@ -47,7 +47,7 @@ module.exports = (src, dest, preview) => () => {
         },
       },
     ]),
-    postcssVar({ preserve: preview }),
+    postcssVar({ preserve: true }),
     // NOTE to make vars.css available to all top-level stylesheets, use the next line in place of the previous one
     //postcssVar({ importFrom: path.join(src, 'css', 'vars.css'), preserve: preview }),
     preview ? postcssCalc : () => {}, // cssnano already applies postcssCalc
@@ -82,7 +82,7 @@ module.exports = (src, dest, preview) => () => {
     vfs
       .src(['css/site.css', 'css/vendor/*.css'], { ...opts, sourcemaps })
       .pipe(postcss((file) => ({ plugins: postcssPlugins, options: { file } }))),
-    vfs.src('font/*.{ttf,woff*(2)}', opts),
+    vfs.src('font/**/*.{ttf,woff*(2)}', opts),
     vfs.src('img/**/*.{gif,ico,jpg,png,svg}', opts).pipe(
       preview
         ? through()
@@ -103,13 +103,16 @@ module.exports = (src, dest, preview) => () => {
     ),
     vfs.src('css/vendor/**/*.css', opts),
     // Copy remaining vendor JS files (excluding already minified/processed ones)
-    vfs.src([
-      'js/vendor/**/*.js',
-      '!js/vendor/prism/prism-line-highlight-plugin.js',
-      '!js/vendor/prism/prism-line-numbers-plugin.js',
-      '!js/vendor/*.bundle.js',
-      '!js/vendor/*.min.js',
-    ], opts),
+    vfs.src(
+      [
+        'js/vendor/**/*.js',
+        '!js/vendor/prism/prism-line-highlight-plugin.js',
+        '!js/vendor/prism/prism-line-numbers-plugin.js',
+        '!js/vendor/*.bundle.js',
+        '!js/vendor/*.min.js',
+      ],
+      opts
+    ),
     vfs.src('helpers/*.js', opts),
     vfs.src('layouts/*.hbs', opts),
     vfs.src('partials/*.hbs', opts),

gulp.d/tasks/generate-bloblang-grammar.js

@@ -22,7 +22,9 @@ function fetchText (url) {
         return
       }
       let data = ''
-      res.on('data', (chunk) => { data += chunk })
+      res.on('data', (chunk) => {
+        data += chunk
+      })
       res.on('end', () => resolve(data))
     })
     req.on('error', reject)

gulpfile.js

@@ -137,7 +137,15 @@ const buildWasmTask = createTask({
 
 const bundleBuildTask = createTask({
   name: 'bundle:build',
-  call: series(cleanTask, lintTask, generateBloblangGrammarTask, buildWasmTask, bundleReactTask, compileWidgets, buildTask),
+  call: series(
+    cleanTask,
+    lintTask,
+    generateBloblangGrammarTask,
+    buildWasmTask,
+    bundleReactTask,
+    compileWidgets,
+    buildTask
+  ),
 })
 
 const bundlePackTask = createTask({
@@ -176,7 +184,9 @@ const previewBuildTask = createTask({
 
 const previewServeTask = createTask({
   name: 'preview:serve',
-  call: task.serve(previewDestDir, serverConfig, () => watch([`${srcDir}/**/*`, `${previewSrcDir}/**/*`, `!${srcDir}/static/**`], previewBuildTask)),
+  call: task.serve(previewDestDir, serverConfig, () =>
+    watch([`${srcDir}/**/*`, `${previewSrcDir}/**/*`, `!${srcDir}/static/**`], previewBuildTask)
+  ),
 })
 
 const previewTask = createTask({