diff --git a/site/layouts/partials/scripts.html b/site/layouts/partials/scripts.html
index dc92d30e5a..3ed9f8ad42 100644
--- a/site/layouts/partials/scripts.html
+++ b/site/layouts/partials/scripts.html
@@ -38,7 +38,7 @@
StackBlitzSDK.openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
const markup = `
-
+
@@ -46,24 +46,81 @@
Bootstrap Example
<${'script'} src="{{ .Site.Params.cdn.js_bundle }}">${'script'}>
+ <${'script'} src="https://getbootstrap.com/docs/{{ .Site.Params.docs_version }}/assets/js/color-modes.js">${'script'}>
${htmlSnippet.replace(/^/gm, ' ')}
+
+
+
+
+
+
+
+
+ -
+
+
+ -
+
+
+ -
+
+
+
+
+
+
`
- const jsSnippetContent = jsSnippet ? '{{ os.ReadFile "site/assets/js/snippets.js" }}' : null
+ const colorModeSnippet = '{{ os.ReadFile "site/static/docs/5.3/assets/js/color-modes.js" }}'
+ const jsSnippetContent = jsSnippet ? '{{ os.ReadFile "site/assets/js/snippets.js" }}' + colorModeSnippet : colorModeSnippet
const project = {
files: {
'index.html': markup,
- 'index.js': jsSnippetContent
+ 'index.js': jsSnippetContent.replace(/}\)\(\).*\(\(\) => {.*'use strict'/gms, '').replace(/window.add.*\(\) => {([\s\S]*)}\)([\s\S]}\)\(\))/gm, '$1 $2')
},
title: 'Bootstrap Example',
description: `Official example from ${window.location.href}`,
- template: jsSnippet ? 'javascript' : 'html',
+ template: 'javascript',
tags: ['bootstrap']
}