diff --git a/site/layouts/partials/scripts.html b/site/layouts/partials/scripts.html index 3ed9f8ad42..4f22d7c692 100644 --- a/site/layouts/partials/scripts.html +++ b/site/layouts/partials/scripts.html @@ -46,77 +46,124 @@ Bootstrap Example <${'script'} src="{{ .Site.Params.cdn.js_bundle }}"> - <${'script'} src="https://getbootstrap.com/docs/{{ .Site.Params.docs_version }}/assets/js/color-modes.js"> ${htmlSnippet.replace(/^/gm, ' ')} - - - - - - - - - - - - - - - - - - - -
- - -
- - ` + const colorModeMarkup = `document.querySelector('body').innerHTML += \` + + + + + + + + + + + + + + + + + +
+ + +
+ +\` + +` + 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 jsSnippetContent = jsSnippet ? 'import "./bootstrap-color-mode/color-mode.js";\n\n' + '{{ os.ReadFile "site/assets/js/snippets.js" }}' : 'import "./bootstrap-color-mode/color-mode.js";' const project = { files: { 'index.html': markup, - 'index.js': jsSnippetContent.replace(/}\)\(\).*\(\(\) => {.*'use strict'/gms, '').replace(/window.add.*\(\) => {([\s\S]*)}\)([\s\S]}\)\(\))/gm, '$1 $2') + 'index.js': jsSnippetContent, + 'bootstrap-color-mode/color-mode.js': colorModeMarkup + colorModeSnippet.replace(/\(\(\) => {.*'use strict'/gms, '').replace(/window.add.*\(\) => {([\s\S]*)}\)([\s\S]}\)\(\))/gm, '$1 $2').replace(/^}\)\(\)/gm, '') }, title: 'Bootstrap Example', description: `Official example from ${window.location.href}`,