docs: improve stackblitz.js

* tweak indentation * stop extending the sdk object * conditionally add `index.js`
twbs · Mar 18, 2024 · c7c234f · c7c234f
1 parent e313615
commit c7c234f
Showing 1 changed file with 10 additions and 10 deletions.
diff --git a/site/assets/js/stackblitz.js b/site/assets/js/stackblitz.js
@@ -28,12 +28,12 @@ document.querySelectorAll('.btn-edit').forEach(btn => {
     // Get extra classes for this example
     const classes = Array.from(exampleEl.classList).join(' ')
 
-    sdk.openBootstrapSnippet(htmlSnippet, jsSnippet, classes)
+    openBootstrapSnippet(htmlSnippet, jsSnippet, classes)
   })
 })
 
-sdk.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
-  const markup = `<!doctype html>
+const openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
+  const html = `<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8">
@@ -45,17 +45,17 @@ sdk.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
   </head>
   <body class="p-3 m-0 border-0 ${classes}">
 
-    <!-- Example Code -->
-${htmlSnippet.replace(/^/gm, '    ')}
-    <!-- End Example Code -->
+    <!-- Example Code Start-->
+${htmlSnippet.trimStart().replace(/^/gm, '    ').replace(/^ {4}$/gm, '').trimEnd()}
+    <!-- Example Code End -->
   </body>
-</html>`
+</html>
+`
 
-  const jsSnippetContent = jsSnippet ? jsSnippetFile : null
   const project = {
     files: {
-      'index.html': markup,
-      'index.js': jsSnippetContent
+      'index.html': html,
+      ...(jsSnippet && { 'index.js': jsSnippetFile })
     },
     title: 'Bootstrap Example',
     description: `Official example from ${window.location.href}`,