root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 11 Packages Projects Releases Wiki Activity

docs: improve stackblitz.js 

* tweak indentation
* stop extending the sdk object
* conditionally add `index.js`
This commit is contained in:
XhmikosR 2023-08-02 10:38:19 +03:00
parent 24f749cb76
commit d867ee08b9
1 changed files with 10 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
site/assets/js/stackblitz.js
View File

@ -28,12 +28,12 @@ document.querySelectorAll('.btn-edit').forEach(btn => {
// Get extra classes for this example // Get extra classes for this example
const classes = Array.from(exampleEl.classList).join(' ') const classes = Array.from(exampleEl.classList).join(' ')
sdk.openBootstrapSnippet(htmlSnippet, jsSnippet, classes) openBootstrapSnippet(htmlSnippet, jsSnippet, classes)
}) })
}) })
sdk.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => { const openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
const markup = `<!doctype html> const indexHtml = `<!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -44,18 +44,17 @@ sdk.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
<${'script'} src="${jsBundleCdn}"></${'script'}> <${'script'} src="${jsBundleCdn}"></${'script'}>
</head> </head>
<body class="p-3 m-0 border-0 ${classes}"> <body class="p-3 m-0 border-0 ${classes}">
<!-- Example Code Start-->
<!-- Example Code --> ${htmlSnippet.trimStart().replace(/^/gm, ' ').replace(/^ {4}$/gm, '').trimEnd()}
${htmlSnippet.replace(/^/gm, ' ')} <!-- Example Code End -->
<!-- End Example Code -->
</body> </body>
</html>` </html>
`
const jsSnippetContent = jsSnippet ? jsSnippetFile : null
const project = { const project = {
files: { files: {
'index.html': markup, 'index.html': indexHtml,
'index.js': jsSnippetContent ...(jsSnippet && { 'index.js': jsSnippetFile })
}, },
title: 'Bootstrap Example', title: 'Bootstrap Example',
description: `Official example from ${window.location.href}`, description: `Official example from ${window.location.href}`,